显示标记和多边形(javascript api v3)

时间:2014-10-15 20:00:48

标签: google-maps google-maps-api-3

我试图显示属于州界的标记。我正在使用下面提供的代码(这对于标记非常有效)但是当我向它添加状态边界多边形的多边形坐标数组时,我无法使其工作。任何有关如何为单个多边形添加坐标数组的帮助将不胜感激。谢谢。

<html> 
<head> 
<title>Web Map of Offices</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
html { height: 100% } 
body { height: 100%; margin: 0px; padding: 0px } 
#map_canvas { height: 100% } 
</style> 

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> 
</script> `enter code here`

<script type="text/javascript">

function initialize() { 
    var myLatlng = new google.maps.LatLng(38.895308,-80.304565);  
    var myOptions = {
    zoom: 8,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions) ;

    lats = new Array (38.3213861,38.4579809,38.8014155,38.9875643,38.8022869,39.2844968,39.4850848,39.6078332,39.0194418,38.9399985,40.065598,39.2648469,40.4019707,39.5641071,37.7924745,37.3602823,37.8212103,38.304694,38.401603,37.848631,37.5848663,39.4964831,39.401424,39.3356127,37.4360439,38.0121122,39.0713631);
    longs = new Array (-81.5816714,-81.931094,-81.3513514,-81.9755644,-81.7392611,-80.2709958,-80.1425781,-79.9180457,-80.4194388,-79.8539348,-80.722355,-81.5595981,-80.5868196,-80.9960285,-81.1929363,-81.0978385,-80.4235672,-80.830412,-82.492229,-81.993392,-81.3812904,-77.9541342,-79.0133107,-78.7457004,-81.6041864,-81.1274056,-78.9388241);
    hovertitle = new Array ("Charleston WVDRS","Teays Valley WVDRS","Spencer WVDRS","Point Pleasant WVDRS","Ripley WVDRS","Clarksburg WVDRS","Fairmont WVDRS","Morgantown WVDRS","Weston WVDRS","Elkins WVDRS","Wheeling WVDRS","Parkersburg WVDRS","Weirton WVDRS","Sistersville WVDRS","Beckley WVDRS","Princeton WVDRS","Lewisburg WVDRS","Summersville WVDRS","Huntington WVDRS","Logan WVDRS","Mullens WVDRS","Martinsburg WVDRS","Keyser WVDRS","Romney WVDRS","Welch WVDRS","Oak Hill WVDRS","Moorefield WVDRS");
    htmlAll = new Array ("<h5>Charleston WVDRS</h5><img src=offices/Charleston.png width=200 height=150><p>4701 MacCorkle Avenue SE<br>Charleston, WV 25304<br>304-356-<br>304-926-(Fax)</p><p><a href=directions/Charleston.html>Get Directions</a></p>", 
                        "<h5>Teays Valley WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150 alt=NeedPictureOfOffice><p>115 Liberty Square<br>Hurricane, WV 25526<br>304-760-(Phone)<br>304-759-(Fax)</p><p><a href=directions/TeaysValley.html>Get Directions</a></p>",
                        "<h5>Spencer WVDRS</h5><img src=offices/Spencer.png width=200 height=150><p>321 Market Street<br>Spencer, WV 25276<br>304-927-(Phone)<br>304-927-(Fax)</p><p><a href=directions/Spencer.html>Get Directions</a></p>",
                        "<h5>Point Pleasant WVDRS</h5><img src=offices/PointPleasant.png width=200 height=150><p>209 5th Street<br>Point Pleasant, WV 25550<br>304-675-(Phone)<br>304-675-(Fax)</p><p><a href=directions/PointPleasant.html>Get Directions</a>",
                        "<h5>Ripley WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>206 Stone Drive<br>Ripley, WV 25271<br>304-373-(Phone)<br>304-373-(Fax)</p><p><a href=directions/Ripley.html>Get Directions</a>",
                        "<h5>Clarksburg WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>107 Cambridge Place<br>Bridgeport, WV 26330<br>304-842-(Phone)<br>304-842-(Fax)</p><p><a href=directions/Clarksburg.html>Get Directions</a>",
                        "<h5>Fairmont WVDRS</h5><img src=offices/Fairmont.png width=200 height=150><p>Veterans Square<br>320 Adams Street, Suite 106<br>Fairmont, WV 26554<br>304-367-(Phone)<br>304-367-(Fax)</p><p><a href=directions/Fairmont.html>Get Directions</a>",
                        "<h5>Morgantown WVDRS</h5><img src=offices/Morgantown.png width=200 height =150><p>1415 Earl Core Road<br>Morgantown, WV 26505<br>304-285-(Phone)<br>304-285-(Fax)</p><p><a href=directions/Morgantown.html>Get Directions</a>",
                        "<h5>Weston WVDRS</h5><img src=offices/webmapDefault.png width=200 height =150><p>306 Market Place Mall<br>Weston, WV 26451<br>304-269-0547(Phone)<br>304-269-0427(Fax)</p><p><a href=directions/Weston.html>Get Directions</a>",
                        "<h5>Elkins WVDRS</h5><img src=offices/webmapDefault.png width=200 height =150><p>1025 North Randolph Avenue<br>Elkins, WV 26241<br>304-637-0205(Phone)<br>304-637-0209(Fax)</p><p><a href=directions/Elkins.html>Get Directions</a>",
                        "<h5>Wheeling WVDRS</h5><img src=offices/Wheeling.png width=200 height=150><p>Central Union Building<br>40 14th Street, Suite 103<br>Wheeling, WV 26003<br>304-238-1093(Phone)<br>304-238-1096(Fax)</p><p><a href=directions/Wheeling.html>Get Directions</a>",
                        "<h5>Parkersburg WVDRS</h5><img src=offices/Parkersburg.png width=200 height=150><p>State Office Building<br>400 5th Street<br>Parkersburg, WV 26101<br>304-420-4580(Phone)<br>304-420-4583(Fax)</p><p><a href=directions/Parkersburg.html>Get Directions</a>",
                        "<h5>Weirton WVDRS</h5><img src=offices/Weirton.png width=200 height=150><p>100 Municipal Plaza, Suite 200<br>Weirton, WV 26062<br>304-723-5311(Phone)<br>304-723-5318(Fax)</p><p><a href=directions/Weirton.html>Get Directions</a>",
                        "<h5>Sistersville WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>714 Wells Street<br>Sistersville, WV 26175<br>304-652-2354(Phone)<br>304-652-2359(Fax)</p><p><a href=directions/Sistersville.html>Get Directions</a>",
                        "<h5>Beckley WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>800 New River Town Center<br>Beckley, WV 25801<br>304-256-6900(Phone)<br>304-256-6903(Fax)</p><p><a href=directions/Beckley.html>Get Directions</a>",
                        "<h5>Princeton WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>195 Davis Street<br>Princeton, WV 24739<br>304-425-1256(Phone)<br>304-487-2631(Fax)</p><p><a href=directions/Princeton.html>Get Directions</a>",
                        "<h5>Lewisburg WVDRS</h5><img src=offices/Lewisburg.png width=200 height=150><p>777 North Jefferson Street, Suite 105<br>Lewisburg, WV 24901<br>304-647-7515(Phone)<br>304-647-7518(Fax)</p><p><a href=directions/Lewisburg.html>Get Directions</a>",
                        "<h5>Summersville WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>830 Northside Drive, Suite 113<br>Summersville, WV 26651<br>304-872-0813(Phone)<br>304-872-0518(Fax)</p><p><a href=directions/Summersville.html>Get Directions</a>",
                        "<h5>Huntington WVDRS</h5><img src=offices/Huntington.png width=200 height=150><p>2699 Park Avenue, Suite 200<br>Huntington, WV 25704<br>304-528-5585(Phone)<br>304-528-5591(Fax)</p><p><a href=directions/Huntington.html>Get Directions</a>",
                        "<h5>Logan WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>216 Dingess Street<br>Logan, WV 25601<br>304-792-7060(Phone)<br>304-792-7062(Fax)</p><p><a href=directions/Logan.html>Get Directions</a>",
                        "<h5>Mullens WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>316 Howard Avenue<br>Mullens,WV 25882<br>304-294-5653(Phone)<br>304-294-5655(Fax)</p><p><a href=directions/Mullens.html>Get Directions</a>",
                        "<h5>Martinsburg WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>489 Mid Atlantic Parkway, Suite 2<br>Martinsburg, WV 25404<br>304-267-0005(Phone)<br>304-267-0007(Fax)</p><p><a href=directions/Martinsburg.html>Get Directions</a>",
                        "<h5>Keyser WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>67 North Tornado Way<br>Keyser, WV 26726<br>304-788-2313(Phone)<br>304-788-6389(Fax)</p><p><a href=directions/Keyser.html>Get Directions</a>",
                        "<h5>Romney WVDRS</h5><img src=offices/Romney.png width=200 height=150><p>24948 Northwestern Pike<br>Romney, WV 26757<br>304-822-3957<br>304-822-7417</p><p><a href=directions/Romney.html>Get Directions</a>",
                        "<h5>Welch WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>110 Park Avenue<br>Welch, WV 24801<br>304-436-3175(Phone)<br>304-436-3176(Fax)</p><p><a href=directions/Welch.html>Get Directions</a>",
                        "<h5>Oak Hill WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>549 Mall Road<br>Oak Hill, WV 25901<br>304-465-3025(Phone)<br>304-465-3069(Fax)</p><p><a href=directions/OakHill.html>Get Directions</a>",
                        "<h5>Moorefield WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150 alt=NeedPictureOfOffice><p>151 Robert C. Byrd<br>Industrial Park Road, Suite 3<br>Moorefield, WV 26836<br>304-538-2701(Phone)<br>304-538-2718(Fax)</p><p><a href=directions/Moorefield.html>Get Directions</a>");


    markers = new Array ();
    for (var i = 0; i < 30; i++) {
    myLatlng = new google.maps.LatLng(lats[i],longs[i]);

    var contentString = htmlAll[i];
    var infowindow = new google.maps.InfoWindow({
    content: contentString
    });

    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
    html: htmlAll[i],
        title: hovertitle[i]
});

