使用PHP和Javascript的组合,我需要在Google地图上显示多个标记(至少50个)。
我浏览了链接:https://developers.google.com/maps/documentation/javascript/examples/map-latlng-literal在第15行,它说:
var marker = new google.maps.Marker({
// The below line is equivalent to writing:
// position: new google.maps.LatLng(-34.397, 150.644)
position: {lat: -34.397, lng: 150.644},
map: map
});
我打算做以下事情:
var markers = [<?php echo $locations ?>];
如果我这样做是错的吗?
var markers = [{
position: {lat: 19.10427, lng: 72.92764},
map: map
},
{
position: {lat: 19.10432, lng: 72.92751},
map: map
}
];
我的意图是在init函数
中调用showMarkers()我的js代码是:
src="https://maps.googleapis.com/maps/api/js?v=3.exp"
var map;
var markers = [{
position: {lat: 19.10427, lng: 72.92764},
map: map
},
{
position: {lat: 19.10432, lng: 72.92751},
map: map
}
];
function initialize() {
var haightAshbury = new google.maps.LatLng(19.10427,72.92764);
var mapOptions = {
zoom: 12,
center: haightAshbury,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
showMarkers();
}
// Add a marker to the map and push to the array.
function addMarker(location) {
var marker = new google.maps.Marker({
position: location,
map: map
});
markers.push(marker);
}
// Sets the map on all markers in the array.
function setAllMap(map) {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(map);
}
}
// Removes the markers from the map, but keeps them in the array.
function clearMarkers() {
setAllMap(null);
}
// Shows any markers currently in the array.
function showMarkers() {
setAllMap(map);
}
// Deletes all markers in the array by removing references to them.
function deleteMarkers() {
clearMarkers();
markers = [];
}
google.maps.event.addDomListener(window, 'load', initialize);
这不起作用。在我的Firefox控制台中,我可以看到:"TypeError:标记[我]。setMap不是函数
这是jsFiddle的链接:http://jsfiddle.net/P5tXh/4/
我做错了什么?
- 创建一个数组来保存与标记数组等效的google.maps.Marker对象
- 为标记数组 中的每个条目创建一个google.maps.Marker
- 使用google.maps.Markers数组来显示/隐藏标记
// array of google.maps.Marker objects
var gmarkers = [];
function showMarkers() {
for (var i = 0; i < markers.length; i++) {
gmarkers.push(new google.maps.Marker(markers[i]));
}
setAllMap(map);
}
然后将现有的引用"markers"更改为"gmarkers"
更新小提琴
var map;
var markers = [{
position: {
lat: 19.10427,
lng: 72.92764
},
map: map
}, {
position: {
lat: 19.10432,
lng: 72.92751
},
map: map
}];
var gmarkers = [];
function initialize() {
var haightAshbury = new google.maps.LatLng(19.10427, 72.92764);
var mapOptions = {
zoom: 12,
center: haightAshbury,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
showMarkers();
}
// Add a marker to the map and push to the array.
function addMarker(location) {
var marker = new google.maps.Marker({
position: location,
map: map
});
gmarkers.push(marker);
}
// Sets the map on all markers in the array.
function setAllMap(map) {
for (var i = 0; i < gmarkers.length; i++) {
gmarkers[i].setMap(map);
}
}
// Removes the markers from the map, but keeps them in the array.
function clearMarkers() {
setAllMap(null);
}
// Shows any markers currently in the array.
function showMarkers() {
for (var i = 0; i < markers.length; i++) {
gmarkers.push(new google.maps.Marker(markers[i]));
}
setAllMap(map);
}
// Deletes all markers in the array by removing references to them.
function deleteMarkers() {
clearMarkers();
markers = [];
}
google.maps.event.addDomListener(window, 'load', initialize);