4 min readJul 9, 2020
Dear Summerxiantian,
謝謝你,我大概說明一下我的作法:
我撰寫了一個function,是專門用來顯示marker的,當我使用DistanceMatrixService得到response後,會將response傳入這個function,這個function會先將我要取用的資料像是duration、distance等值取出,然後一一畫出這些回傳地點在地圖上的marker,這個function大概像下面的程式碼這樣
function displayMarkersWithinTime(response) {
let maxDuration = 300
let origins = response.originAddresses;
let destinations = response.destinationAddresses;
let atLeastOne = false;
findnum = 0; for (let i = 0; i < origins.length; i++) {
let results = response.rows[i].elements;
for (let j = 0; j < results.length; j++) {
var element = results[j];
if (element.status === "OK") {
let distance_num = element.distance.value;
let duration = element.duration.value/60;
let duration_num = Math.round(duration);
if (duration <= maxDuration) {
findnum += 1;
markers[marker_id[j]].setMap(map);
atLeastOne = true;
let infowindow = new google.maps.InfoWindow({
content: '約 ' + duration_num + ' 分鐘可達'
});
infowindow.open(map, markers[marker_id[j]]);
markers[i].infowindow = infowindow;
google.maps.event.addListener(markers[marker_id[j]],
'click', function(){
this.infowindow.close();
});
}
}
}
}
}
所以當使用distanceMatrixService.getDistanceMatrix,得到response後,就可以直接呼叫displayMarkersWithinTime(response),將點位畫出
distanceMatrixService.getDistanceMatrix({
origins: origin,
destinations: destinations,
google.maps.TravelMode[mode],
unitSystem: google.maps.UnitSystem.METRIC,
}, function(response, status) { if (status !== google.maps.DistanceMatrixStatus.OK) {
window.alert(‘Error was’ + status); } else { displayMarkersWithinTime(response);
});
我這邊測試,拿到的response確實好像無法賦值到一個全域的variable來使用,或許應該有做法可以達成,但我還沒有找到解法,所以目前是用上述做法來實現展示查詢結果的功能,給您參考,希望以上說明有幫助到你!