javascript - Open Google directions into div from Map marker -

javascript - Open Google directions into div from Map marker -

im trying open directions marker click on google maps in div rather in new window.

currently can open direction in new window want open them in iframe in div displayed when marker clicked.

i cant utilize static src url on iframe because utilize different url different markers on map.

any help great, have far.

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'], ]; (var = 0; < 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; }); }

the html:

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

i have tried making var of this.url , setting in function no luck

var urlis = this.url; document.getelementbyid('directioniframe').src = " urlis ";

have seek split in function?

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

javascript html google-maps