在谷歌地圖信息窗口填充與動態HTML元素（contentString變量）

我使用的是「獲取路線」功能來創建其認定的兩個點之間的最佳路線的簡單路徑搜索腳本。在谷歌地圖信息窗口填充與動態HTML元素（contentString變量）

路線時，它的形式如下：

Turn left at... 

Keep right... 

Continue onto...

我要的是點擊這些消息，這將打開信息窗口在地圖上的標記物的選擇。問題是，信息窗口應包含點擊消息：

當我點擊「保留權利......」，應該有一個標誌與內容信息的座標打開「保留權利......」。我錯過了最後一部分 - 用這些內容填充標記。

這裏是代碼的重要組成部分：

var directionDisplay; 
var directionsService; 
var map; 
var contentString = ???; 
var infoWindow; 
var marker; 
var Here; 

function initialize() { 
    var rendererOptions = { 
    draggable: true 
    }; 
    directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions); 
    directionsService = new google.maps.DirectionsService(); 
    Here = new google.maps.LatLng(0, 0); 
    var myOptions = { 
     zoom: 1, 
     center: Here, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     scrollwheel: true, 
     scaleControl: true 
    } 
    map = new google.maps.Map(document.getElementById("mapCanvas"), myOptions); 
    directionsDisplay.setMap(map); 
    directionsDisplay.setPanel(document.getElementById("guide")); 
    infoWindow = new google.maps.InfoWindow({ 
    content: contentString 
    }); 
    google.maps.event.addListener(marker, 'click', function() { 
    infoWindow.open(map,marker); 
    }); 
} 

function calcRoute() { 
    var request; 
    var so; 
    var start = document.getElementById("from").value; 
    var end = document.getElementById("to").value; 
... 
    } 
    directionsService.route(request, function(response, status) { 
    if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(response); 
    } 
... 
}

我試圖填充contentString變量與一些字符串，即使有「contentString」，但沒有任何反應。

這裏是行中的一個的具有指令的代碼：

<tr jseval="setupPanelStep(this, $legIndex, $index)" jsselect="steps" jstcache="12" jsinstance="12"> 
    <td jscontent="($index + 1) + '.'" class="adp-substep" jstcache="14">13.</td> 
    <td jsvalues=".innerHTML:format(instructions)" class="adp-substep" jstcache="15">Continue onto <b jstcache="0">A1</b><div style="font-size: 0.9em;" jstcache="0">Toll road</div></td> 
    <td class="adp-substep" jstcache="0"><div jscontent="distance['text']" class="adp-distance" jstcache="16">123 km</div></td> 
</tr>

這是顯示一個腳本給用戶的代碼的一部分：

<form id="Googlemap" style="height:800px;" action="#"> 
<div style="width:250px; float:left;"> 
<div class="title">GET DIRECTIONS</div> 
<div id="123"> 
<div style="width:250px; margin-bottom: 5px;"><span style="width:54px; float:left;">FROM</span> 
<input type="text" id="from" name="from" /> 
</div> 
<div style="width:250px; margin-bottom: 5px;"><span style="width:54px; float:left;">TO</span> 
<input type="text" id="to" name="to" /> 
</div> 
</div> 

<div> 
<input type="checkbox" id="tolls" /><label for="tolls">Avoid tolls</label> 
<input type="checkbox" id="highways" /><label for="highways">Avoid highways</label> 
</div>

來源

2011-03-23 take2

你能向我們展示更多與信息窗口連接「左轉..」的代碼嗎？ – kjy112 2011-03-25 02:04:32

@ kjy112沒有其他代碼將駕駛指令與信息窗口連接起來。我插入了一些代碼應插入的問號。不過，我用更多的代碼（可能很重要的一切）和Google的驅動指令代碼部分更新了問題。 – take2 2011-03-26 17:39:59

@ take2你最初的兩點標記在哪裏？你錯過了標記。沒有最初的兩點，你如何得到方向？ – kjy112 2011-03-27 03:19:30

嘗試這種情況：

infoWindow = new google.maps.InfoWindow({ 
    content: document.getElementById(contentString) 
});

其中contentString是HTML元素ID

來源

2011-05-25 10:32:57 ignatius

謝謝！完美工作！ – HumbleBeginnings 2015-06-06 04:54:34

在谷歌地圖信息窗口填充與動態HTML元素（contentString變量）

回答

相關問題