/ / googlemap directonsにカスタム値を追加-wordpress、google-maps、post

Google MapのDirectonsにカスタム値を追加 - ワードプレス、Googleマップ、投稿

Googleの方向を表示するためにカスタムフィールド値を読み取り、開始と終了として設定するにはどうすればよいですか

function calcRoute() {
var start = document.getElementById("start").value;
var end = document.getElementById("end").value;
var waypts = [];
var checkboxArray = document.getElementById("waypoints");
for (var i = 0; i < checkboxArray.length; i++) {
if (checkboxArray.options[i].selected == true) {
waypts.push({
location:checkboxArray[i].value,
stopover:true});
}
}

ワードプレスポストでは、開始値と宛先値を持つ2つのカスタムフィールドがあり、値を読み取り、Googleマップにそのルートを表示するために関数calcroute()に追加します。

私のコード全体(下)は、シカゴの中央ビューのみを表示します

<script>
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
var chicago = new google.maps.LatLng(41.850033, -87.6500523);
var mapOptions = {
zoom: 6,
center: chicago
}
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
directionsDisplay.setMap(map);
}

function calcRoute() {
var start = document.getElementById("plecare_din").value;
var end = document.getElementById("destinatie").value;
var waypts = [];
var checkboxArray = document.getElementById("waypoints");
for (var i = 0; i < checkboxArray.length; i++) {
if (checkboxArray.options[i].selected == true) {
waypts.push({
location:checkboxArray[i].value,
stopover:true});
}
}

var request = {
origin: start,
destination: end,
waypoints: waypts,
optimizeWaypoints: true,
travelMode: google.maps.TravelMode.DRIVING
};

}

google.maps.event.addDomListener(window, "load", initialize);

</script>

回答:

回答№1は1

あなたはトリガーする必要があります calcRoute() どこかで

私はjsfiddleでここに実用的なサンプルを持っています: http://jsfiddle.net/th9kwzdr/1/