-1
Я хочу отобразить карту с несколькими маркерами, и она должна отображать числа в маркере, а также информацию с информацией из массива.Google map с несколькими маркерами и цифрами и infowindow
Он показывает все маркеры, но с номером 5 во всех них, и он отображает «Пляж Марубра» в информационном окне на всех. Информационное окно само по себе работает, как и должно быть, то есть оно открывается на каждом маркере, как должно, но отображает неправильный текст! Я не уверен, что я делаю неправильно с прилавком !? Так как он отображает 5 во всех маркерах.
var geocoder;
var map;
function initializemulti() {
//this is the geolocationmarker-compiled.js file
(function() {var c=null,e;
function f(b,a,d){var i={clickable:!1,cursor:"pointer",draggable:!1,flat:!0,icon:new google.maps.MarkerImage("https://google-maps-utility-library-v3.googlecode.com/svn/trunk/GeolocationMarker/images/gpsloc.png",new google.maps.Size(15,15),new google.maps.Point(0,0),new google.maps.Point(7,7)),optimized:!1,position:new google.maps.LatLng(0,0),title:"Current location",zIndex:2};a&&(i=g(i,a));a={clickable:!1,radius:0,strokeColor:"1bb6ff",strokeOpacity:0.4,fillColor:"61a0bf",fillOpacity:0.4,strokeWeight:1,
zIndex:1};d&&(a=g(a,d));this.a=new google.maps.Marker(i);this.b=new google.maps.Circle(a);this.b.bindTo("center",this.a,"position");this.b.bindTo("map",this.a);b&&this.e(b)}e=f.prototype;e.c=c;e.a=c;e.b=c;e.g=function(){return this.c};e.h=function(){return this.c?this.a.getPosition():c};e.f=function(){return this.c?this.b.getBounds():c};e.i=function(){return this.c?this.b.getRadius():c};e.d=-1;
e.e=function(b){if(this.c=b){var a=this,b={enableHighAccuracy:!0,maximumAge:1E3};navigator.geolocation&&(this.d=navigator.geolocation.watchPosition(function(d){var b=new google.maps.LatLng(d.coords.latitude,d.coords.longitude);a.b.setRadius(d.coords.accuracy);if(!a.a.getMap()||!b.equals(a.a.getPosition()))a.a.setPosition(new google.maps.LatLng(d.coords.latitude,d.coords.longitude)),a.a.setPosition(b),a.a.getMap()||a.a.setMap(a.c),google.maps.event.trigger(a,"position_changed",new h(b,a.b.getBounds(),
d.coords.accuracy))},function(b){google.maps.event.trigger(a,"geolocation_error",b)},b))}else navigator.geolocation.clearWatch(this.d),this.d=-1,this.a.setMap(b)};e.k=function(b){this.a.setOptions(g({},b))};e.j=function(b){this.b.setOptions(g({},b))};function g(b,a){for(var d in a)j[d]||(b[d]=a[d]);return b}var j={map:!0,position:!0,radius:!0};function h(b,a,d){b&&(this.position=b);a&&(this.bounds=a);d&&(this.accuracy=d)}h.prototype.position=c;h.prototype.bounds=c;h.prototype.accuracy=c;f.prototype.getAccuracy=f.prototype.i;f.prototype.getBounds=f.prototype.f;f.prototype.getMap=f.prototype.g;f.prototype.getPosition=f.prototype.h;f.prototype.setCircleOptions=f.prototype.j;f.prototype.setMap=f.prototype.e;f.prototype.setMarkerOptions=f.prototype.k;window.GeolocationMarker=f;})()
//alert("init");
var locations = [
['Big Boys Grill & Bar', '<br />Kungsgatan 28, Varberg'],
['Black Pearl Varberg', '<br />Kungsgatan 13, Varberg'],
['Bruket', '<br />Birger Svenssons väg 16 E, Varberg'],
['Comwell Varbergs Kurort', '<br />Nils Kreugers väg 5, Varberg']
];
var mapen = new google.maps.Map(document.getElementById('map_canvasmulti'), {
zoom: 12,
center: new google.maps.LatLng(57.111488,12.246623),
//center: undefined,
disableDefaultUI: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var geocoder = new google.maps.Geocoder();
//for displaying the current users location
var GeoMarker = new GeolocationMarker();
GeoMarker.setCircleOptions({fillColor: '#808080'});
google.maps.event.addListenerOnce(GeoMarker, 'position_changed', function() {
// mapen.setCenter(this.getPosition());
// mapen.fitBounds(this.getBounds());
});
google.maps.event.addListener(GeoMarker, 'geolocation_error', function(e) {
alert('There was an error obtaining your position. Message: ' + e.message);
});
GeoMarker.setMap(mapen);
var marker,i;
var markers = [];
var marker, i;
for (i = 0; i < locations.length; i++) {
var p = locations[i];
geocoder.geocode({
'address': locations[i][1]
}, (function(i,p) {
return function(results, status) {
//alert(status);
if (status == google.maps.GeocoderStatus.OK) {
//alert(results[0].geometry.location);
mapen.setCenter(results[0].geometry.location);
marker = new google.maps.Marker({
position: results[0].geometry.location,
icon: 'https://chart.googleapis.com/chart?chst=d_map_pin_letter&chld=' + ([i+1]) + '|FF776B|000000',
map: mapen,
title: p[2]
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(p[0] + p[1]);
infowindow.open(mapen, this);
});
// google.maps.event.addListener(marker, 'mouseover', function() { infowindow.open(mapen, this);});
google.maps.event.addListener(marker, 'mouseout', function() {
infowindow.close();
});
} else {
alert("some problem in geocode" + status);
}
};
})(i,p));
}
}
Любой ввод действительно оценен, спасибо!
Хорошо, так это работает, за исключением того, что синие точки не отображаются? Круг вокруг местоположения пользователей, который я показываю, но не синюю точку?
Возможный дубликат [Google Maps JS API v3 - Простой Multiple Marker Пример] (/ вопросы/3059044/Google-карты-JS-апи-v3-простой множественным маркер-пример) – geocodezip
Нет, не дублируем! –
Это действительно дубликат, просто не точный дубликат. Концепция исправления одинаков, просто вы используете геокодер, чтобы получить позиции ваших маркеров, для чего требуется другое закрытие функции. – geocodezip