javascript Google Maps - 将 InfoWindows 附加到数组中的多边形
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7111046/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google Maps - Attaching InfoWindows to polygons in array
提问by Cris McCarthy
I've been banging my head against the wall all morning with this one. I an creating an array of polygons, and want to associate some data in each one that will show in an infoWindow. I can see all the polygons on the map. I add the listener, and it fires (the color change happens), but I don't get the infoWindow. Any help would be greatly appreaciated!
我整个早上都在用这个头撞墙。我创建了一个多边形数组，并希望在每个将显示在 infoWindow 中的数据中关联一些数据。我可以看到地图上的所有多边形。我添加了监听器，它会触发（颜色发生变化），但我没有得到 infoWindow。任何帮助将不胜感激！
Cheers!
干杯!
C...
C...
tmppoly = new google.maps.Polygon({
map: map,
paths: polypath,
strokeColor: scolor,
strokeOpacity: 0.5,
strokeWeight: 2,
fillColor: fcolor,
fillOpacity: 0.5
});
addPolygonClick(tmppoly,mdata);
plot_polygons.push(tmppoly);
...
function addPolygonClick(poly,html) {
infowindow = new google.maps.InfoWindow(
{
content: html
});
google.maps.event.addListener(poly,'click', function(event) {
this.setOptions({fillColor: "#000000"});
infowindow.open(map);
});
}
回答by Gallery
I can provide some useful suggestions about your question.
我可以就你的问题提供一些有用的建议。
Firstly, you should know the expression about the method 'infowindow.open(map, anchor?:MVCObject)'. As the google api v3 says: In the core API, the only anchor is the Marker class. Polygon class does not match the condition, however, we can achieve in another way.
首先，你应该知道方法'infowindow.open(map,anchor?:MVCObject)'的表达式。正如 google api v3 所说：在核心 API 中，唯一的锚点是 Marker 类。Polygon 类不匹配条件，但是，我们可以通过另一种方式实现。
var polygon = new google.maps.Polygon({
paths: PGpoints, //The PGpoints is the collection of points around this polygon.
map: map,
strokeColor: colory,
strokeOpacity: 0.6,
strokeWeight: 1,
fillColor: colory,
fillOpacity: 0.35
});
polygon.set("Info", idy); // Set some attributes for adding extra information into this polygon.
google.maps.event.addListener(polygon, 'click', function() {
var infoWindow = new google.maps.InfoWindow();
infoWindow.setContent("Information : " + polygon.get("Info"));
// 'laty,lngy' is the location of one point in PGpoints, which can be chosen as you wish
infoWindow.setPosition(new google.maps.LatLng(laty,lngy));
infoWindow.open(map);
});
The code above has passed test, you can use it directly. Then, if you click one polygon, infoWindow would appear above the map.
上面的代码已经通过测试，可以直接使用。然后，如果您单击一个多边形，信息窗口将出现在地图上方。
回答by plexer
There are a few problems that might be preventing this from working:
有一些问题可能会阻止它工作：
1:You need a var in front of infowindow, to make it a local variable:
1：您需要在 infowindow 前面添加一个 var，以使其成为局部变量：
var infowindow = new google.maps.InfoWindow(...
As it is, you are replacing the infowindow variable every time you add a new click listener.
实际上，每次添加新的点击侦听器时，都会替换 infowindow 变量。
2:You need to specify a position or anchor for the infowindow (see: http://code.google.com/apis/maps/documentation/javascript/reference.html#InfoWindowOptions).
2：您需要为信息窗口指定位置或锚点（请参阅：http: //code.google.com/apis/maps/documentation/javascript/reference.html#InfoWindowOptions）。
The only valid anchor is a Marker, so you will probably want to specify the 'position' property. 'position' must be a valid google.maps.LatLng object. I suspect you will want to compute the center of your polygon to use as the position.
唯一有效的锚点是 Marker，因此您可能需要指定 'position' 属性。“位置”必须是有效的 google.maps.LatLng 对象。我怀疑您会想要计算多边形的中心以用作位置。
You also need to make sure map is a global variable, although it likely is looking at the rest of your code.
您还需要确保 map 是一个全局变量，尽管它可能正在查看您的其余代码。
回答by Gowri Abhaya
Please take a look at this https://developers.google.com/maps/documentation/javascript/examples/event-closureand combine it with the response above to assign a unique message for each polygon in your array of polygons.
请查看此https://developers.google.com/maps/documentation/javascript/examples/event-closure并将其与上面的响应结合起来，为多边形数组中的每个多边形分配一个唯一的消息。
I am also working in having multiple polygons in one layer with unique message for each polygon. I have not succeeded yet. With the response above, I got info window to show up, but I get the same message for all the polygons. Once I solve my problem, I will post the solution.
我还致力于在一个图层中有多个多边形，每个多边形都有唯一的消息。我还没有成功。通过上面的响应，我显示了信息窗口，但我收到了所有多边形的相同消息。一旦我解决了我的问题，我会发布解决方案。
