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

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

  如何使用百度地图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. Java事务处理全解析(八)——分布式事务入门例子(Spring+JTA+Atomikos+Hibernate+JMS)

    在本系列先前的文章中,我们主要讲解了JDBC对本地事务的处理,本篇文章将讲到一个分布式事务的例子. 请通过以下方式下载github源代码: git clone https://github.com/d ...

  2. gcc-常见命令和错误

      一:编译过程的4个阶段:预处理,编译,汇编,链接; 1:最常用的方式 gcc hello.c -o hello 2:预处理后停止编译 gcc -E hello.c -o hello.i(.i通常为 ...

  3. IntelliJ IDEA内存优化最佳实践

    [编者按]本文作者在和同事的一次讨论中发现,对 IntelliJ IDEA 内存采用不同的设置方案,会对 IDE 的速度和响应能力产生不同的影响. Don’t be a Scrooge and giv ...

  4. MYSQL C API : CLIENT_MULTI_STATEMENTS 选项

    #include <iostream> #include <mysql.h> #include <string> #include <assert.h> ...

  5. XE6移动开发环境搭建之IOS篇(2):安装VM9虚拟机(有图有真相)

    网上能找到的关于Delphi XE系列的移动开发环境的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 1.安装VM9英文原 ...

  6. (Hibernate进阶)Hibernate基本原理(一)

    在开始学hibernate之前,一直就有人说:Hibernate并不难,无非是对JDBC进一步封装.一句不难,难道是真的不难还是眼高手低? 如果只是停留在使用的层面上,我相信什么技术都不难,看看别人怎 ...

  7. js节点属性

    在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType :节点的类 ...

  8. mysql主从复制的一篇文章(转载)

      管理mysql主从有2年多了,管理过200多组mysql主从,几乎涉及到各个版本的主从,本博文属于总结性的,有一部分是摘自网络,大部分是根据自己管理的心得和经验所写,整理了一下,分享给各位同行,希 ...

  9. 一个最简单的登录页面测试case

    具体需求: 有一个登陆页面, (假如上面有2个textbox, 一个提交按钮. 请针对这个页面设计30个以上的testcase.) 此题的考察目的:面试者是否熟悉各种测试方法,是否有丰富的Web测试经 ...

  10. MySql生日闰月处理

    1. 科普下润年: ①.非整百年能被4整除的为闰年.(如2004年就是闰年,2100年不是闰年) ②.整百年能被400整除的是闰年.(如2000年是闰年,1900年不是闰年)   2. 例: 例如:当 ...