百度地图js轨迹展示
<script type="text/javascript"
src="http://api.map.baidu.com/api?v=3.0&ak=xxx自己申请的百度地图token"></script>
var dian = list[(carLength) / 2];
dian = dian.toString();
arr = dian.split(',');
var x = arr[0];
var y = arr[1];
// 百度地图API功能
var map = new BMap.Map("allmap"); // 创建Map实例
map.centerAndZoom(new BMap.Point(x, y), 15); // 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
map.setMapStyleV2({
styleJson : styleJson
});
setTimeout(drawIcon, 500);
var carMk;
var myBeginIcon = new BMap.Icon(
"自己的图片URL",
new BMap.Size(30, 37), {
imageOffset : new BMap.Size(0, 0)
});//人
var myEndIcon = new BMap.Icon("$自己的图片URL",
new BMap.Size(30, 37), {
imageOffset : new BMap.Size(0, 0)
});//人
//显示原始路线
function drawGreenLine(j, color, weitht) {
var polyline = new BMap.Polyline([
new BMap.Point(list[j][0], list[j][1]),//起始点的经纬度
new BMap.Point(list[j + 1][0],
list[j + 1][1]), //终点的经纬度
], {
strokeColor : color,//设置颜色
strokeWeight : weitht, //宽度
strokeOpacity : 1
});//透明度
map.addOverlay(polyline);
}
function drawIcon() {
if (carMk) {
map.removeOverlay(carMk);
}
carMk2 = new BMap.Marker(new BMap.Point(list[0][0],
list[0][1]),//起始点的经纬度
{
icon : myBeginIcon
});
map.addOverlay(carMk2);
carMk = new BMap.Marker(new BMap.Point(
list[i - 1][0], list[i - 1][1]), //终点的经纬度
{
icon : myEndIcon
});
map.addOverlay(carMk);
for (var j = 0; j < list.length - 1; j++) {
drawGreenLine(j, "red", 4);
}
}
}
});
});
//获取路线
/* function drawGreenAddress(i, color, weitht) {
if (i % 2 == 0) { //不能太频繁请求百度地址,这里可能会改大
var geoc = new BMap.Geocoder();
geoc.getLocation(new BMap.Point(list[i].Long, list[i].Lat),
function(rs) {
var addComp = rs.addressComponents;
address = addComp.province + addComp.city
+ addComp.district + addComp.street
+ addComp.streetNumber;
$("#allmap_value").val(address)
});
}
}
*/
function lineAddress(i, color, weitht) {
drawGreenLine(i, color, weitht)
drawGreenAddress(i, color, weitht)
}
//运行地图轨迹
/* function play() {
if (index < listLast) {
//lineAddress(index, "red", 2);
//显示地址
//show_mycat($("#allmap_value").val(), list[index + 1].Long,
// list[index + 1].Lat);
//1
//timer = window.setTimeout("play(" + index + ",'red',2)", 500);
index++;
}
百度地图js轨迹展示相关推荐
- 百度地图js版api绘制几何图形覆盖物并保存数据库
百度地图js版api绘制几何图形覆盖物并保存数据库 你好!相信你看到这边文章的时候,我的方案,已经满足了你的需求: 1,在html5上调用web版百度地图api,绘制多边形,我项目的是绘制小区. 2, ...
- 关于百度地图js api的getCurrentPosition定位不准确的解决方法
关于百度地图js api的getCurrentPosition定位不准确的解决方法 参考文章: (1)关于百度地图js api的getCurrentPosition定位不准确的解决方法 (2)http ...
- 百度地图js 定位并获得精确的地址信息
使用百度地图js api定位并获得精确地址: var map = new BMap.Map("map"); var geolocation = new BMap.Geolocati ...
- 百度地图鹰眼轨迹服务
这里写目录标题 百度地图鹰眼轨迹服务 鹰眼轨迹服务概述: 鹰眼轨迹服务基本概念: 权限与配额: 创建鹰眼服务: 获取服务id: 终端管理: 添加entity: 添加entity自定义字段: 更新ent ...
- 百度地图 js 在安卓端手指缩放无效_利用百度地图绘制3D轨迹演示
简介 百度地图很强大,也为开发者提供很好的开发接口.今天用3D地图上路线轨迹可视化的小功能. 使用 第一步:申请ak ak申请介绍 创建的时候选择浏览器端~ 第二步:填写ak 有了 ak 后,复制下面 ...
- js百度地图小车html,Web js实现百度地图实时轨迹画线 小车车行驶轨迹 | 彬菌
版权声明:转载原创文章请以超链接形式请注明原文章出处,尊重作者,尊重原创! 恰饭广告 注意: 1.百度地图ak换成自己在百度地图官网申请 2.建议使用firefox浏览器,google被墙无法调用gp ...
- 采用百度地图|js实现行车轨迹、覆盖类等。
效果图: 一.引进js <script type="text/javascript" src="${cxt!}/static/wxweb/oil/js/jquery ...
- 百度地图js实时播放轨迹
功能:每个10秒获取车辆的最新位置点,然后地图上画出点和线路,两点之前是用规划路线,而不是直接连线,并且移动点时,根据位置是否在视野范围内,重新设置地图的视野,下面是代码 <!DOCTYPE h ...
- 百度地图实现轨迹回放（显示到达时间）
使用了百度路书 直接上代码,添加秘钥直接运行 <!DOCTYPE html> <html> <head><meta http-equiv="Cont ...
最新文章
- 在CentOS 6.8 x86_64上安装nginx 1.10.3
- 鱼眼相机标定_鱼眼相机模型（二）
- 添加vlan后无法上网_VLAN攻击如何有效防范？搞定虚拟局域网就在以下三点
- Xshell链接不上云服务器的解决方案
- 对于局部变量_对于SQL常用查询优化方法的整理
- 设计灵感|双重曝光放在海报里原来这么好看！
- Java 异常的捕获与处理详解 （一）
- Tensorflow车牌识别完整项目（含完整源代码及训练集）
- 为Windows 7 Professional安装多语言包
- [资讯]北京二套学区房奋斗目标
- springboot基于web的游泳馆信息管理系统毕业设计源码281444
- ODL（C版本）安装过程
- 第一章第二题（显示五条消息）(Display five messages)
- 服务器的操作审计信息,裸金属服务器关键操作审计
- 比太阳还要明亮！天文学家发现使上最亮星体
- 2.4g语音遥控器小结
- 爱普生XP245 EPSON XP245升级固件墨盒不识别免芯片固件免费下载解决方法教程
- mysql篇-mysql的locate函数
- 说话人识别相关基础知识整理（持续更新）
- 360、搜狗搜索内容200重定向真实链接获取