Я пытаюсь создать карту с несколькими маркерами. У каждого маркера будет его инфо-окно. Я следил за всеми данными GoogleMaps, а информация по-прежнему не отображается.Множественные маркеры с инфо-окном не отображаются в GoogleMaps
В этом коде, который я вам дам, я создаю только 3 маркера с собственной функцией «PintaMarker». Эта функция создает маркер и добавляет его слушателя с информацией о infowindow и помещает маркер в мой «маркерный массив», называемый маркерами.
Когда я заканчиваю создание маркеров, я создаю MarkerClusterer для использования и просмотра всех создаваемых вами маркеров.
Может ли кто-нибудь взглянуть на мой код и дать мне руку?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ca" lang="ca">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Markers Map</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--script src="js/bootstrap.js"></script-->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer_compiled.js"></script>
</head>
<body>
<div id="map1" style="width:100%; height: 913px"></div>
</body>
<script>
var markers = [];
var map1=null;
var geocoder;
var infowindow = new google.maps.InfoWindow();
function pintaMarker(lat,lng,html){
var myLatLng = new google.maps.LatLng(lat, lng);
var marker = new google.maps.Marker({
position: myLatLng,
map: map1,
});
google.maps.event.addListener(marker, 'click', function(){
infowindow.setOptions({
content: html
});
infowindow.open(map1,marker);
console.log(infowindow);
});
markers.push(marker);
}
$(document).ready(function() {
//var center = new google.maps.LatLng(41.644183,1.620483);
geocoder = new google.maps.Geocoder();
var center = new google.maps.LatLng(41.38257066,2.15659028);
var options = {
zoom: 16,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map1 = new google.maps.Map(document.getElementById("map1"), options);
pintaMarker(41.385, 2.154, 'hola');
pintaMarker(41.387, 2.1529, 'hola2');
pintaMarker(41.38254, 2.1562, 'hola3');
var markerCluster = new MarkerClusterer(map1, markers);
});
</script>
</html>
Спасибо!
спасибо! Я также нашел другое исправление. Я объявляю var map1 дважды! один как глобальная переменная, а другой объявлен внутри функции $ (document) .ready. Я думаю, именно поэтому объект был нулевым. – Ricardmc
Добро пожаловать! –