Question

我想在地图上绘制几个标记。在互联网上找到了一些代码，对于那个用户来说。该数组由PHP生成，例如：var ships = [['61'，'10.2'] ['60.5'，'10.1']];

我的Javascript：

var map;
function load(ships) {
    initialize();
    createShips(ships);
}

function initialize() {

    //build the map
    var myLatlng = new google.maps.LatLng(63.65,10.65);
    var myOptions = {
        zoom: 9,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

function createShips(ships){
    for (var i = 0; i < ships.length; i++) {
        new google.maps.Marker({
          position: new google.maps.LatLng(ships[i][0], ships[i][1]),
          map: map,
          title: ships[i][0]
        });
    }
}

我启动地图的html功能是：

body onload="load()"

地图似乎出现了，但没有标记。

Answer 1

以下是jsfiddle

几个问题：

您的阵列格式不正确。应该在元素之间使用逗号。
您在函数initialize中本地声明了您的地图，因此，在createShips map: map内基本上指向未定义。所以我在功能之外宣布了地图，这样你就可以在creaeteShips

JavaScript的：

    var ships = [['61', '10.2'],['60.5', '10.1']];  //formatted array correctly
    var map; //declared outside functions so createShips can access

    function load(ships) {
        initialize();
        createShips(ships);
    }

    function initialize() {
        var myLatlng = new google.maps.LatLng(63.65, 10.65);
        var myOptions = {
            zoom: 9,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.TERRAIN
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    }

    function createShips(ships) {
        for (var i = 0; i < ships.length; i++) {
            new google.maps.Marker({
                position: new google.maps.LatLng(ships[i][0], ships[i][1]),
                map: map,
                title: ships[i][0]
            });
        }
    }

load(ships);

google.map.LatLng需要数字而不是字符串。所以，你应该将字符串更改为数字。

google.map.LatLng(lat:number, lng:number, noWrap?:boolean);

注意纬度和经度的排序。如果noWrap标志为真，则数字将被用作传递，否则纬度将被夹在-90度和+90度之间，经度将被包裹在-180度和+180度之间。

<强>更新

好的，将字符串Lat和Lng转换为数字后，这是另一个问题。创建标记时，将标题指定为ships [i] [0]。标题是期望一个字符串，因此当它得到一个数字时'错误'。我做的是通过将标记推入名为var myMarkers的数组并将标题设置为字符串来开始跟踪标记。请看一下更新的jsfiddle：

    var myMarkers = []; //created outside of all function to make it global

    myMarkers.push(new google.maps.Marker({
        position: new google.maps.LatLng(ships[i][0], ships[i][1]),
        map: map,
        title: 'ship #' + i //i change the title from a number into string
    }));

谷歌地图：多标记

1 个答案: