新版百度地图带标注功能源码

0 151 2024-07-12 14:21:07

本文目录

1. 百度地图api调用源码
2. 要修改的地方

最开始的百度地图比较简单，可视化创建后就可以直接使用。但近几年如果要嵌入地图，则要求使用api。

以下是一段使用百度地图的api源码。

注意，使用本教程介绍的百度地图需要申请api key，也就是百度的ak。

百度地图api调用源码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>百度地图api</title>
</head>
<body>
<div id="map" style="height:500px; width:1300px;margin:40px auto 0 auto ;"></div>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=你的百度地图ak"></script>
<script>
baiduMap(
    'map',
    'x坐标,y坐标',
    '<div class="bdmap"><p>全国客服电话：400-888-8888<br/></p><p>地址: xxxxxxxxx</p></div>',
    {
        size: 15
    }
);
function baiduMap ( mapName , where , make , nature ) {
	if ( nature ) {
		'size' in nature ? '' : nature.size = 15;
	} else {
		nature = new Object ();
		nature.size = 15;
	};
	var map = new BMap.Map( mapName );
	var point = new BMap.Point( where.split( ',' )[ 0 ] , where.split( ',' )[ 1 ] );
	var marker = new BMap.Marker( point );
	map.centerAndZoom( point , nature.size );
	map.addOverlay( marker );
	map.addControl( new BMap.NavigationControl () );
	map.enableContinuousZoom();
	map.enableScrollWheelZoom();
	var opts = {
		title : make
	};
	var infoWindow = new BMap.InfoWindow( '' , opts );
	marker.openInfoWindow( infoWindow , map.getCenter () );
};
</script>
</body>
</html>

要修改的地方

1、修改ak为你申请的ak
2、修改坐标点x,y
3、自定义标注上的文字。

本文地址：https://xzo.com.cn/develop/js/1375.html

有帮助，很赞！

信息来源：下载鸥

业务合作

如果您认可我们的分享，有意与我们合作开展帝国cms网站建设与开发业务或插件定制，请联系右侧在线客服。我们能给您的，就是高质量的模板与售后。

版权声明

标注了信息来源为下载鸥的文章皆为原创，如果是转载的优质文章，我们也都标注了出处。如果您喜欢我们的文章，请按照下载鸥所标注的文章出处进行标注，谢谢您的配合。

信息标签

为什么jQuery的click事件会触发两次？ js判断图片加载失败时自动显示默认图片onerror jQuery监听数字输入并每隔4个数加一个空格 jQuery实现一套信息管理交互（管理-全选/反选-删除） swiper在鼠标移入后停止轮播，移出后继续轮播 CSS3 长方形切掉右下角（不规则五边形）键盘左右键进行上一页下一页翻页 layui获取下拉框的值并赋值给指定的input和p元素 js输入页码并跳转到指定分页怎么做？ canvas操作图片防止跨域 css设置单行滑动显示效果的两种方案 CSS3之弹性盒子布局flex（文字版） jquery不刷新页面重载js脚本一段判断是否微信和ie打开的js代码 animate.css在线调试，支持直接复制样式名 layui自带的搜索功能lay-search介绍 vue3从安装到创建app的流程介绍什么是油猴脚本，有什么用？ vue2和vue3的区别 Javascript引用带时间戳的css文件：new Date().valueOf()

导出教程下载word版教程

关于JS/JQuery

JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。

JavaScript十分强大，不管是前端页面开发、视觉动态渲染、数据交互还是后端逻辑处理，都可以通过JS实现。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中。