google.maps.event.addListener(marker, 'click', function() { 
  infowindow.setContent(this.html);
  infowindow.open(map,this);

});
}}

</script> 
</head> 

<body onLoad="initialize()"> 
<div id="map_canvas"></div> 
</body>
</noscript>
<div style="text-align: center;"><div style="position:relative; top:0; margin-right:auto;margin-    left:auto; z-index:99999">

</div></div> 
</html>

1 个答案:

答案 0 :(得分:0)

  1. 您不想为FusionTablesLayer创建新地图,您想将其添加到现有地图中。
  2. 您不能拥有无关的空白区域(表格ID末尾的额外空格)。
  3. 在初始化函数中(最后,或者至少在创建&#34; map&#34;之后),添加(仅显示&#34;西弗吉尼亚州&#34;仅使用FusionTables中的样式) UI):

        var layer = new google.maps.FusionTablesLayer({
            query: {
                select: 'geometry',
                from: '18_J2uuiZRLon48Lc6bclZ0ckHanbKZB9qg319KV3',
                where: "STATE_NAME CONTAINS IGNORING CASE 'West Virginia'"
            },
            options: {
                styleId: 2,
                templateId: 2
            }
        });
        layer.setMap(map);
    

    工作片段:

    &#13;
    &#13;
    function initialize() {
        var myLatlng = new google.maps.LatLng(38.895308, -80.304565);
        var myOptions = {
            zoom: 7,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
    
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    
        lats = new Array(38.3213861, 38.4579809, 38.8014155, 38.9875643, 38.8022869, 39.2844968, 39.4850848, 39.6078332, 39.0194418, 38.9399985, 40.065598, 39.2648469, 40.4019707, 39.5641071, 37.7924745, 37.3602823, 37.8212103, 38.304694, 38.401603, 37.848631, 37.5848663, 39.4964831, 39.401424, 39.3356127, 37.4360439, 38.0121122, 39.0713631);
        longs = new Array(-81.5816714, -81.931094, -81.3513514, -81.9755644, -81.7392611, -80.2709958, -80.1425781, -79.9180457, -80.4194388, -79.8539348, -80.722355, -81.5595981, -80.5868196, -80.9960285, -81.1929363, -81.0978385, -80.4235672, -80.830412, -82.492229, -81.993392, -81.3812904, -77.9541342, -79.0133107, -78.7457004, -81.6041864, -81.1274056, -78.9388241);
        hovertitle = new Array("Charleston WVDRS", "Teays Valley WVDRS", "Spencer WVDRS", "Point Pleasant WVDRS", "Ripley WVDRS", "Clarksburg WVDRS", "Fairmont WVDRS", "Morgantown WVDRS", "Weston WVDRS", "Elkins WVDRS", "Wheeling WVDRS", "Parkersburg WVDRS", "Weirton WVDRS", "Sistersville WVDRS", "Beckley WVDRS", "Princeton WVDRS", "Lewisburg WVDRS", "Summersville WVDRS", "Huntington WVDRS", "Logan WVDRS", "Mullens WVDRS", "Martinsburg WVDRS", "Keyser WVDRS", "Romney WVDRS", "Welch WVDRS", "Oak Hill WVDRS", "Moorefield WVDRS");
        htmlAll = new Array("<h5>Charleston WVDRS</h5><img src=offices/Charleston.png width=200 height=150><p>4701 MacCorkle Avenue SE<br>Charleston, WV 25304<br>304-356-<br>304-926-(Fax)</p><p><a href=directions/Charleston.html>Get Directions</a></p>",
            "<h5>Teays Valley WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150 alt=NeedPictureOfOffice><p>115 Liberty Square<br>Hurricane, WV 25526<br>304-760-(Phone)<br>304-759-(Fax)</p><p><a href=directions/TeaysValley.html>Get Directions</a></p>",
            "<h5>Spencer WVDRS</h5><img src=offices/Spencer.png width=200 height=150><p>321 Market Street<br>Spencer, WV 25276<br>304-927-(Phone)<br>304-927-(Fax)</p><p><a href=directions/Spencer.html>Get Directions</a></p>",
            "<h5>Point Pleasant WVDRS</h5><img src=offices/PointPleasant.png width=200 height=150><p>209 5th Street<br>Point Pleasant, WV 25550<br>304-675-(Phone)<br>304-675-(Fax)</p><p><a href=directions/PointPleasant.html>Get Directions</a>",
            "<h5>Ripley WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>206 Stone Drive<br>Ripley, WV 25271<br>304-373-(Phone)<br>304-373-(Fax)</p><p><a href=directions/Ripley.html>Get Directions</a>",
            "<h5>Clarksburg WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>107 Cambridge Place<br>Bridgeport, WV 26330<br>304-842-(Phone)<br>304-842-(Fax)</p><p><a href=directions/Clarksburg.html>Get Directions</a>",
            "<h5>Fairmont WVDRS</h5><img src=offices/Fairmont.png width=200 height=150><p>Veterans Square<br>320 Adams Street, Suite 106<br>Fairmont, WV 26554<br>304-367-(Phone)<br>304-367-(Fax)</p><p><a href=directions/Fairmont.html>Get Directions</a>",
            "<h5>Morgantown WVDRS</h5><img src=offices/Morgantown.png width=200 height =150><p>1415 Earl Core Road<br>Morgantown, WV 26505<br>304-285-(Phone)<br>304-285-(Fax)</p><p><a href=directions/Morgantown.html>Get Directions</a>",
            "<h5>Weston WVDRS</h5><img src=offices/webmapDefault.png width=200 height =150><p>306 Market Place Mall<br>Weston, WV 26451<br>304-269-0547(Phone)<br>304-269-0427(Fax)</p><p><a href=directions/Weston.html>Get Directions</a>",
            "<h5>Elkins WVDRS</h5><img src=offices/webmapDefault.png width=200 height =150><p>1025 North Randolph Avenue<br>Elkins, WV 26241<br>304-637-0205(Phone)<br>304-637-0209(Fax)</p><p><a href=directions/Elkins.html>Get Directions</a>",
            "<h5>Wheeling WVDRS</h5><img src=offices/Wheeling.png width=200 height=150><p>Central Union Building<br>40 14th Street, Suite 103<br>Wheeling, WV 26003<br>304-238-1093(Phone)<br>304-238-1096(Fax)</p><p><a href=directions/Wheeling.html>Get Directions</a>",
            "<h5>Parkersburg WVDRS</h5><img src=offices/Parkersburg.png width=200 height=150><p>State Office Building<br>400 5th Street<br>Parkersburg, WV 26101<br>304-420-4580(Phone)<br>304-420-4583(Fax)</p><p><a href=directions/Parkersburg.html>Get Directions</a>",
            "<h5>Weirton WVDRS</h5><img src=offices/Weirton.png width=200 height=150><p>100 Municipal Plaza, Suite 200<br>Weirton, WV 26062<br>304-723-5311(Phone)<br>304-723-5318(Fax)</p><p><a href=directions/Weirton.html>Get Directions</a>",
            "<h5>Sistersville WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>714 Wells Street<br>Sistersville, WV 26175<br>304-652-2354(Phone)<br>304-652-2359(Fax)</p><p><a href=directions/Sistersville.html>Get Directions</a>",
            "<h5>Beckley WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>800 New River Town Center<br>Beckley, WV 25801<br>304-256-6900(Phone)<br>304-256-6903(Fax)</p><p><a href=directions/Beckley.html>Get Directions</a>",
            "<h5>Princeton WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>195 Davis Street<br>Princeton, WV 24739<br>304-425-1256(Phone)<br>304-487-2631(Fax)</p><p><a href=directions/Princeton.html>Get Directions</a>",
            "<h5>Lewisburg WVDRS</h5><img src=offices/Lewisburg.png width=200 height=150><p>777 North Jefferson Street, Suite 105<br>Lewisburg, WV 24901<br>304-647-7515(Phone)<br>304-647-7518(Fax)</p><p><a href=directions/Lewisburg.html>Get Directions</a>",
            "<h5>Summersville WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>830 Northside Drive, Suite 113<br>Summersville, WV 26651<br>304-872-0813(Phone)<br>304-872-0518(Fax)</p><p><a href=directions/Summersville.html>Get Directions</a>",
            "<h5>Huntington WVDRS</h5><img src=offices/Huntington.png width=200 height=150><p>2699 Park Avenue, Suite 200<br>Huntington, WV 25704<br>304-528-5585(Phone)<br>304-528-5591(Fax)</p><p><a href=directions/Huntington.html>Get Directions</a>",
            "<h5>Logan WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>216 Dingess Street<br>Logan, WV 25601<br>304-792-7060(Phone)<br>304-792-7062(Fax)</p><p><a href=directions/Logan.html>Get Directions</a>",
            "<h5>Mullens WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>316 Howard Avenue<br>Mullens,WV 25882<br>304-294-5653(Phone)<br>304-294-5655(Fax)</p><p><a href=directions/Mullens.html>Get Directions</a>",
            "<h5>Martinsburg WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>489 Mid Atlantic Parkway, Suite 2<br>Martinsburg, WV 25404<br>304-267-0005(Phone)<br>304-267-0007(Fax)</p><p><a href=directions/Martinsburg.html>Get Directions</a>",
            "<h5>Keyser WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>67 North Tornado Way<br>Keyser, WV 26726<br>304-788-2313(Phone)<br>304-788-6389(Fax)</p><p><a href=directions/Keyser.html>Get Directions</a>",
            "<h5>Romney WVDRS</h5><img src=offices/Romney.png width=200 height=150><p>24948 Northwestern Pike<br>Romney, WV 26757<br>304-822-3957<br>304-822-7417</p><p><a href=directions/Romney.html>Get Directions</a>",
            "<h5>Welch WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>110 Park Avenue<br>Welch, WV 24801<br>304-436-3175(Phone)<br>304-436-3176(Fax)</p><p><a href=directions/Welch.html>Get Directions</a>",
            "<h5>Oak Hill WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150><p>549 Mall Road<br>Oak Hill, WV 25901<br>304-465-3025(Phone)<br>304-465-3069(Fax)</p><p><a href=directions/OakHill.html>Get Directions</a>",
            "<h5>Moorefield WVDRS</h5><img src=offices/webmapDefault.png width=200 height=150 alt=NeedPictureOfOffice><p>151 Robert C. Byrd<br>Industrial Park Road, Suite 3<br>Moorefield, WV 26836<br>304-538-2701(Phone)<br>304-538-2718(Fax)</p><p><a href=directions/Moorefield.html>Get Directions</a>");
    
    
        markers = new Array();
        for (var i = 0; i < 30; i++) {
            myLatlng = new google.maps.LatLng(lats[i], longs[i]);
    
            var contentString = htmlAll[i];
            var infowindow = new google.maps.InfoWindow({
                content: contentString
            });
    
            var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                html: htmlAll[i],
                title: hovertitle[i]
            });
    
            google.maps.event.addListener(marker, 'click', function () {
                infowindow.setContent(this.html);
                infowindow.open(map, this);
    
            });
        }
        var layer = new google.maps.FusionTablesLayer({
            query: {
                select: 'geometry',
                from: '18_J2uuiZRLon48Lc6bclZ0ckHanbKZB9qg319KV3',
                where: "STATE_NAME CONTAINS IGNORING CASE 'West Virginia'"
            },
            options: {
                styleId: 2,
                templateId: 2
            }
        });
        layer.setMap(map);
    }
    google.maps.event.addDomListener(window, 'load', initialize);
    &#13;
    html {
        height: 100%
    }
    body {
        height: 100%;
        margin: 0px;
        padding: 0px
    }
    #map_canvas {
        height: 100%
    }
    &#13;
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false&ext=.js"></script>
    <div id="map_canvas"></div>
    &#13;
    &#13;
    &#13;