首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

网页中如何嵌入谷歌动态map

2012-08-19 
网页中怎么嵌入谷歌动态地图1、首先打开谷歌地图首页:http://ditu.google.cn输入网点中心名称(例如:北京科

网页中怎么嵌入谷歌动态地图

1、   首先打开谷歌地图首页:http://ditu.google.cn

输入网点中心名称(例如:北京科学院南路投资理财中心),点击搜索地图。

 网页中如何嵌入谷歌动态map

2、  选中所查询的理财中心对应的精确位置,点击分享链接

 

 网页中如何嵌入谷歌动态map

3、  点击‘自定义并预览内嵌的地图’

 

 
网页中如何嵌入谷歌动态map
 

4、  地图大小选中[自定义],填写合适的地图大小。将[请复制此HTML并将其粘贴嵌入到您的网站上]中的代码复制到一个html文件中,就可以看到效果了。


网页中如何嵌入谷歌动态map
 

 

5、  如果要动态实现根据不同的地点显示对应的地图,那么仔细观察[请复制此HTML并将其粘贴嵌入到您的网站上]中的代码,找到href,粘贴href双引号里面的全部内容,保存在对应的地点信息中,以后查询此信息动态显示到网页href中去即可。


网页中如何嵌入谷歌动态map
 

 

6、  我们开发的时候是将地图动态嵌套在jsp里,此时遇到一个问题,就是用c:out标签动态赋予src及href值时,显示出来的结果总是不对,这是因为它把url里的码都解了,例如:&,直接解析成&了。所以要加上一个选项escapeXml='false'。

Html代码 网页中如何嵌入谷歌动态map 网页中如何嵌入谷歌动态map网页中如何嵌入谷歌动态map
    <div class="c_p_b_a r">    <iframe width="362" height="210" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="<c:out value='${finCenter.add}&output=embed' escapeXml='false'/>">        </iframe><br />          <small>                <a href="<c:out value='${finCenter.add}'/>" escapeXml='false' style="color:#0000FF;text-align:left" target="_blank">查看大图</a>        </small>    </div> 

热点排行