最近客户提了一个需求,要在网站中添加百度地图的显示,其实原来是有谷歌地图的,但由于谷歌在大陆遭到封杀,只好再给用户增加一个选择了。

下面我将自己最近整理的一些知识分享给大家。

  如何使用百度地图API:

1、要先引用API库的链接:

  eg:<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>  

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
  百度地图JavaScript API是一套由JavaScript语言编写的应用程序接口,可帮助您在网站中构建功能丰富、交互性强的地图应用,支持PC端和移动端

基于浏览器的地图应用开发,且支持HTML5特性的地图开发。

  该套API免费对外开放。自v1.5版本起,需先申请密钥(ak)才可使用,接口(除发送短信功能外)无使用次数限制。

  打开该链接:http://developer.baidu.com/map/index.php?title=jspopular

  这里面有很多Demo,可以自己先看一下。

2、以百度提供的Demo为例,简单介绍一下:

 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: %;height: %;overflow: hidden;margin:;font-family:"微软雅黑";}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4">
</script>
<title>地图展示</title>
</head>
<body>
<div id="allmap" style="width:800px;height:600px"></div>
</body>
</html>
<script type="text/javascript">
//百度地图API功能
var map = new BMap.Map("allmap"); //创建Map实例
var point = new BMap.Point(116.404, 39.915);//初始化地图,设置中心点坐标和地图级别
map.centerAndZoom(point, );
map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
map.setCurrentCity("北京"); //设置地图显示的城市 此项是必须设置的
map.enableScrollWheelZoom(true);//开启鼠标滚轮缩放
//创建标注
function addMarker(point){
var marker = new BMap.Marker(point);
map.addOverlay(marker);
}
addMarker(point);
</script>

  将上面的代码复制下来,保存为.html文件,然后运行,会显示为和百度地图一样的页面。

  效果截图如下:

  

  先整理这么多,这些都是比较简单的,一些入门知识,等以后接触更多的话,再继续和大家分享。

C#调用百度地图API经验分享(一)的更多相关文章

  1. C#调用百度地图API经验分享(四)

    这一篇,记录一下我调用的地图API实现的功能.下面介绍的都是一些片段的节选,不能直接复制就运行.在实现之前肯定要加载地图,先放一个webbroser控件,然后如下: private void Form ...

  2. C#调用百度地图API经验分享(三)

    这一篇我将跟大家分享一下我自己在开发过程中总结出的一些操作地图的方法,属性,及思路,希望可以让大家少走弯路. 1.定位 一般百度的示例DEMO里开始初始化地图时用的都是map.centerAndZoo ...

  3. C#调用百度地图API经验分享(二)

    接着上一篇,将上一篇代码的js提取出来:<script type="text/JavaScript">var map = new BMap.Map("allm ...

  4. 调用百度地图Api实现的查看地图功能的小插件

    1. 功能 bMap.js 可根据地理位置调用出百度地图,采用弹出框形式 2.用法 var city = '青岛市'; var address = '香港中路'; bMap.init({ city : ...

  5. 【c#】Form调用百度地图api攻略及常见问题

    首先,在Form中调用百度地图api,我们需要使用webbrowser控件,这个在前面的文章中已经讲过了,可以参照(http://blog.csdn.net/buptgshengod/article/ ...

  6. HTML5调用百度地图API获取当前位置并直接导航目的地的方法

    <!DOCTYPE html> <html lang="zh-cmn-Hans">     <meta charset="UTF-8&quo ...

  7. HTML5 调用百度地图API地理定位

    <!DOCTYPE html> <html> <title>HTML5 HTML5 调用百度地图API地理定位实例</title> <head&g ...

  8. 跨平台移动开发_PhoneGap 使用Geolocation基于所在地理位置坐标调用百度地图API

    使用Geolocation基于所在地理位置坐标调用百度地图API 效果图 示例代码 <!DOCTYPE html> <html> <head> <title& ...

  9. HTML5调用百度地图API进行地理定位实例

    自从HTML5的标准确定以后,越来越多的网站使用HTML5来进行开发.虽然对HTML5支持的浏览器不是很多,但是依然抵挡不了大伙对HTML5开发的热情.今天为大家带来的是使用HTML5调用百度地图AP ...

随机推荐

  1. python(24)urlencode和urldecode

    当url地址含有中文,或者参数有中文的时候,这个算是很难正常了,但是把这样的url作为参数传递的时候(最常见的callback),需要把一些中文甚至‘/’做一下编码转换. 一.urlencode ur ...

  2. Jmeter安装

    安装下载方法:http://www.jb51.net/softjc/266834.html 下载地址:http://jmeter.apache.org/download_jmeter.cgi Wind ...

  3. cordova-plugin-unionpay

    https://github.com/Santino-Wu/cordova-plugin-unionpay

  4. 课堂笔记--Strom并发模型

    Strom并发模型:     topology是如何运行的?(可与mapreduce对比)         第一层:cluster         第二层:supervisor(host.node.机 ...

  5. DATAGUARD 在线重建备库

    环境: OS: CentOS 6.5 X64 DB: oracle 10.2.0.5 故障:之前由于错误激活备库主写导致主备日志同步,重建备库 1.关闭备库,删除数据文件及控制文件,redo文件 rm ...

  6. Vi中的^M问题

    一般情况下,windows下编辑过的文件放到Linux下行尾会多出一个^M符号 1.可以通过dos2unix 命令作用与文件消除 2.或者在VI内通过 只需要在vi/vim 中输入命令:%s/\r// ...

  7. Thinkpad 笔记本VMware Workstation 安装虚拟机出现“此主机支持 Intel VT-x,但 Intel VT-x 处于禁用状态”解决方法

        今天在使用VMware打算在机器中安装新的虚拟机时,出现"此主机支持 Intel VT-x,但 Intel VT-x 处于禁用状态"错误如下:  提示信息: 已将该虚拟机配 ...

  8. 有效Email

    !/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test($.trim($('#account').val()))

  9. PacketiX VPN搭建企业VPN

    参考资料:http://jingyan.baidu.com/article/9989c746043c44f649ecfe69.html

  10. Python之路【第十九篇】:爬虫

    Python之路[第十九篇]:爬虫   网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种按照一定的规则,自动地抓取万维网信息的程序或者脚本.另外一些不常使用 ...