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>
4

1 回答 1

0

创建标记时尚未定义地图属性。

  • 问题#1：

    window.onload = load(kebab);

    ....这将立即被调用，而不是 onload，它必须是：

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

  • 问题2：

    地理定位是一个异步过程，processShips（调用标记的创建）将在之前 get_position执行（初始化地图）。
    将processShips(kebab)from的调用load()移到get_position()

于 2013-07-09T14:24:19.873 回答