0

У меня есть следующий код. На карте не отображаются маркеры, но если я нажму на click for kebab 1, на карте откроется правильное информационное окно. Многомерный массив необходим, потому что у меня есть все данные в базе данных.У меня есть дополнительные окна, но карты не отображаются маркер

Соответствующий код:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<title>KEBAB TORINO</title> 

<script type='text/javascript' ></script> 
    <script type='text/javascript' src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true"></script> 


<style type='text/css'> 
#map_canvas{ 
width: 400px; 
height: 400px; 
} 
</style> 

</head> 

<body> 

<div id='map_canvas'></div> 
<a href='#' onClick="gotoPoint(1);">Click for kebab 1</a><br/> 
<a href='#' onClick="gotoPoint(2);">Click for kebab 2</a> 



<script type='text/javascript'> 

var long = new Array(); 

var long= ["7.681824","7.695342"]; 

var lati = new Array(); 

var lati= ["45.074284","45.069611"]; 

var idkebab = new Array(); 

var idkebab= ["1","2"]; 

var tel = new Array(); 

var tel= ["011 436 1009","011 037 4048"]; 

var nome = new Array(); 

var nome= ["Simbad Kebab","Kebab delle Universita"]; 

var indirizzo = new Array(); 

var indirizzo= ["Via San Domenico, 1","Via Sant'Ottavio, 31"]; 
var image = 'kebab.png'; 
var kebab = new Array(); 
var i=0; 
for (k=0; k<2; k++) 
{ 
kebab[k] = new Array(6); 
kebab[k][0] = lati[i]; 
kebab[k][1] =long[i]; 
kebab[k][2] =nome[i]; 
kebab[k][3] =indirizzo[i]; 
kebab[k][4] =tel[i]; 
kebab[k][5] =idkebab[i]; 
i=i+1; 

}; 
var map; 

var infowindow = []; 
var marker = []; 

function get_position(position) { 
var punto = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
var myOptions = { 
    zoom: 13, 
    center: punto, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
} 
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 



} 

function createMarker(lat, lon, html) { 
var image = 'kebab.png'; 

var newmarker = new google.maps.Marker({ 
    position: new google.maps.LatLng(lat, lon), 
    map: map, 
icon: image, 
    title: html 
}); 

newmarker['infowindow'] = new google.maps.InfoWindow({ 
     content: html 
    }); 

google.maps.event.addListener(newmarker, 'click', function() { 
    this['infowindow'].open(map, this); 
}); 

marker.push(newmarker); 
} 

function processShips(kebab) { 
for (var j = 0; j <2; j++) { 
    createMarker(kebab[j][0], kebab[j][1], kebab[j][2]); 
} 
} 

function load(kebab) { 

navigator.geolocation.getCurrentPosition(get_position); 
processShips(kebab); 


} 

function gotoPoint(myPoint){ 
map.setCenter(new google.maps.LatLng(marker[myPoint-1].position.lat(), marker[myPoint- 1].position.lng())); 
marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]); 
} 

window.onload = load(kebab); 


</script> 

</body> 

</html> 

ответ

0

карта-свойство еще не определена при создании маркеров.

  • выпуск № 1:

    window.onload = load(kebab);

    .... это будет называться сразу, а не OnLoad, он должен быть:

    window.onload = function(){load(kebab);}

  • вопрос # 2:

    geolocating является асинхронный процесс, processShips (что вызывает создание маркеров) будет выполнен доget_position (что инициализирует карту).
    Переместить вызов processShips(kebab) от load() до конца get_position()

+0

большое спасибо. Я исправляю эту ошибку. Теперь у меня другая проблема: / – user2564652

Смежные вопросы