javascript for循環不起作用

Question

我有一些編碼經驗，但我是Javascript的新手。

我嘗試創建一個html文件，顯示谷歌地圖並在其上放置一些標記。

當我一次只做一個標記時，它工作正常，如下所示：

function initMap() {
    var map = ...;
    var icon = ...;

    var pt1 = {lat: ..., lng: ...};
    var marker1 = new google.maps.Marker({
        position: pt1,
        map: map,
        icon: icon,
        label: {..., text: '1'},
        title: 'Marker 1'
    });

    var pt2 = {lat: ..., lng: ...};
    var marker2 = new google.maps.Marker({
        position: pt2,
        map: map,
        icon: icon,
        label: {..., text: '2'},
        title: 'Marker 2'
    });

    var pt3 = {lat: ..., lng: ...};
    var marker3 = new google.maps.Marker({
        position: pt3,
        map: map,
        icon: icon,
        label: {..., text: '3'},
        title: 'Marker 3'
    });
}

現在我嘗試將標記的定義放在一個數組中並在循環中創建標記，但我無法使其工作。

我試過這樣的：

var places = [
    {id: 1, lat: ..., lng: ..., title: 'Marker 1'},
    {id: 2, lat: ..., lng: ..., title: 'Marker 2'},
    {id: 3, lat: ..., lng: ..., title: 'Marker 3'}
]

function initMap() {
    var map = ...;
    var icon = ...;

    for(var i=0; i<places.length; i++) {
        var marker = new google.maps.Marker({
            position: {lat: places[i].lat, lng: places[i].lng},
            map: map,
            icon: icon,
            label: {..., text: ''+places[i].id},
            title: places[i].title
        });
    }
}

在window.alert(places[i].title)放置一個window.alert(places[i].title)顯示所有標題，因此數組的定義和循環的頭部似乎沒問題。 但是當我嘗試在循環內創建標記時，沒有地圖也沒有顯示標記，所以我想必定會出現某種錯誤，但我無法弄明白。

你看到我做過的任何語法錯誤嗎？

Answer 1

您每次都會覆蓋“標記”變量。

var marker = new google.maps.Marker（{

你必須像為點（lat，long，tile）一樣為標記創建一個數組。

它應該是：

var places = [
    {id: 1, lat: ..., lng: ..., title: 'Marker 1'},
    {id: 2, lat: ..., lng: ..., title: 'Marker 2'},
    {id: 3, lat: ..., lng: ..., title: 'Marker 3'}
]

function initMap() {
    var map = ...;
    var icon = ...;
    var markers = [];

    for(var i=0; i<places.length; i++) {
        markers.push(new google.maps.Marker({
            position: {lat: places[i].lat, lng: places[i].lng},
            map: map,
            icon: icon,
            label: {..., text: ''+places[i].id},
            title: places[i].title
        }));
    }
}

你應該使用const作為數組（標記和位置）並讓for循環。