切换到宽版
 
四月初八，你上

四月初八，你上

人民怀念马云

人民怀念马云

2023年第一季度

2023年第一季度

短袖女2023新款

短袖女2023新款

发帖 回复
返回列表
  • 798阅读
  • 3回复

如何在网站中加入百度地图 [复制链接]

 上一主题 下一主题
在线同城在线
管理员
 

发帖
2425
好评度
4231
只看楼主 倒序阅读 使用道具 楼主  发表于: 2014-12-03
关键词： 百度地图
MQ4KdqgP  
.V*^|UXbHi  
M3AXe]<eC1  
很多企业及个人都想在自己的网站中加入百度地图代码，但是一时间不知道如何在网站中加入百度地图。 Pc9H0\+Xk  
g&.=2uP  
<Gsu Z  
工具/原料 j.YA 2mr  
r*Xuj=  
;rS{:  
  • #;<Y[hR{P  
     _4f;<FL  
    第一种：在百度地图上直接保存地图图片，并在PS中直接制作样式，并将图片上传至网站相应位置； KSL`W2}  
  • j!ch5A  
    pJ{Y lS{  
    第二种：在百度地图生成器中进行地图生成，完成后将代码复制到网站的相应位置； ~s{$WL&  
  • "5 A! jq  
    =lC7gS!U  
    第三种：在百度搜索百度地图名片，这种方法非常容易，要比我今天所讲的要更容易些。
 snJ129}A  
gFh*eCo   
g78^9Y*1  
方法/步骤 > P)w?:k  
m kexc~l  
 3CJwj  
  1. #/]nxW.S  
    tVjsRnb{  
    ElXFeJ%[G  
    记住百度地图生成器地址百度地图生成器的地址：http://api.map.baidu.com/lbsapi/creatmap/index.html =Sv/IXX\di  
    <uJ@:oWG7  
  2. ])!*_  
    7 d vnupLh  
    wS*E(IAl  
    打开地图生成器：生成器地址已经在上面提到了，这里就不重复了。 <QvOs@i*  
  3. W%J\qA  
    (#'>(t(4  
    t^L]/$q  
    创建地图。1.定位中心点：将“当前城市”切换到你要创建地图的城市，并输入详细地址进行查找。 9B4&m|g  
       2.设置地图：设置地图尺寸，地图缩放、地图缩略图、地图比例尺、地图状态等。依照自己或者客户的习惯进行设定。   3.添加标注：标记的图标可以在地图上面进行简单修改位置。输入公司的名称，在备注中可以添加地址、电话、传真、邮编、邮箱等属性。点击保存将进行下一步。 0`hdMLONR  
    n*$ g]G$  
  4. 4
    ;nGa.= "L  
    =T_g}pu  
    获取代码，这块我相信就不用详细说明了吧。只要点击获取代码按钮，就会自动弹出一个“自定义地图代码”的页面，将页面中的代码复制即可。 H#&00Q[  
  5. 5
    h$*!8=M  
    ry!!9Z>9n  
    将代码复制到网站的相应位置即可。 /E>e"tvss  
 F\! `/4  
同城中国网 中国第一家B2C 020综合营销门户网站及电子商务平台
回复
举报
分享到 淘江湖 新浪 QQ微博 QQ空间 开心 人人 豆瓣 网易微博 百度 鲜果 白社会 飞信
在线同城在线
管理员

发帖
2425
好评度
4231
只看该作者 沙发  发表于: 2014-12-03
百度地图API使您能够将百度地图嵌入自己的网页中。一个地图 API 密钥只对一个“目录”或域有效。您必须有百度帐户才能获得地图API密钥，并且API密钥会与您的百度帐户关联。 q@qsp&0/  
6-I'>\U~  
百度地图api使用_百度地图api ... :0ep( <|;  
刚刚发现百度地图api开放了.地址是: http://openapi.baidu.com/map/index.html 百度地图API是一套由JavaScript语言编写的应用程序接口，它能够帮助您在网站中构建功能丰富、交互性强的地图应用程序。百度地图API不仅包含构建地图的基本接口，还提供了诸如本地搜索、路线规划等数据服务。地图API的服务是免费的，任何非盈利性网站均可使用。请参阅使用条款获得详细信息。百度地图api使用,百度地图api下载_百度地图api教程百度地图api教程: http://openapi.baidu.com/map/documents.html 什么是百度地图API？百度地图API是一套由JavaScript语言编写的应用程序接口，它能够帮助您在网站中构建功能丰富、交互性强的地图应用程序。百度地图API不仅包含构建地图的基本功能接口，还提供了诸如本地搜索、路线规划等数据服务。面向的读者API是提供给那些具有一定HTML和JavaScript编程经验的读者使用的。此外，读者还应该对地图产品有一定的了解。您可能对地图的内部处理逻辑不是很了解，百度地图AP
同城中国网 中国第一家B2C 020综合营销门户网站及电子商务平台
回复
举报
在线同城在线
管理员

发帖
2425
好评度
4231
只看该作者 板凳  发表于: 2014-12-03
最近在做一个网站，需要嵌入经销商的位置和信息。搜索了很多资料，终于完成了功能，给大家分享一下。 GmG 5[?)  
地图功能：按标尺缩放，鼠标滑动缩放，添加标注和 信息。 %*U'@r(A  
具体步骤： 9z0p5)]n>  
1：首先到百度地图API，申请密钥。（如果没有百度账户得先注册一个） =I4lL]>  
2：百度地图API的功能做得比较分散，像标注、缩放等都是需要自己一步步找代码的。我把代码整理了一下，给大家复制一下，应该是最简洁的了 y2v^-q3  
<head> 4JEpl'5^Q  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> pJ=#zsE0  
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=申请的密钥"></script> nNm`Hfi  
</head> n?Q|)2 2  
<body> :Al!1BJQ  
<div style="width:500px;height:500px;margin:0 auto" id="allmap"></div> ;j7#7MN2_E  
<script type="text/javascript"> 2T1q?L?]  
    var map = new BMap.Map("allmap");     Bwrx*J  
    var point = new BMap.Point(116.384, 39.987);  // 需要标注的位置的经纬度   !<oe=)Iz|  
    map.centerAndZoom(point, 15);  // 中心位置和缩放倍数 S3#>9k;p  
    map.enableScrollWheelZoom();   // 添加滚动轴 lk!@?  
    map.addControl(new BMap.NavigationControl());   // 添加左上角的标尺工具 CAe!7HiR  
    map.addControl(new BMap.NavigationControl());     %)|s1B'd  
    map.addControl(new BMap.ScaleControl());     j+!v}*I![  
    map.addControl(new BMap.OverviewMapControl());     %C0Dw\A*:  
    map.addControl(new BMap.MapTypeControl());     h 0|s  
    map.setCurrentCity("北京"); @c#(.=  
     N;R^h? '  
    var opts = {     pw#-_  
         width : 200,     // 信息窗口宽度     E@\e$?*X  
        height: 20,     // 信息窗口高度     ':q p05t  
         title : "健翔桥东华亭家园"  // 信息窗口标题   ,I9bNO,%JK  
    }     O2+6st  
    var infoWindow = new BMap.InfoWindow("xxx公司", opts);  // 创建信息窗口对象     7nSxi+6e  
    map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口 83m3OD_y  
    var marker = new BMap.Marker(point);        // 创建标注,即地图上的小红点     0%B/,/PxD  
    map.addOverlay(marker);                             G5!^*jf  
</script>
同城中国网 中国第一家B2C 020综合营销门户网站及电子商务平台
回复
举报
在线同城在线
管理员

发帖
2425
好评度
4231
只看该作者 地板  发表于: 2014-12-10
54,er$$V  
零成本搬家工具 / 1RpM]d  
W)/#0*7  
只需一步，实现“零成本”迁移！适用于所有利用谷歌API制作的地图应用，无需开发，即可迁移至百度。 ^OdP4m( >>  
=wJX 0A|  
RCrCs  
快速示例 *a)n62  
Mt$ *a  
迁移工具JS： #Z#-Ht  
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script> qK+5NF|  
<script type="text/javascript" src="g2b.o.js"></script>           ]GS bjHsO  
  如下图，您需要做的，仅仅是将谷歌的JS替换成迁移工具的JS。 5-V pJ  
R_KH"`q  
Iv *<L a  
同城中国网 中国第一家B2C 020综合营销门户网站及电子商务平台
回复
举报
发帖 回复
返回列表
快速回复
限100 字节
如果您在写长篇帖子又不马上发表，建议存为草稿
 
上一个 下一个