html引用百度地图API_sysu安仔的博客-程序员宅基地_html引入地图

技术标签: html  api  百度地图  

百度地图的API为:<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=67jMQ5DmYTe1TLMBKFUTcZAR"></script>


下面为完整的html代码:

<!DOCTYPE <html>
<head>
	<title>map</title>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=67jMQ5DmYTe1TLMBKFUTcZAR"></script>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
</head>
<body>
<div id="map">
	 <div style="width: 80%; height: 800px;" id="mymap"></div>
</div>
<script type="text/javascript">
	$(function(){
		showMap(113,23); //初始坐标
	})

	//传入坐标,然后跳转到该位置
	function showMap(x, y) { 
		var map = new BMap.Map("mymap");
		map.centerAndZoom(new BMap.Point(x, y), 15); //坐标,放大倍数
		//显示左上角的辅助栏
		 map.addControl(new BMap.NavigationControl());
		//创建小红点
		var marker = new BMap.Marker(new BMap.Point(x, y));
		map.addOverlay(marker);
		//穿件创建小红点上的提示框
		var infoWindow = new BMap.InfoWindow("<p>名字:风玡</p><p>phone:12345678911</p>");
		marker.addEventListener("click", function(){
			this.openInfoWindow(infoWindow);
		})

	}
</script>
</body>
</html>


版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/liujan511536/article/details/49996627

智能推荐

真正的中国天气api接口xml,json(求加精) ..._方阳的博客-程序员宅基地

我只想说现在网上那几个api完全坑爹有木有???官方的申请不来有木有,还有收费有木有??咱这种菜鸟只能用免费的了!!!!http://m.weather.com.cn/data/101110101.html大坑有木有??反应慢不说了,还老不更新!!想贴段代码的,现在又打不开了(貌似3月4号以后没更新过)====================

学习资料集合_diaoshanwai2368的博客-程序员宅基地

一、NHibernate系列二、WCF系列三、Linix常用命令转载于:https://www.cnblogs.com/JuneZhang/p/3816965.html

关于字符数组以及字符串数组_一尾鱼汤的博客-程序员宅基地

例题13://13.编写一程序,将两个字符串连接起来,结果取代第一个字符串(mark下来加深印象),加油加油加油!(1)自己编写一个strcat函数int main(){ int strcat(char a[100],char b[100]); char a[100]={0}, b[100]={0}; //初始化字符数组; int i=0,j=0; cout&lt;&lt;"请输入两个字符串:"; cin&gt;&gt;a&gt;&gt;b;

Python配置Qt Designer与PyUIC_热心市民付先生的博客-程序员宅基地_python pyuic

Python配置Qt Designer与PyUIC安装pyqt相关包pip install pyqtpip install pyqt5-toolsPyCharm中选择相应的python解释器3. 添加外部工具名称填写自己方便易记得即可,我的名称添加为QTDesigner程序选择designer.exe,位置为当前解释器路径下的Lib\site-packages\pyqt5-tools\designer.exe工作目录为当前项目文件的目录添加选择完毕界面为:确定即可,再次

关于WebSocket_彪彪_的博客-程序员宅基地

原文链接:https://www.liaoxuefeng.com/wiki/1022910821149312/1103303693824096WebSocket是HTML5新增的协议,它的目的是在浏览器和服务器之间建立一个不受限的双向通信的通道,比如说,服务器可以在任意时刻发送消息给浏览器。为什么传统的HTTP协议不能做到WebSocket实现的功能?这是因为HTTP协议是一个请求-响应协议,...

随便推点

接口与监听器_xhsnhl的博客-程序员宅基地

接口与监听器从一个很简单的ui界面来写解释接与监听器接口机制从一个很简单的ui界面来写解释接与监听器接口机制这次不抄概念了简单的说java不支持多类继承 很麻烦 所以有了接口这个功能.我定义一个接口,给接口放入一些归属于这个接口的功能.然后在类中通过一些定义这个接口 来实现我想实现的功能举个例子:interface Animal { public void eat(); public void travel();}public class MammalInt impleme

鼠标移入移出效果 -- jQuery/Vue版_bestvist的博客-程序员宅基地

元素内遮罩层根据鼠标方向显示的效果比较常见,比如百度图片里的图片信息展示。自己动手实现jQuery插件版和Vue组件版效果。原文地址git地址实现思路根据鼠标的位置定位在元素内出现的方向根据方向动态设置遮罩层样式设置动画移动遮罩层jQuery版jQuery插件可以通过$.fn.extend方法进行拓展。html&amp;lt;div class=...

Android -- WifiMonitor_青 nihq的博客-程序员宅基地

在Android的Wifi体系中,WifiMonitor承担着分发来自wpa_supplicant底层事件的任务。当上层下达Wifi的扫描、连接等指令后, 底层驱动以及wpa_s进行实际的扫描、连接操作,操作完成后会向上层反馈一个event,通知framework扫描是否结束、连接是否成功。 ...

英语集合625_pony-Stark的博客-程序员宅基地

       1.I love three things in this world. Sun, moon and you. Sun for morning, moon for night , and you forever.  予独爱世间三物。昼之日,夜之月,汝之永恒。  2.Life has taught us that love does not consist in g

HTML5 APP----2014年H5没火,why?2016年H5能火,why?_谷震平的博客-程序员宅基地

0 前言        HTML5做跨平台的APP,在大多数人的脑子里没有什么好感,我身边的朋友也这么说。Anyway,我用完以后得出这样的结论:HTML5跨平台APP开发,在2015年以后会越来越火。    在2014年以前,HTML5的性能和能力都不够充足。特别是性能,因为Android4.4以下版本不能支持webGL技术,所以大部分低端Android手机无法流畅运行手机APP。D

推荐文章

热门文章

相关标签