html页面插入百度谷歌地图

一、百度地图

1、打开“百度地图生成器”的网址:http://api.map.baidu.com/lbsapi/creatmap/index.html

2、在“1.定位中心点”中,查找具体位置

html页面插入百度谷歌地图_第1张图片

 

3、在“2.设置地图”中,按照自己的需求修改地图的外观:

a、地图的宽和高

b、地图上显示的按钮(缩放、缩略图、比例尺)

c、鼠标和键盘对地图的操作

html页面插入百度谷歌地图_第2张图片

4、在“3.添加标注”中,添加自己想要标注的位置和信息

html页面插入百度谷歌地图_第3张图片

5、在“第二步 获取代码”中,点击“获取代码”按钮

html页面插入百度谷歌地图_第4张图片

html页面插入百度谷歌地图_第5张图片

6、把上一步生成的代码保存为html文件(假设保存为map.html)。记住在保存前将代码内

html页面插入百度谷歌地图_第6张图片

修改为charset=utf-8",这样,上一步添加标注里输入的备注和名称才不会乱码显示

7、使用iframe标签,把地图添加到现有的网页中,如:

 

二、谷歌地图

1、在谷歌地图中http://www.google.cn/maps/@35.780287,86.2064243,4z

输入地址,搜索到指定地点之后,点击“共享”按钮

html页面插入百度谷歌地图_第7张图片

点击“共享按钮”之后,选择“嵌入地图”,然后点击“复制HTML”

html页面插入百度谷歌地图_第8张图片

将复制的HTML代码粘贴到相应位置,根据自己需求修改宽高

 

你可能感兴趣的:(前端)