Ошибка выполнения кластера googlemaps Node.js

Question

Теперь я использую платформу node.js. И я хочу использовать библиотеку кластера googlemap. Однако я не могу выполнить исходный код.

GoogleMaps кластер апи URL: индекс https://github.com/googlemaps/js-marker-clusterer

Эта библиотека находится ниже.

• DOSC
• примеры
• изображения
• ГКЗ
• и т.д ..

В каталоге примеров, я хочу, чтобы проверить "simple_example.html".

Ниже приведен исходный код узла node.js.

[app.js]

var express = require("express"); 
var app = express(); 
app.set('view engine','ejs'); 
var path = require("path"); 
app.set("public", path.join(__dirname, "public")); 

app.get('/', function(req, res){ 
    res.render("simple_example", {}) 
}); 

app.listen(3000); 
console.log("Running at Port 3000"); 

[simple_example.ejs] (важная часть скрипта)

<script src="https://maps.googleapis.com/maps/api/js"></script> 
<script src="public/data.json"></script> 
<script type="text/javascript" src="public/src/markerclusterer.js"></script> 

<script> 
    function initialize() { 
    var center = new google.maps.LatLng(37.4419, -122.1419); 

    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 3, 
     center: center, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 

    var markers = []; 
    for (var i = 0; i < 100; i++) { 
     var dataPhoto = data.photos[i]; 
     var latLng = new google.maps.LatLng(dataPhoto.latitude, 
      dataPhoto.longitude); 
     var marker = new google.maps.Marker({ 
     position: latLng 
     }); 
     markers.push(marker); 
    } 
    var markerCluster = new MarkerClusterer(map, markers, {imagePath: 'public/images/m'}); 
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 

Эта картина является результатом выполнения моего исходного кода. но изображение не имеет маркеров на карте. Я ожидал, что картина ниже.

Я попытался изменения пути ЦСИ, изменение веб-платформы (как Python), но я не могу решить эту проблему. Кто знает решение?

Answer 1

Как только вы создадите кластер маркеров, поддерживайте его с помощью метода addMarker() или предоставив массив маркеров конструктору.

Когда они говорят, добавить маркер в конструктор, предоставляя множество маркеров, это похоже на это сделать:

var markers = []; //create a global array where you store your markers 
for (var i = 0; i < 100; i++) { 
var latLng = new google.maps.LatLng(data.photos[i].latitude, 
data.photos[i].longitude); 
var marker = new google.maps.Marker({'position': latLng}); 
markers.push(marker); //push individual marker onto global array 
} 
var markerCluster = new MarkerClusterer(map, markers); //create clusterer and push the global array of markers into it. 

Чтобы добавить его с помощью addMarker() вы в принципе добавить его в кластер, как следующее:

var markerCluster //cluster object created on global scope 

//do your marker creation and add it like this: 
markerCluster.addMarker(newMarker, true); //if specify true it'll redraw the map 

Вот ссылка на markerCluster: https://googlemaps.github.io/js-marker-clusterer/docs/examples.html

Кроме того, здесь демо-приложение, как использовать markercluster: https://github.com/googlemaps/js-marker-clusterer