在Google地圖中放置變量腳本標記

我正在嘗試將Google方向地圖放到我的頁面上。 JS元素的定義如下。截至目前這是硬編碼，但我需要使起源（邁阿密，佛羅里達州），目的地（紐約州布法羅）和航點是動態的。我使用angular的http.get從後端獲取Json的位置字符串。在Google地圖中放置變量腳本標記

我的問題如何讓原點，目的地和航點變爲動態？

<script> 
    function initMap() { 
    var map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: 41.85, lng: -87.65}, 
    scrollwheel: false, 
    zoom: 7 
    }); 

    var directionsDisplay = new google.maps.DirectionsRenderer({ 
    map: map 
    }); 

    // Set destination, origin and travel mode. 
    var request = { 
    destination: "Miami, FL", 
    origin: "Buffalo, NY", 
    travelMode: google.maps.TravelMode.DRIVING, 
    waypoints: [ 
    { 
     location:"Richmond, VA", 
     stopover:true 
    },{ 
     location:"Washington, DC", 
     stopover:true 
    }], 
}; 

var directionsService = new google.maps.DirectionsService(); 

directionsService.route(request, function(response, status) { 
if (status == google.maps.DirectionsStatus.OK) { 
    directionsDisplay.setDirections(response); 
    } 
}); 
} 
</script>

來源

2015-11-07 Karlo E.

這裏是JSON數組的一個例子。在這個例子中，數組是在js範圍內聲明的，但是你應該以不同的方式訪問你的數組，我會假設使用ajax。這兩種方式，你都會根據需要安排其餘的代碼。

數組聲明：

var placesJSON = 
    [ 
{ 
    "location":"Richmond, VA", 
     stopover:true 

}, 
    { 
     "location":"Washington, DC", 
     "stopover":true 

    }, 
    { 
     "location":"Atlanta", 
     "stopover":true 

    } 
    ];

動態變量：

var request = { 
    destination: "Miami, FL", 
    origin: "Buffalo, NY", 
    travelMode: google.maps.TravelMode.DRIVING, 
    waypoints: [ 
    { 
     location:placesJSON[0].location, 
     stopover:placesJSON[0].stopover 
    },{ 
     location:placesJSON[2].location, 
     stopover:placesJSON[2].stopover 
    }], 
};

這裏是小提琴例如： https://jsfiddle.net/eugensunic/45n45cpd/1/

如果要通過特定的名稱來訪問你的JSON陣列（未按指數）。然後我建議循環槽陣列並創建一個if語句，例如

if(desired_destination== placesJSON[index].location){// select this places}

確認您的請求。

來源

2015-11-07 08:52:39

感謝您的回答，不是直接的答案，但我從這裏得到了一個主意。再次感謝！ –

在Google地圖中放置變量腳本標記

回答

相關問題