OpenLayers 3 实现轨迹回放
function PathBack() {
var PVLayer = new ol.layer.Vector({
source: new ol.source.Vector({})
});
var pointList = new Array();
map.addLayer(PVLayer);
$.ajax({
type: "get",
url: "images/zb.json",
async: false,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
var obj = data.T_Project;
for (var i = 0; i < obj.length; i++) {
var pointFeature = new ol.Feature({
geometry: new ol.geom.Point(ol.proj.transform([parseFloat(obj[i].x), parseFloat(obj[i].y)], 'EPSG:4326', 'EPSG:3857'))
})
var propertieList = new Array();
// propertieList.push(obj[i].ID, obj[i].x, obj[i].y, obj[i].Note);
propertieList.push(obj[i].ID, obj[i].x, obj[i].y);
pointFeature.setProperties(propertieList);
if (pointFeature != null) {
pointList.push(pointFeature);
}
}
var stoptime = setInterval(function () {
if (j + 1 <= pointList.length) {
if (j > 0) {
var twoCoordinatePoint = new Array();
var coordinateFirst = pointList[j - 1].getGeometry().getCoordinates();
var coordinateSecond = pointList[j].getGeometry().getCoordinates();
twoCoordinatePoint.push(coordinateFirst);
twoCoordinatePoint.push(coordinateSecond);
var lineString = new ol.geom.LineString(twoCoordinatePoint);
var lineFeature = new ol.Feature({
geometry: lineString
});
PVLayer.getSource().addFeature(lineFeature);
pointList[j - 1].setStyle(null);
}
pointList[j].setStyle(iconstyle);
PVLayer.getSource().addFeature(pointList[j]);
}
else {
clearInterval(stoptime);
}
j++;
}, 300);
},
error: function (result) {
}
});
}
OpenLayers 3 实现轨迹回放的更多相关文章
- OpenLayers3的轨迹回放
OpenLayers3实现轨迹回放需要动画操作,官网上的例子用的是postcompose,但是还可以使用javascript中setInterval和setTime. 我的例子是按官网上来的http: ...
- 物联网应用中实时定位与轨迹回放的解决方案 – Redis的典型运用(转载)
物联网应用中实时定位与轨迹回放的解决方案 – Redis的典型运用(转载) 2015年11月14日| by: nbboy| Category: 系统设计, 缓存设计, 高性能系统 摘要 ...
- 如何实现LBS轨迹回放功能?含多平台实现代码
本篇文章告诉您,如何实现轨迹回放.并且提供了web端,iOS端,Android端3个平台的轨迹回放代码.拷贝后可以直接使用.另外,文末有小彩蛋,算是开发者的福利. Web端/JavaScript 实现 ...
- Google地图轨迹回放模拟
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- SVG轨迹回放实践
最近做了埋点方案XTracker的轨迹回放功能,大致效果就是,在指定几个顺序的点之间形成轨迹,来模拟用户在页面上的先后行为(比如一个用户先点了啥,后点了啥).效果图如下: 在这篇文章中,我们来聊聊轨迹 ...
- 如何使用JS来开发室内三维地图的轨迹回放功能
在制作完成室内三维地图的功能后,最经常有的需求就是如何做人员的轨迹回放,一般流程都是从数据库中查询轨迹坐标后,经过后台查询接口返回给前端,接下来的事情都交给JS来完成. 如果想做好一个性能好的轨迹回 ...
- GPS/轨迹追踪、轨迹回放、围栏控制
折腾一个多月终于弄完了这个项目,起初都未曾接触GPS/轨迹追踪.轨迹回放.圈划围栏...等一些在百度地图或者Googel地图操作的一些业务,后端的业务相对来说简单点 cas单点登录,mongdb灵活的 ...
- 使用GMap.NET类库,实现地图轨迹回放。(WPF版)
前言 实现轨迹回放,GMap.NET有对应的类GMapRoute.这个类函数很少,功能有限,只能实现简单的轨迹回放.要实现更复杂的轨迹回放,就需要自己动手了. 本文介绍一种方法,可以实现复杂的轨迹回放 ...
- 使用百度地图API实现轨迹回放
调用百度地图API实现路线的轨迹回放功能其实很简单,只要搞懂以下几点即可: 1.需要用Polyline方法先绘制好路线图 2.用Marker添加标注点 3.关键一步,通过结合定时器,使用Marker创 ...
随机推荐
- react.js学习之路三
学习react.js,知识点整理: 1.props和state: props是相对于父级来说,固定的不会改变的内容.一般会先定义一个变量,则在父级中进行引用, var user = "liu ...
- Java bean与Spring、Spring MVC关系
Java Bean Java语言欠缺属性.事件.多重继承功能.所以,如果要在Java程序中实现一些面向对象编程的常见需求,只能手写大量胶水代码.Java Bean正是编写这套胶水代码的惯用模式或约定. ...
- loj#6436. 「PKUSC2018」神仙的游戏(NTT)
题面 传送门 题解 一旦字符串踏上了通配符的不归路,它就永远脱离了温暖的字符串大家庭的怀抱 用人话说就是和通配符扯上关系的字符串就不是个正常的字符串了比如说这个 让我们仔细想想,如果一个长度为\(le ...
- [原创]ObjectARX开发环境搭建之VS2010+ObjectARX2012Wizard+Addin工具条问题修复
目前ObjectARX版本越来越高,也越来越简化开发,如果需要同时开发低版本和高版本的ARX程序,就需要搭建批量编译环境,以满足ARX开发的需要. 批量编译的搭建网络上已经有了很多的教程,基本上都是基 ...
- lamp centos下一键安装
系统需求 系统支持:CentOS 6+/Debian 7+/Ubuntu 12+ 内存要求:≥ 512MB 硬盘要求:至少 5GB 以上的剩余空间 服务器必须配置好 软件源 和 可连接外网 必须具有系 ...
- SpringMVC中静态文件的引用
1.在WebRoot目录下创建 resources文件,里面可以放入css文件 2.在SpringMVC中的配置文件dispatcherServlet-servlet.xml中加入 <!-- 将 ...
- javascript中类数组转成真正的数组
function list() { return Array.prototype.slice.call(arguments); } var list1 = list(1, 2, 3); // [1, ...
- 浅谈PHP的Public、Protected、Private三种方法的区别
public:权限是最大的,可以内部调用,实例调用等.protected: 受保护类型,用于本类和继承类调用.private: 私有类型,只有在本类中使用. <?php error_report ...
- js 任意元素解绑任意事件的兼容代码
hmtl代码: <input type="button" value="按钮" id="btn"/> <input typ ...
- Ubuntu上使用systemd创建服务文件来启动和监视底层网络应用程序实现守护进程
在Linux上使用Nginx设置ASP.NET Core的托管环境,并部署到它 创建服务文件 创建服务定义文件: sudo vim /etc/systemd/system/kestrel-basic. ...