LIHAO520 commented on issue #9044: 这个loop实现真的奇怪，搞了好几天了，还是有问题，例如在使用setOption更新图数据时，加入数据前后相同，这种实现effect居然不会重绘，就算数据不完全相同，那些相同的数据也不会重绘，个人认为在刷新数据之后，即使数据相同，effect配置一样，也应该重绘吧。谁能解答这个问题，用了最新的版本了，里面设置了loop，但还是没有解决，二次加载数据的时候还是不会重绘，希望再这里得到各位的帮助！！！ URL: https://github.com/apache/incubator-echarts/issues/9044#issuecomment-419833932 // setInterval("bigdata.mapAjax()",3000); 这里定时调用这个函数 mapAjax: function () { $.ajax({ url: "" + urls + "bigData/scooter/queryTrack?cityCode="+city+"", success: function (data) { var busLines=data.result; var data=busLines.map(function(v){ return v.points; }) var hStep = 300 / (data.length - 1); // var max=[]; var busLines = [].concat.apply([], data.map(function (busLine, idx) { var prevPt; var points = []; for (var i = 0; i < busLine.length; i += 2) { // busLine[i] 所展示的是每一辆车的经纬度 var pt = [busLine[i], busLine[i + 1]]; // pt 是一个经纬度的数组 就是把这辆车每移动的一个经纬度添加为一个数组 if (i > 0 && i < busLine.length) { pt = [ prevPt[0] + pt[0], prevPt[1] + pt[1] ]; } prevPt = pt; points.push([pt[0] / 1e4, pt[1] / 1e4]); var pre=[prevPt[0]/ 1e4,prevPt[1]/ 1e4]; var po=points[points.length-1]; if(pre[0]==po[0] && pre[1]==po[1]){ } } // max.push(points); return { coords: points, lineStyle: { normal: { color: echarts.color.modifyHSL('#5A94DF', Math.round(hStep * idx)) } } }; })); // var zd=Math.max(...max.map(v=>v.length)); // var newData=max.map(v=>(v.splice(v.length,0,...new Array(zd-v.length).fill(v[v.length-1])),v)); var jwds=[]; var ds=busLines.forEach(function(v) { var obj={ jd:v.coords[0][0], wd:v.coords[0][1], } jwds.push(obj); }) if(btnFirst){ position={ x: jwds[0].jd, y: jwds[0].wd } btnFirst=false; } option={ bmap: { // center: [position.x,position.y], // zoom:17, roam: true, mapStyle: { 'styleJson': [{ 'featureType': 'water', 'elementType': 'all', 'stylers': { 'color': '#031628' } }, { 'featureType': 'land', 'elementType': 'geometry', 'stylers': { 'color': '#000102' } }, { 'featureType': 'highway', 'elementType': 'all', 'stylers': { 'visibility': 'off' } }, { 'featureType': 'arterial', 'elementType': 'geometry.fill', 'stylers': { 'color': '#000000' } }, { 'featureType': 'arterial', 'elementType': 'geometry.stroke', 'stylers': { 'color': '#0b3d51' } }, { 'featureType': 'local', 'elementType': 'geometry', 'stylers': { 'color': '#000000' } }, { 'featureType': 'railway', 'elementType': 'geometry.fill', 'stylers': { 'color': '#000000' } }, { 'featureType': 'railway', 'elementType': 'geometry.stroke', 'stylers': { 'color': '#08304b' } }, { 'featureType': 'subway', 'elementType': 'geometry', 'stylers': { 'lightness': -70 } }, { 'featureType': 'building', 'elementType': 'geometry.fill', 'stylers': { 'color': '#000000' } }, { 'featureType': 'all', 'elementType': 'labels.text.fill', 'stylers': { 'color': '#857f7f' } }, { 'featureType': 'all', 'elementType': 'labels.text.stroke', 'stylers': { 'color': '#000000' } }, { 'featureType': 'building', 'elementType': 'geometry', 'stylers': { 'color': '#022338' } }, { 'featureType': 'green', 'elementType': 'geometry', 'stylers': { 'color': '#062032' } }, { 'featureType': 'boundary', 'elementType': 'all', 'stylers': { 'color': '#465b6c' } }, { 'featureType': 'manmade', 'elementType': 'all', 'stylers': { 'color': '#022338' } }, { 'featureType': 'label', 'elementType': 'all', 'stylers': { 'visibility': 'off' } } ] } }, series: [{ type: 'lines', coordinateSystem: 'bmap', polyline: true, data: [], silent: true, lineStyle: { normal: { // color: '#c23531', // color: 'rgb(200, 35, 45)', opacity: 0.2, width: 1 } }, progressiveThreshold: 500, //启用渐进式渲染的图形数量阈值，在单个系列的图形数量超过该阈值时启用渐进式渲染。 progressive: 200 //渐进式渲染 }, { type: 'lines', coordinateSystem: 'bmap', polyline: true, data: busLines, lineStyle: { normal: { width: 0 } }, effect: { //线特效的配置 constantSpeed: 5, //是否是固定速度 period:5,//特效动画的时间 show: true, // loop: false, //是否循环特效 trailLength: 0.6, //特效尾际的长度 symbolSize: 1.5 //特效的大小 }, animation: true, zlevel: 1 }] }; // console.log(option.series[1].effect.loop); if(centerFirst){ option.bmap.center=[position.x,position.y] option.bmap.zoom=15 centerFirst=false; } mapEcharts.setOption(option); } }) } @gangyahaidao 这个就是实例代码 麻烦了
---------------------------------------------------------------- This is an automated message from the Apache Git Service. To respond to the message, please log on GitHub and use the URL above to go to the specific comment. For queries about this service, please contact Infrastructure at: [email protected] With regards, Apache Git Services --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
