1、引入播放插件类
https://download.csdn.net/download/qq_48795482/90437319
2、添加图层
drawRouteLine(resData, layerType) {console.log("调用了轨迹线函数", resData);var jsondata = {type: "FeatureCollection",features: [],};var linejsondata = {type: "FeatureCollection",features: [{type: "Feature",geometry: { type: "LineString", coordinates: [] },properties: { num: 0 },},],};resData.forEach((item, index) => {if (item.longtitude == "" || item.latitude == "") {return true;}// var wgs84Coords = this.LayerManager.getWGS84Position(item.longtitude, item.latitude);jsondata.features.push({type: "Feature",geometry: {type: "Point",coordinates: [item.longtitude, item.latitude],},properties: {no: index,X: item.longitude,Y: item.latitude,REPORTTIME: item.positionTimeFormat,},});linejsondata.features[0].geometry.coordinates.push([item.longitude,item.latitude,]);linejsondata.features[0].properties.num = index;});// let source = {// data: linejsondata// }// var layerOption = {// 'line-color': 'rgb(255,165,0)',// 'line-width': 5// }// window.LayerManager.addGeoJsonLayer(window.lyrPrefix + 'inspectroute', source, layerOption)var imgUrl = require("@/assets/banxian_route.png");var sImgUrl = require("@/assets/start.png");var eImgUrl = require("@/assets/end.png");this.routeReplay = new RouteReplay(this.map,linejsondata,imgUrl,sImgUrl,eImgUrl,2,jsondata);}3、调用实例的start开始进行动画播放
this.routeReplay.start();详细操作可下载上方的插件类资源，进行代码的修改。
ps:
1、插件参数解析：
- this.map,地图实例
- linejsondata,轨迹线图层geojson格式数据
- imgUrl,播放动画图标
- sImgUrl,起点图标
- eImgUrl,终点图标
- 2,无所谓
- jsondata，轨迹点位图层geojson格式数据，用于构建小车完整轨迹点（对应插件里的变量_newRouteGeoJson,最终构建小车实时点位图层数据_animatePointGeoJson，里面就一个实时点）
