同时显示标记和多边形（javascript api v3） [英] Display both Markers and Polygon (javascript api v3)
本文介绍了同时显示标记和多边形（javascript api v3）的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图显示属于状态边界的标记。我正在使用下面提供的代码（这对于标记非常适用），但是在向状态边界多边形添加一个多边形坐标数组时，无法使其工作。任何帮助如何添加单个多边形的坐标数组将不胜感激。谢谢。
< html>
< head>
< title>办公室的网页地图< / title>
< meta name =viewportcontent =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 / javascriptsrc =http://maps.google.com/maps/api/js?sensor=false>
< / script> `在这里输入代码`
< script type =text / javascript>
函数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 WVDRSLewisburg WVDRS ，Huntington WVDRS，Logan WVDRS，Mullens WVDRS，Martinsburg WVDRS，Keyser WVDRS，Romney WVDRS，Welch WVDRSOak Hill WVDRSMoorefield WVDRS
htmlAll = new Array（< h5> Charleston WVDRS< / h5>< img src = offices / Charleston.png width = 200 height = 150>< p> 4701 MacCorkle Avenue SE br& WV 25304< br> 304-356-< br> 304-926-（传真）< / p>< p>< a href = directions / Charleston.html>获取路线< / a>< / p> Teays Valley WVDRS< h5>< img src = offices / webmapDefault.png width = 200 height = 150 alt = NeedPictureOfOffice>< p> 115 Liberty Square< br>飓风，WV 25526< br> 304-760-（电话）< br> 304-759-（传真）< / p>< p>< a href = directions / TeaysValley.html>获取路线< / a> < / p>，
< h5> Spencer WVDRS< / h5>< img src = offices / Spencer.png width = 200 height = 150>< p> 321 Market Street< br> Spencer ，WV 25276 304-927-（电话）304-927-（传真）< / p>< p>< a href = directions / Spencer.html>获取路线< / a> < / p>中，
< H5>波因特普莱森WVDRS< / H5>< IMG SRC =办公室/ PointPleasant.png宽度= 200 HEIGHT = 150>< p为H. 209第五大街<峰; br>点宜人，WV 25550<峰; br> ; 304-675-（电话）< br> 304-675-（传真）< / p>< p>< a href = directions / PointPleasant.html>获取路线< / a>，
< h5> Ripley WVDRS< / h5>< hg>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 206 Stone Drive< br> Ripley，WV 25271< br> 304-373- （电话）< br> 304-373-（传真）< / p>< p>< a href = directions / Ripley.html>获取路线< / a>，
< h5> ; Clarksburg WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 107剑桥广场Bridgeport，WV 26330< br> 304-842-（电话）< （传真）< / p>< p>< a href = directions / Clarksburg.html>获取路线< / a>，
< h5> rmont WVDRS< / h5>< img src = offices / Fairmont.png width = 200 height = 150>< p>退伍军人广场320 Adams Street，Suite 106 Fairmont，WV 26554< br> 367-（电话）< br> 304-367-（传真）< / p>< p>< a href = directions / Fairmont.html>获取路线< / a>，
< ; H5> Morgantown WVDRS< / h5>< img src = offices / Morgantown.png width = 200 height = 150>< p> 1415 Earl Core Road Morgantown，WV 26505< br> 304-285- ）< br> 304-285-（传真）< / p>< p>< a href = directions / Morgantown.html>获取路线< / a>，
< h5> WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 306 Market Place Mall Weston，WV 26451< br> 304-269-0547（Phone） （传真）< / p>< p>< a href = directions / Weston.html>获取路线< / a>，
< h5> Elkins WVDRS< /H 5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 1025 North Randolph Avenue Elkins，WV 26241< br> 304-637-0205（电话）< br> 304 -637-0209（传真）< / p>< p>< a href = directions / Elkins.html>获取路线< / a>，
< h5> Wheeling WVDRS< / h5> < p>< p> Central Union Building< 40> 14th Street，Suite 103> Wheeling，WV 26003< br> 304-238-1093 ）304-238-1096（传真）< / p>< p>< a href = directions / Wheeling.html>获取路线< / a>，
< h5> Parkersburg WVDRS< / h5>< img src = offices / Parkersburg.png width = 200 height = 150>< p> State Office Building< br> 400 5th Street Parkersburg，WV 26101< br> 304-420- 4580（电话）< br> 304-420-4583（传真）< / p>< p>< a href =路线/ Parkersburg.html>获取路线< / a>，
< h5> Weirton WVDRS< / h5>< img src = offices / Weirton.png width = 200 height = 150>< p> 100 Municipal Plaza，Suite 200 Weirton，WV 26062< br> 723-5311（电话）< br> 304-723-5318（传真）< / p>< p>< a href = directions / Weirton.html>获取路线< / a>，
< h5> Sistersville WVDRS< / h5>< h5>< h5>< p> 714 Wells Street& Sistersville，WV 26175< br> 304-652-2354 （Phone）< br> 304-652-2359（传真）< / p>< p>< a href = directions / Sistersville.html>获取路线< / a>，
< h5> Beckley WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 800 New River Town Center Beckley，WV 25801< br> 304-256-6900电话）< br> 304-256-6903（传真）< / p>< p>< a href = directions / Beckley.html>获取路线< / a>，
&l t; h5> Princeton WVDRS< / h5>< p> 195 Davis Street Princeton，WV 24739< br> 304-425-1256（电话）< br> 304-487-2631（传真）< / p>< p>< a href = directions / Princeton.html>获取路线< / a>，
< h5> ;刘易斯堡WVDRS< / H5>< IMG SRC =办公室/ Lewisburg.png宽度= 200 HEIGHT = 150>< p为H. 777北杰弗逊街，套件105℃峰; br>刘易斯堡，WV 24901<峰; br> 304-647-7515 （电话）< br> 304-647-7518（传真）< / p>< p>< a href = directions / Lewisburg.html>获取路线< / a>，
< h5> Summersville WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 830 Northside Drive，Suite 113 Summersville，WV 26651< br> 304-872-0813 （Phone）< br> 304-872-0518（传真）< / p>< p>< a href = directions / Summersville.html>获取路线< / a>，
< h5> Huntington WVDRS< / h5> < h5> Logan WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 216 Dingess Street Logan，WV 25601< br> 304-792-7060 （Phone）< br> 304-792-7062（传真）< / p>< p>< a href = directions / Logan.html>获取路线< / a>，
< h5> Mullens WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 316 Howard Avenue Mullens，WV 25882< br> 304-294-5653 < br />>< p>< a href = directions / Mullens.html>获取路线< / a>，
< h5>马丁斯堡w ^ VDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 489 Mid Atlantic Parkway，Suite 2 Martinsburg，WV 25404 304-267-0005 ）304-267-0007（传真）< / p>< p>< a href = directions / Martinsburg.html>获取路线< / a>，
< h5> Keyser WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150>< p> 67 North Tornado Way Keyser，WV 26726< br> 304-788-2313（Phone）< （传真）< / p>< p>< a href = directions / Keyser.html>获取路线< / a>，
< h5> Romney WVDRS< ; / H5>< IMG SRC =办公室/ Romney.png宽度= 200 HEIGHT = 150>< p为H. 24948西北派克<峰; br>罗姆尼，WV 26757<峰; br> 304-822-3957<峰; br> 304-822- 7417< / p>< p>< a href = directions / Romney.html>获取路线< / a>，
< h5>< img src =我们Parkway Welch，WV 24801 304-436-3175（电话）304-436-3176（传真）< / bmapDefault.png width = 200 height = 150>< p> 110 Park Avenue Welch，WV 24801 br- p>< p>< a href = directions / Welch.html>获取路线< / a>，
< h5> Oak Hill WVDRS< / h5>< img src = offices / webmapDefault。 pg width = 200 height = 150>< p> 549 Mall Road< Oak> 25501> 304-465-3025（Phone）< br> ;< p>< a href = directions / OakHill.html>获取路线< / a>，
< h5> Moorefield WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150 alt = NeedPictureOfOffice>< p> 151 Robert C. Byrd工业园路3号套房Moorefield，WV 26836 304-538-2701（电话）< br> 304 -538-2718（传真）< / p>< p>< a href = directions / Moorefield.html>获取路线< / 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>
解决方案
- 想要为FusionTablesLayer创建一个新地图，并将其添加到现有地图中。
- 不能有多余的空白区域（表格ID末尾的额外空间）。
在初始化函数内部（至少在创建map之后，添加（显示仅在西弗吉尼亚州中，FusionTables UI中的样式）：
var layer = new google.maps.FusionTablesLayer（{
查询：{
select：'geometry'，
from：'18_J2uuiZRLon48Lc6bclZ0ckHanbKZB9qg319KV3'，
其中：STATE_NAME包含IGNORING CASE'West Virginia'
}，
选项：{
styleId：2，
templateId：2
}
}）;
layer.setMap（map）;
工作片段：
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）;拉特=新阵列（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 =新阵列（ 查尔斯顿WVDRS， Teays谷WVDRS， 斯宾塞WVDRS， 点宜人WVDRS， 里普利WVDRS， 克拉克WVDRS， 费尔蒙特WVDRS， 摩根敦WVDRS，韦斯顿WVDRS ，Elkins WVDRS，Wheeling WVDRS，Parkersburg WVDRS，Weirton WVDRS，Sistersville WVDRS，Beckley WVDRS，Princeton WVDRS，Lewisburg WVDRS，Summersville 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>< hg>< hg>< h>< h5>< h5>< h>> 4701 MacCorkle Avenue SE< br> Charleston，WV 25304< br> ; 304-356-< br> 304-926-（传真）< / p>< p>< a href = directions / Charleston.html>获取路线< / 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> 760-（电话）< br> 304-759-（传真）< / p>< p>< a href = directions / TeaysValley.html>获取路线< / a>< / p> Spencer WVDRS< / h5> > 304-487-2631（传真）< / p>< p>< a href = directions / Princeton.html> Get Directions< / a>，< h5> Lewisburg WVDRS< H5><我775 North Jefferson Street，Suite 105，Lewisburg，WV 24901，br> 304-647-7515（电话）304-647-7515（电话）304-647-7515（电话） 647-7518（传真）< / h>< p>< a href = directions / Lewisburg.html>获取路线< / a>">< h5>< img src = 830 Northside Drive，Suite 113 Summersville，WV 26651 304-872-0813（Phone）304-872-0518（电话）传真）< a href = directions / Summersville.html>获取路线< / a>，< h5> Huntington WVDRS< / h5>< img src = offices / Huntington。 （电话）304-528-5591（传真）< p> 2699 Park Avenue，Suite 200> / p>< p>< a href = directions / Huntington.html>获取路线< / a>，< h5> Logan WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 HEIG ht = 150>< p> 216 Dingess Street Logan，WV 25601 304-792-7060（Phone）304-792-7062（Fax）< / p>< p> < A HREF =方向/ Logan.html>获取路线< / A> 中， < H5>穆伦斯WVDRS< / H5>< IMG SRC =办公室/ webmapDefault.png宽度= 200 HEIGHT = 150>< p为H. ; 316 Howard Avenue Mullens，WV 25882 304-294-5653（Phone）304-294-5655（Fax）< / p>< p>< a href = directions / Mullens.html>获取路线< / A> 中， < H5>马丁斯堡WVDRS< / H5>< IMG SRC =办公室/ webmapDefault.png宽度= 200 HEIGHT = 150>< p为H. 489中大西洋大道，套房2 Martinsburg，WV 25404 304-267-0005（Phone）304-267-0007（Fax）< / p>< p>< a href = directions / Martinsburg.html> ;获取路线< / a>，< h5> Keyser WVDRS< / h5>< p> 67 North Tornado Way< br> Keyser， WV 26726< br> 304-788-231 3（Phone）< br> 304-788-6389（传真）< / p>< p>< a href = directions / Keyser.html>获取路线< / a>，< h5> Romney WVDRS< / h5>< img src = offices / Romney.png width = 200 height = 150>< p> 24948 Northwestern Pike Romney，WV 26757< br> 304-822-3957< br> 304-822 -7417< / p>< p>< a href = directions / Romney.html>获取路线< / a>，< h5> Welch WVDRS< / h5>< img src = offices / webmapDefault.png Parkway Welch，WV 24801< br> 304-436-3175（Phone）< br> 304-436-3176（Fax）< / p>< p>< p>< ; p>< a href = directions / Welch.html>获取路线< / a>，< h5> Oak Hill WVDRS< / h5>< hg> ;< p> 549 Mall Road< Oak Hill，WV 25901< br> 304-465-3025（Phone）< br> 304-465-3069（Fax）< / p>< p>< a href = directions / OakHill.html>获取路线< / a>，< h5> ; Moorefield WVDRS< / h5>< img src = offices / webmapDefault.png width = 200 height = 150 alt = NeedPictureOfOffice>< p> 151 Robert C. Byrd工业园路3号套房Moorefield， WV 26836< br> 304-538-2701（电话）< br> 304-538-2718（传真）< / p>< p>< a href = directions / Moorefield.html>获取路线< / 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'，其中：STATE_NAME包含IGNORING CASE'West Virginia'}，options：{styleId：2，templateId： 2}}）; layer.setMap（map）;} google.maps.event.addDomListener（window，'load'，initialize）;
html {height：100％} body {height：100％; margin：0px;
< script src =https://maps.googleapis.com/maps/api/js?sensor=false&ext=.js>< / script>< div id =map_canvas>< / div>
I am trying to show markers that fall within a state boundary. I am working with the code provided below (which is working great for the markers) but am having trouble getting it to work when I add to it an array of polygon coordinates for the state boundary polygon. Any help on how to add an array of coordinates for a single polygon would be greatly appreciated. Thank You.
<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>
解决方案
- you don't want to create a new map for the FusionTablesLayer, you want to add it to your existing map.
- you can't have extraneous white space (the extra space at the end of the table id).
Inside your initialize function (at the end, or at least after you have created the "map", add (to display "West Virginia" only, with the styling in the 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);
Working snippet:
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);
html {
height: 100%
}
body {
height: 100%;
margin: 0px;
padding: 0px
}
#map_canvas {
height: 100%
}
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&ext=.js"></script>
<div id="map_canvas"></div>
这篇关于同时显示标记和多边形（javascript api v3）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
