我想用标签实现多个标记(记录在这里:http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.0.1/docs/examples.html ) 而且我在编写代码时遇到了一些问题。
例如,对于 2 个标记,您必须使用以下代码:
var latlng1 = new google.maps.LatLng(49, -123);
var latlng2 = new google.maps.LatLng(48, -123);
var marker1 = new MarkerWithLabel({
position: latlng1,
draggable: true,
map: map,
labelContent: "abcd",
labelAnchor: new google.maps.Point(22, 0),
labelClass: "labels",
labelStyle: {opacity: 0.75}
});
var marker2 = new MarkerWithLabel({
position: latlng2,
draggable: true,
map: map,
labelContent: "efgh",
labelAnchor: new google.maps.Point(22, 0),
labelClass: "labels",
labelStyle: {opacity: 0.75}
});
这没问题,但是 10 个标记呢?我希望能够做这样的事情:
var locations = [
new google.maps.LatLng(49, -123),
new google.maps.LatLng(48, -123),
];
var labels = [
"abcd",
"efgh",
];
问题是当我写一个“for”函数时,地图没有显示任何标记。
for ( var i = 0; i < locations.length; i++ )
{
var marker = new MarkerWithLabel({
position: locations[i],
draggable: true,
labelContent: labels[i],
labelAnchor: new google.maps.Point(22,0),
labelClass: "labels",
labelStyle: {opacity: 0.85}});
}
我不太擅长编程,所以,你能告诉我我做错了什么吗?
这之后,当然还有添加信息窗的问题,这个以后再说吧
谢谢你的时间。
在你的for循环中你忘了包括
map: map,
在“draggable:true”下面
这很重要的原因是你需要告诉 MarkerWithLabel 哪个地图也要添加标记。页面上可能有多个地图。
谢谢回复。 是的,我忘了在上面的线程中包含 map 参数——我在代码中有它。
问题实际上与将图标与标记相关联有关:
new google.maps.MarkerImage('http://google-maps-icons.googlecode.com/files/black01.png')
之后是 02、03 等。我没有相应地编写数组,因此代码实际上从未进入标记部分(没关系)。
for函数的内容是这样的:
var marker = new MarkerWithLabel({
position: locations[i],
draggable: true,
map: map,
icon: icons[i],
labelContent: labels[i],
labelAnchor: new google.maps.Point(22,0),
labelClass: "labels",
labelStyle: {opacity: 0.85}});
查看本文和参考网站了解更多详情:
<script type="text/javascript">
//Generate Markers Value Array
var markers = [
<asp:Repeater ID="rptMarkers" runat="server">
<ItemTemplate>
{
"title":'<%# Eval("Area") %>',
"lat": '<%# Eval("Latitute") %>',
"lng": '<%# Eval("Longitute") %>',
"description": '<%# Eval("Address") %>'
}
</ItemTemplate>
<SeparatorTemplate>
,
</SeparatorTemplate>
</asp:Repeater>
];
</script>
//
for (i = 1; i <= markers.length; i++) {
var data = markers[i-1]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var marker = new MarkerWithLabel({
position: myLatlng,
map: map,
title: data.title,
labelContent: i,
labelAnchor: new google.maps.Point(7, 30),
labelClass: "labels", // the CSS class for the label
labelInBackground: false
});
(function (marker, data) {
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent(data.description);
infoWindow.open(map, marker);
});
})(marker, data);
}
参考:
在循环之前,需要先将标记声明为数组。
var marker = new Array();
然后只在循环内将其分配为 MarkerwithLabel 类
for ( var i = 0; i < locations.length; i++ )
{
marker = new MarkerWithLabel({ pro})
}