百度地图足迹demo（多点轨迹生成）
不要忘记引用JQuery//~~~<script src="jquery-1.7.1.min.js" type="text/javascript"></script>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body, html, #locationmap {width: 100%;height: 100%;overflow: hidden;margin:0;}
</style>
<script src="jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
<title>百度地图显示多点位置并连线</title>
</head>
<body>
<div id="locationmap"></div>
</body>
</html>
<script type="text/javascript">
var city = "北京";
var map = new BMap.Map("locationmap"); // 百度地图API功能
map.centerAndZoom(city, 14); // 设置地图显示的城市和地图级别
map.enableScrollWheelZoom(); // 启用滚轮放大缩小，默认禁用
map.enableContinuousZoom(); // 启用地图惯性拖拽，默认禁用
map.addControl(new BMap.NavigationControl()); // 添加默认缩放平移控件
map.addControl(new BMap.ScaleControl()); // 添加比例尺控件
map.addControl(new BMap.MapTypeControl()); // 添加地图类型控件
map.addControl(new BMap.OverviewMapControl()); // 添加缩略地图控件
$(function(){
search();
})
function search()
{
var result = [{"id":'1',"address":"故宫博物馆","userid":"a1","longitude":"116.404355","latitude":"39.922723","datetime":"2016"},
{"id":'2',"address":"北海公园","userid":"a2","longitude":"116.396307","latitude":"39.932018","datetime":"2016"},
{"id":'3',"address":"首都博物馆","userid":"a3","longitude":"116.350601","latitude":"39.911434","datetime":"2016"},
{"id":'4',"address":"清华大学","userid":"a4","longitude":"116.335078","latitude":"40.008106","datetime":"2016"}];
map.clearOverlays();
// 清除标注信息
var points = [];
// 添加折线运动轨迹
for(i=0;i<result.length;i++)
{
var userid = result[i].userid;
// 用户ID
var longitude = result[i].longitude;
// 经度
var latitude = result[i].latitude;
// 纬度
var address = result[i].address;
// 地点
var sign_time = result[i].datetime;
// 签到时间
var point = new BMap.Point(longitude, latitude);
// 填充标注点
if(i==0)
{
city = result[i].address;
map.centerAndZoom(city, 14);
map.setCenter(point);
// 设置中心坐标
}
var tips = userid + "，" + sign_time + "，" + address;
addMarker(point, map, tips);
points.push(point);
}
var polyline = new BMap.Polyline(points);
map.addOverlay(polyline);
}
//编写自定义函数,创建标注
function addMarker(point, map, tips)
{
var marker = new BMap.Marker(point);
map.addOverlay(marker);
//为标注添加文字信息
var label = new BMap.Label(tips,{offset:new BMap.Size(20,-10)});
marker.setLabel(label);
}
</script>
百度地图足迹demo（多点轨迹生成）的更多相关文章
- 实现百度地图导航Demo的语音播报功能
上文中实现了在本地导入百度地图导航Demo,那么在此基础上如何实现导航的语音播报呢? 一.为该应用申请语音播报(也叫注册) http://developer.baidu.com/map/index.p ...
- 百度地图的demo提示key验证错误！错误码：230;
在已经有BaiduMap的APIKey后使用AndroidStudio导入Baidu地图的as版的demo,提示key验证错误!错误码:230; 首先,因为百度地图demo中用自己的keystore文 ...
- baidumap 百度地图，实现多点之间的带方向路线图。
通过lastVisitAt判断时间先后. 通过三角函数验证角度 再由baidumap 会制线段 绘制三角箭头 比较难看…… 测试个人 因为框架引用baidu 有各种问题失败,为最快实现,以此页作一个独 ...
- javascript 百度地图API - demo
<!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...
- 百度地图自定义Marker
最近写了百度地图的Demo,所以总结下遇到的问题: 1.首先在百度地图中创建应用时用到 发布版SHA1是在Preferences下的Android下的Build中;2.在使用百度地图时,先要创建一个A ...
- 通过百度地图API显示当前位置在地图上（图标显示）--第三方开源--百度地图（二）
1.下载百度地图的demo,下载地址:http://lbsyun.baidu.com/sdk/download?selected=mapsdk_basicmap,mapsdk_searchfuncti ...
- 在Fragment中实现百度地图，定位到当前位置（基于SDKv2.1.0）
使用最新版本的百度地图需要注意的几个地方: 1.libs文件夹下要有android-support-v4.jar.baidumapapi_v2_1_0.jar.locSDK_3.1.jar三个jar包 ...
- [android] 百度地图开发 (两).所在地的城市定位和城市POI搜索
一个. 百度地图城市位置和POI搜索知识 上一篇文章"百度地图开发(一)"中讲述了怎样申请百度APIKey及解决显示空白网格的问题.该篇文章主要讲述怎样定位城市位置.定 ...
- 【Android】策略模式封装百度地图路线规划模块
百度地图的Demo里有个路线规划的功能,但是,这个功能和Activity耦合性太高,所以需要单独抽离出路径规划功能,进行"解耦". 注:由于项目原因,本文只针对驾车路线规划进行封装 ...
随机推荐
- decay
decay - 必应词典 美[dɪ'keɪ]英[dɪ'keɪ] v.衰减:腐朽:衰败 n.腐烂:衰退:腐朽 网络衰变:腐败 变形过去分词:decayed:现在分词:decaying:第三人称单数:de ...
- 游戏引擎架构，3d游戏引擎设计、Unreal引擎技术等五本PDF推荐
扫码时备注或说明中留下邮箱 付款后如未回复请至https://shop135452397.taobao.com/ 联系店主
- 干净的ssm框架项目
其中数据库只有如下表与字段 访问效果: 项目下载: 干净的ssm框架项目.rar
- 理解HTTP之keep-alive（转）
理解HTTP之keep-alive 在前面一篇文章中讲了TCP的keepalive,这篇文章再讲讲HTTP层面keep-alive.两种keepalive在拼写上面就是不一样的,只是发音一样,于是乎大 ...
- Mac git 终端使用
终端有这个提示,这个按照命令 输入你的 git账号和邮箱就可以, 不然一直出这个提示 Your name and email address were configured automatically ...
- Volley超时重试机制
基础用法 Volley为开发者提供了可配置的超时重试机制,我们在使用时只需要为我们的Request设置自定义的RetryPolicy即可. 参考设置代码如下: int DEFAULT_TIMEOUT_ ...
- SideBar 选择城市时右侧边上的 选择bar
需要定义一个SideBar的视图类 在布局文件中引用 同时在布局中设置一个textView默认不可见 当触摸时才显示 在调用的Activity中 sideBar.setOnTouchingL ...
- springmvc中的拦截器interceptor用法
1.配置拦截器 在springMVC.xml配置文件增加: 1 <mvc:interceptors> 2 <!-- 日志拦截器 --> 3 <mvc:intercepto ...
- js 正则表达式：密码必须由6-12位数字加字母组成
^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$
- 百度 echarts
插件地址:http://echarts.baidu.com/index.html ECharts 特性 特性 丰富的可视化类型 多种数据格式无需转换直接使用 千万数据的前端展现 移动端优化 多渲染方案 ...