在 google 地图上的不同位置添加不同的标记图标
Add different marker icons to different locations on google maps
如何向 google 地图上的每个不同位置添加不同的图标?我可以为所有地方添加一个图标。但是我需要他们根据位置更改图标。
这是我的代码:
<script type="text/javascript">
var locations = [
['Doune Castle', 56.185096, -4.050264, 1],
['Holyrood Palace', 55.952715, -3.172270, 2],
['Royal Mile', 55.950336, -3.186347, 3],
['Blackness Castle', 56.005865, -3.516252, 4],
['Urquhart Castle', 57.324140, -4.442001, 5],
['Loch Ness', 57.322857, -4.424382, 6],
['Culloden Battlefield', 57.477790, -4.095711, 7],
['Clava Cairns, Inverness', 57.473366, -4.071808, 8]
];
var image = '<?php bloginfo('template_url'); ?>/images/kilt-pin.png';
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: new google.maps.LatLng(56.490671, -4.202646),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map,
icon: image
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
</script>
有什么想法吗?
您可以在以下位置查看我所做的工作:
http://temp62.clrs-hosting.co.uk/outlander-tours/
死了!
将一些图像位置 URL 放入相应位置的位置数组中。然后使用相同的索引在循环内访问它们。
如何向 google 地图上的每个不同位置添加不同的图标?我可以为所有地方添加一个图标。但是我需要他们根据位置更改图标。
这是我的代码:
<script type="text/javascript">
var locations = [
['Doune Castle', 56.185096, -4.050264, 1],
['Holyrood Palace', 55.952715, -3.172270, 2],
['Royal Mile', 55.950336, -3.186347, 3],
['Blackness Castle', 56.005865, -3.516252, 4],
['Urquhart Castle', 57.324140, -4.442001, 5],
['Loch Ness', 57.322857, -4.424382, 6],
['Culloden Battlefield', 57.477790, -4.095711, 7],
['Clava Cairns, Inverness', 57.473366, -4.071808, 8]
];
var image = '<?php bloginfo('template_url'); ?>/images/kilt-pin.png';
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: new google.maps.LatLng(56.490671, -4.202646),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map,
icon: image
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
</script>
有什么想法吗?
您可以在以下位置查看我所做的工作:
http://temp62.clrs-hosting.co.uk/outlander-tours/
死了!
将一些图像位置 URL 放入相应位置的位置数组中。然后使用相同的索引在循环内访问它们。