zoukankan      html  css  js  c++  java
  • 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) {
    
                }
            });
        }
  • 相关阅读:
    自愿如此 四 内观
    自愿如此· 三 不做解释
    自愿如此·序言
    排序算法 (08.堆排序)
    2.2 ES6 解构赋值
    2.1 ES6 let 与 const
    ES6学习 (01. 内容概况)
    vue 技术栈进阶 (07. ajax 请求实战)
    vue技术栈进阶(06.状态持久化, 严格模式, 数据双向绑定问题)
    vue技术栈进阶(05. mutations, actions)
  • 原文地址:https://www.cnblogs.com/sjfsjf/p/6565638.html
Copyright © 2011-2022 走看看