从地图标记打开Goog​​le方向转换为div

Question

我试图从标记点击Google地图而不是在新窗口中的标记。

目前我可以在新窗口中打开方向，但是我想在点击标记时显示的div中的iframe中打开它们。

我不能在iframe上使用静态src url，因为我在地图上为不同的标记使用了不同的URL。

任何帮助将是伟大的，这是我迄今为止。

var depots = [ 
    ['Barnsley', 53.572664, -1.455800, 11, 'http://maps.google.com/?daddr=53.572664,-1.455800&directionsmode=driving'], 
    ['Birmingham', 52.359018, -1.938033, 10, 'http://maps.google.com/?daddr=52.359018,-1.938033&directionsmode=driving'], 
    ['Brentwood', 51.576452, 0.278843, 9, 'http://maps.google.com/?daddr=51.576452,0.278843&directionsmode=driving'], 
    ['Bristol', 51.501280, -2.366513, 8, 'http://maps.google.com/?daddr=51.501280,-2.366513&directionsmode=driving'], 
    ['Cambridge', 52.184396, -0.064012, 7, 'http://maps.google.com/?daddr=52.184396,-0.064012&directionsmode=driving'], 
    ['Edinburgh', 56.129890, -3.390296, 6, 'http://maps.google.com/?daddr=56.129890,-3.390296&directionsmode=driving'], 
    ['Gatwick', 51.152422, -0.216219, 5, 'http://maps.google.com/?daddr=51.152422,-0.216219&directionsmode=driving'], 
    ['Glasgow', 55.927129, -4.467189, 4, 'http://maps.google.com/?daddr=55.927129,-4.467189&directionsmode=driving'], 
    ['Heathrow', 51.508121, -0.387525, 3, 'http://maps.google.com/?daddr=51.508121,-0.387525&directionsmode=driving'], 
    ['Manchester', 53.220004, -2.414895, 2, 'http://maps.google.com/?daddr=53.220004,-2.414895&directionsmode=driving'], 
    ['Southampton', 50.959088, -1.345449, 1, 'http://maps.google.com/?daddr=50.959088,-1.345449&directionsmode=driving'], 


    ]; 
for (var i = 0; i < locations.length; i++) { 
    var depot = locations[i]; 
    var myLatLng = new google.maps.LatLng(depot[1], depot[2]); 
    var marker = new google.maps.Marker({ 
     position: myLatLng, 
     map: map, 
     icon: image, 
     shape: shape, 
     title: depot[0], 
     zIndex: depot[3], 
     url: depot[4] 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     document.getElementById('direction').style.display = ""; 
     window.location.href = this.url; 
    }); 
} 

的HTML：

<div id="directionholder"> 
    <iframe id="directioniframe" frameborder="0" > </iframe> 
</div> 

我试图做的this.url一个VAR和设定，在功能，但没有运气

var URLis = this.url; 
document.getElementById('directioniframe').src = " URLis "; 

Answer 1

你有没有尝试它拆一个函数？

google.maps.event.addListener(marker, 'click', direction); 
function direction(evt) 
{ 
    document.getElementById('directioniframe').src = this.url; 
} 

Answer 2

这里有一个简单的例子，应该怎么做：http://jsfiddle.net/lotusgodkk/x8dSP/3550/

我已经粘贴这应该是循环内的代码。看看它。

JS：

var marker = new google.maps.Marker({ 
    position: myLatlng, 
    map: map, 
    title: 'Hello World!', 
    url:'http://jsfiddle.net' 
}); 
google.maps.event.addListener(marker, 'click', function() { 
    //document.getElementById('direction').style.display = ""; 
    var win = window.open(this.url, '_blank'); 
    win.focus(); 
}); 

关于你的评论中提到的错误，是指这样的回答：Error 6 (net::ERR_FILE_NOT_FOUND): The file or directory could not be found

必须将错误由于协议的问题。另请注意，由于same origin policy，iframe不会加载。在这里阅读更多：http://javascript.info/tutorial/same-origin-security-policy