我真的是一个 JS 菜鸟 - 我以前从未真正使用过它，并且正在努力使用 google 提供的标记聚类器。我已经阅读了文档
这是代码
<script src="http://localhost/wheredidmytweetgo/js/markercluster.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(
document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.setCenter(
new GLatLng( 56.65622649350222, -19.86328125), 2);
var mc = new MarkerClusterer(map);
function createMarker(point, text, title) {
var marker =
new GMarker(point,{title:title});
GEvent.addListener(
marker, "click", function() {
marker.openInfoWindowHtml(text);
});
return marker;
}
<?php
foreach ($cluster_location as $location) {
?>
var marker = createMarker(
new GLatLng(<?php echo $location ?>),
'Marker text <?php echo $location ?>',
'Example Title text <?php echo $location ?>');
map.addMarker(marker);
<?php }
?>
}
}
集群位置只是纬度和经度的数组 - 当仅使用 add.overlay 时，我的代码工作正常，但是有太多的代码无法使 map 可读，因此需要集群。我确实加载了我已经包含的集群 JS。 我创建聚类器对象并按定义传入映射。
var markers = [];
//create array
我知道我可以创建一个 JS 数组并将其传递给
var mc = new MarkerClusterer(map, markers);
但我现在根本不具备创建数组的 JS 知识(我打算学习)，Google 文档建议您可以使用 addMarker 迭代并一次添加一个数组
嗨汤姆 - 感谢您提供的信息 - 我已尝试按照您的建议进行操作并提出了以下建议:
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://localhost/wheredidmytweetgo/js/markercluster.js">
</script>
<script type="text/javascript">
function initialize() {
var center = new google.maps.LatLng(37.4419, -122.1419);
var map = new google.maps.Map(document.getElementById('map'), {
'zoom': 13,
'center': center,
'mapTypeId': google.maps.MapTypeId.ROADMAP
});
var markers = [];
<?php foreach ($cluster_location as $location) { ?>{
var marker = new google.maps.Marker({'position': <?php echo $location;?>});
markers.push(marker);
}
<?
}
?>
var markerCluster = new MarkerClusterer(map, markers);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<h3>A simple example of MarkerClusterer (100 markers)</h3>
<p>
<a href="?compiled">Compiled</a> |
<a href="?">Standard</a> version of the script.
</p>
<div id="map-container"><div id="map"></div></div>
</body>
</html>
但我的 map 仍然加载为空。我现在使用的是最基本的谷歌提供的代码，只是加载我自己的标记。我知道我的标记定位应该没问题，因为当我去查看我的页面源代码时，我可以看到
{
var marker = new google.maps.Marker({'position': 40.0994425,-74.9325683});
markers.push(marker);
});
对于每个标记。任何更多帮助将不胜感激!
最佳答案
请查看 Google map 实用程序库页面 ( link ) 上的示例。
但基本上要将对象(标记)的实例添加到数组中，您必须首先定义数组，因此您需要在创建的循环上方执行 varmarkers = [];标记。然后，当您创建标记时，您必须通过调用数组的 push 方法将它们添加到标记数组中(如果您想了解的话，请前往 MDN 并阅读有关数组的内容!现在是从那里开始的好时机 - 那里还有一个关于 JS 的教程 ( link )。
因此，在定义了标记后，在 foreach 循环内部，只需将其添加到数组 markers.push(marker); 这将使标记可用于MarkerCluster 初始化。
从长远来看，当您更好地了解 javascript 时，您可能会希望将这部分替换为将数据作为 JSON 对象传递到 DOM，以便方法可以处理它，甚至更好 - 检索标记的数据使用ajax查询。但我想一步一步来:)
也许可以尝试 www.codecademy.com 上的有趣的交互式教程。 ？它们非常基本，但似乎这正是您所需要的
编辑:
var marker,
markers = [];
<?php foreach ($cluster_location as $location) { ?>
marker = new google.maps.Marker({'position': <?php echo $location;?>});
markers.push(marker);
<? } ?>
关于php - 使用谷歌地图 API - 标记集群，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9334629/