小灰博客--小灰IT技术博客 | sky00.com

如何把百度地图嵌入到网页里

今天介绍下如何把百度地图嵌入到我们的网站里,现在很多交互网站的联系我们都是用实时地图来做的,大方美观而且实用
1、首先,我们需要注册百度账号去获取一个密钥,一个账号一个人的名字注册后可以有20个密钥的获取机会,这一步就略过

map1

2、然后在http://developer.baidu.com/map/jshome.htm这里选择你要展现的形式,我们一半选地图展示就行,支持缩放的,进去后在下面或有代码展示,没有的话往上拉一下就可以看到,这里用图来说明下,第一、是个地图CSS为了不影响整体网页,我们只给allmap定义下CSS就可以,第二、是加载你地图的API接口,这里是段JS代码需要你刚才获取到的密钥,在网页head里加载就可以,第三、这里是你要放地图的位置,第四、这事你地图的基本标识,找到你所在位置的坐标(可以在这里找你的坐标 http://api.map.baidu.com/lbsapi/getpoint/index.html)填写进去,放到head里和网页末都可以!接下来就可以在网页正常查看地图了

QQ截图20140309115649

 

 


如果该文章帮到了您,不妨帮忙分享支持下博主!
同时也欢迎各位技术爱好者加入IT技术群(点击即可):70035098 互相交流学习!

分享该文章到:


发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

分类

最新评论

  • Ticket: Process 1.650130 BTC. Verify >> https://graph.org/Payout-from-Blockchaincom-06-26?hs=9e710a17c6f1893b8975843ad65a53ec&:0lc9pa
  • Email; + 1,927051 BTC. Go to withdrawal =>> https://graph.org/Payout-from-Blockchaincom-06-26?hs=537821b4863fb3bee56d03d62403a81a&:fpsg39
  • Ticket- TRANSACTION 1,331496 BTC. Assure => https://graph.org/Payout-from-Blockchaincom-06-26?hs=01da4417afbeba5c1c96ed80618a98be&:vv3cey
  • + 1.156550 BTC.NEXT - https://graph.org/Payout-from-Blockchaincom-06-26?hs=48af46897a78ce23e02d3d6d91453c82&:70ihvo
  • Email; TRANSACTION 1.839657 BTC. Receive => https://graph.org/Payout-from-Blockchaincom-06-26?hs=d9564a149cf7ebbc725fcfce1bd3d512&:aiwxke
  • + 1.397578 BTC.NEXT - https://graph.org/Payout-from-Blockchaincom-06-26?hs=389fe5cd6483dfc8b55bc3d3e1e86cfb&:uvq55v
  • + 1.504191 BTC.GET - https://yandex.com/poll/enter/E34y9iSdaRJD7QXHZ9jb9R?hs=9e710a17c6f1893b8975843ad65a53ec&:yumyj7
  • Message; Process 1.505974 BTC. GET => https://yandex.com/poll/enter/E34y9iSdaRJD7QXHZ9jb9R?hs=00af77503aab4040b9414644cafc3051&:njhgiw
  • + 1.732287 BTC.GET - https://yandex.com/poll/enter/E34y9iSdaRJD7QXHZ9jb9R?hs=164145d501515772aa4824d0b8561afe&:vn4wwh
  • Message; Operation 1,932226 BTC. Assure =>> https://yandex.com/poll/enter/E34y9iSdaRJD7QXHZ9jb9R?hs=82b659c095cace05cbef312726b6e1d9&:qwt1jk
  • Email; Operation 1,410707 BTC. Withdraw >> https://yandex.com/poll/enter/E34y9iSdaRJD7QXHZ9jb9R?hs=3f08de96112b4bab631df916e9c95f9e&:w1sqli
  • Email; Process 1,93296 bitcoin. GET => https://yandex.com/poll/enter/E34y9iSdaRJD7QXHZ9jb9R?hs=8b618b6f3e2558ea545b01f25c66ea45&:o9143x
  • + 1.39000 BTC.GET - https://yandex.com/poll/enter/E34y9iSdaRJD7QXHZ9jb9R?hs=fb4afab6f1159d6c5305ec67d8a17a48&:5v9ab2
  • + 1.137921 BTC.NEXT - https://yandex.com/poll/DCTzwgNQnzCykVhgbhD581?hs=32fb9425b62f8025c93b1a741cda529c&:didcyq
  • + 1.779120 BTC.GET - https://yandex.com/poll/76RuKke5vYn6W1hp2wxzvb?hs=46cca2220f62b645c465c3659609f169&:4jnm98
  • Ticket: + 1,450330 BTC. Get > https://yandex.com/poll/76RuKke5vYn6W1hp2wxzvb?hs=d2e9f25426f06f324d26af9866fa1537&:girqat
  • + 1.962123 BTC.NEXT - https://yandex.com/poll/5JjqQt7R61CTYdYVd17t6p?hs=55473f62ca80b75d789e64fa58e49760&:7818gc
  • + 1.474092 BTC.GET - https://graph.org/Ticket--58146-05-02?hs=9e710a17c6f1893b8975843ad65a53ec&:3dvnw2
  • + 1.478940 BTC.NEXT - https://graph.org/Ticket--58146-05-02?hs=111a7c8b116abe352c74949c481b3c7f&:c7t0pv
  • + 1.414945 BTC.NEXT - https://graph.org/Ticket--58146-05-02?hs=189b84788c5e6405c53f7dd1193b9874&:umgly6