动态显示iframe中的Google地图 [英] Display google maps in iframe dynamically

问题描述

我想在javascript中动态创建一个google maps链接，并将其设置为我的iframe的src，但我不知道这是不是可能与谷歌地图，因为这是行不通的：

/ p>

  document.getElementById（'map_canvas'）.src ='http：//maps.google.com/maps/ms？ie = UTF8&放大器;放大器; MSA = 0&放大器;放大器; MSID = 209246852521822593612.0004feda304ac527ea40a&放大器;放大器;输出=嵌入'; 
  

虽然，例如这样做：

  document.getElementById（'map_canvas'）.src ='http：//www.cnn.com'; 
  

这是我的iframe：

 < iframe id =map_canvasname =map_canvaswidth =100％height =600px
 frameborder =0scrolling =nomarginheight =0 marginwidth =0
 src => 
< / iframe> 
  

您能解释一下吗？如何在iframe中动态生成并显示Google地图链接？

感谢您的帮助！ 我用这种方法解决了问题：
我已经为每个jQuery添加了iframe，并设置了所需的src attr。
$ b

 函数displayMapAt（lat，lon，zoom ）{
 $（＃map）
 .html（
< iframe id = \map_frame \
 +width = \100 ％\height = \600px \frameborder = \0 \scrolling = \no\marginheight = \0 \marginwidth = \0 \ 
 +src = \https://www.google.sk/maps?f=q&amp;output=embed&amp;source=s_q&amp;hl=sk&amp;geocode=& ;安培; q = HTTPS：％2F％2Fwww.google.sk％2Fmaps％2Fms％3Fauthuser％3D0％26vps％3D5％26hl％3Dsk％26ie％3DUTF8％26oe％3DUTF8％26msa％3D0％26output％3Dkml％2 6msid％3D205427380680792264646.0004fe643d107ef29299a& amp; aq =& amp; sll = 48.669026,19.699024& sspn = 4.418559,10.821533& ie = UTF8& ll =
 + lat +， + lon 
 +& amp; amp; spn = 0.199154,0.399727& amp; t = m& amp; z =
 + zoom +\+>< /的iframe>中）; 
 
} 
  

I would like to dynamically create a "google maps" link in javascript and than set it as src for my iframe, but I don't know if it is not possible with google maps, because this doesn't work:

    document.getElementById('map_canvas').src='http://maps.google.com/maps/ms?ie=UTF8&msa=0&msid=209246852521822593612.0004feda304ac527ea40a&output=embed';

although, for example this works:

    document.getElementById('map_canvas').src='http://www.cnn.com';

This is my iframe:

<iframe id="map_canvas" name="map_canvas" width="100%" height="600px"
    frameborder="0" scrolling="no" marginheight="0" marginwidth="0"
    src="">
</iframe>

Could you explain me, how is it possible to dynamically generate and display a google maps link in iframe ?

Thank you for help!

解决方案

I solved it this way: I have added iframe per jQuery and set the desired src attr.

function displayMapAt(lat, lon, zoom) {
        $("#map")
                .html(
                        "<iframe id=\"map_frame\" "
                                + "width=\"100%\" height=\"600px\" frameborder=\"0\" scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\" "
                                + "src=\"https://www.google.sk/maps?f=q&amp;output=embed&amp;source=s_q&amp;hl=sk&amp;geocode=&amp;q=https:%2F%2Fwww.google.sk%2Fmaps%2Fms%3Fauthuser%3D0%26vps%3D5%26hl%3Dsk%26ie%3DUTF8%26oe%3DUTF8%26msa%3D0%26output%3Dkml%26msid%3D205427380680792264646.0004fe643d107ef29299a&amp;aq=&amp;sll=48.669026,19.699024&amp;sspn=4.418559,10.821533&amp;ie=UTF8&amp;ll="
                                + lat + "," + lon
                                + "&amp;spn=0.199154,0.399727&amp;t=m&amp;z="
                                + zoom + "\"" + "></iframe>");

    }

这篇关于动态显示iframe中的Google地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！