第150天:网页中插入百度地图方法(需要密钥)

简介: 在现在的很多页面中,都运用到了百度地图来定位,例如:像这样的地图,我们可以通过手动来进行放大、缩小、移动等来查找具体的地址,特别方便,在页面上引用也显得页面很有特点,那么,应该怎么样来制作这种地图呢?一、获取源代码    网址:http://api.

在现在的很多页面中,都运用到了百度地图来定位,例如:

像这样的地图,我们可以通过手动来进行放大、缩小、移动等来查找具体的地址,特别方便,在页面上引用也显得页面很有特点,那么,应该怎么样来制作这种地图呢?

一、获取源代码

    网址:http://api.map.baidu.com/lbsapi/createmap/index.html?qq-pf-to=pcqq.c2c

1.打开网址,就可以看到一个地图编辑界面:

 

2.在页面右侧设置地点等信息:

1)设置地点

 

2)设置地图上的基本信息

 

3)在地图上添加标志

点击标记图标还可以选择它的样式:

4)获取源代码

    点击页面下面的第二步中的获取源代码即可:

(注意:这里生成的代码是显示不出来的,必须获取密匙)

二、获取密匙

1.点击生成的代码中的“获取密匙”:,然后按照要求一步步填写资料并提交,一定要注意必须进行认证。

2.将生成的Ak(即密匙)复制到代码中,替换掉“您的密匙”

  

三、插入到自己的页面中

按照自己的页面要求将生成的代码插入在页面代码中,但是一定要注意加载顺序的问题:

  方法1:如果js代码是放在页面代码里面的,注意把生成地图js代码放在页面最下边。

  方法2:如果用的外部js链接,应该把地图的js代码放在 $(function(){...})里面。

 

相关文章
|
5月前
|
JavaScript 安全 数据安全/隐私保护
去哪儿旅行JS逆向:__m__加密和请求头键值对加密(上篇)
去哪儿旅行JS逆向:__m__加密和请求头键值对加密(上篇)
82 0
去哪儿旅行JS逆向:__m__加密和请求头键值对加密(上篇)
|
7月前
|
前端开发 UED SEO
HTML基础-链接与图片插入:网页的连接与视觉元素
【6月更文挑战第2天】本文介绍了HTML中`<a>`和`<img>`标签的使用,包括链接的基本结构、目标类型以及图片的插入、尺寸调整和对齐方式。常见问题涉及链接和图片路径、缺失`alt`属性及尺寸不匹配,解决方案包括正确引用资源、使用绝对URL和重视`alt`属性。通过示例代码,展示了创建链接和图片的方法,强调了提升网页用户体验的重要性。
138 3
|
8月前
|
JavaScript
【归总】原生js操作浏览器hash、url参数参数获取/修改方法合集
【归总】原生js操作浏览器hash、url参数参数获取/修改方法合集
|
8月前
|
存储 小程序 JavaScript
微信小程序替换双重循环渲染中报错图片
微信小程序替换双重循环渲染中报错图片
213 0
如何实现一个网页头部图标
如何实现一个网页头部图标
42 0
|
Web App开发 数据采集 JavaScript
一日一技:在网页上如何获取鼠标当前指向的元素
一日一技:在网页上如何获取鼠标当前指向的元素
464 0
|
移动开发 定位技术 API
iOS测试技巧:通过GPX文件修改经纬度信息(模拟iOS设备的位置)
iOS测试技巧:通过GPX文件修改经纬度信息(模拟iOS设备的位置)
822 0
iOS测试技巧:通过GPX文件修改经纬度信息(模拟iOS设备的位置)
|
API 定位技术 数据格式
第151天:网页中插入百度地图方法(不需要密钥)
今天分享一个在网页中插入百度地图的方法,不需要密钥哦,前两天,我试了好多次百度开发平台上使用百度地图的方法,都需要申请密钥,申请了,还是用不了,后来,终于发现了一个不需要密钥的方法,希望对需要的朋友有帮助! 1、打开百度地图生成器链接:http://api.
2365 0