Question

我正在检查谷歌地图api以整合到我的网站。这个页面是我迄今为止所能理解的。

一切正常，但只有一件事，我想在同一张地图上有三个标记。当我添加多个标记时，地图就会停止工作。

如果你看到我的链接，你将会有更好的理解。这是我从谷歌地图API获得的代码。然后我编辑它以获得带有我想要的标记框的灰度图。我只想再添两个......

请帮忙。

   <script>
function initialize() {
  var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
  var mapOptions = {
    zoom: 4,
    center: myLatlng
  }
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: 'Hello World!'
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>

Answer 1

您应该放置＆＃34;新标记＆＃34;将代码编写到自己的函数中，如下所示：

function LoadMarkers(name, lat, lng) {
            var MarkerLatLng = new google.maps.LatLng(lat, lng);
            var MarkerOption = { map: map, position: MarkerLatLng, title: name};
            var Marker = new google.maps.Marker(MarkerOption);
}

将它放入自己的功能可以让你刷新＆＃34;通过简单地使用计时器或其他事件调用函数，可以轻松完成标记。我正在处理的程序每隔几秒刷新一次地图，因为我的数据源会随着新的/删除/更新的记录不断变化，这些记录应立即反映在地图上。我认为这是一个很好的方法。

然后，在您的程序中，您可以创建一个循环，通过调用LoadMarkers函数来为每个标记发送信息。我最近爱上了SqlDataReader。

你的循环将遍历一个SqlDataReader并且每个读取的记录将调用脚本，如下所示：

InvokeScript("LoadMarkers", New Object() {name, lat, lng})

这也是为每个标记添加InfoWindow的好时机。

var infowindow = new google.maps.InfoWindow(
{
content: "Content here"
});

以及InfoWindows的点击监听器。 ;）

google.maps.event.addListener(Marker, 'click', function () {
                typeof infoWindowsOpenCurrently !== 'undefined' && infoWindowsOpenCurrently.close(); //If there is an InfoWindow currently open, close it
                infowindow.open(map, Marker); //Open a new one for the selected marker
                infoWindowsOpenCurrently = infowindow; //Set the new info window to the temporary variable
            });

有些人可能不喜欢这种使用循环的方法。我喜欢它，因为我可以＆＃34;个性化＆＃34;每个记录的每个标记，同时也个性化每个InfoWindows。在我上面的代码中，假设＆＃34; name＆＃34;是一个唯一的ID，可让您指定特定的标记供以后使用，例如识别单击的标记以及当前打开的InfoWindow。

需要使用自定义谷歌地图API添加多个标记

1 个答案: