谷歌地图默认数组的标记

Google Map Default Array of Markers

本文关键字：数组 默认 谷歌地图      更新时间：2023-09-26

使用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/

我做错了什么?

  1. 创建一个数组来保存与标记数组等效的google.maps.Marker对象
  2. 为标记数组
    3. 中的每个条目创建一个google.maps.Marker
  3. 使用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);

相关文章：