krabouilleur opened a new issue, #18238: URL: https://github.com/apache/echarts/issues/18238
### What problem does this feature solve? Hi, on serie type "line**S**" (not line but **lines**), where "polyline" is true, - I've data array - each element of the array represent a segment of the polyline - I want to show an icon which "walks" on the line like this : https://echarts.apache.org/examples/en/editor.html?c=geo-svg-lines but, this example is not my case because the generated line in this example was built is the same data object. data: ``` [ { coords: [ [1, 2], [3, 4] [5, 6], [7, 8] ] } ] ``` In my case the line is generated by multiple segment of data (for many reasons) ``` [ { coords: [ [1, 2], [3, 4] ] }, { coords: [ [5, 6], [7, 8] ] } ] ``` Real example: ``` $.get( ROOT_PATH + '/data/asset/geo/MacOdrum-LV5-floorplan-web.svg', function (svg) { echarts.registerMap('MacOdrum-LV5-floorplan-web', { svg: svg }); option = { title: { text: 'Visit Route', left: 'center', bottom: 10 }, tooltip: {}, geo: { map: 'MacOdrum-LV5-floorplan-web', roam: true, emphasis: { itemStyle: { color: undefined }, label: { show: false } } }, series: [ { name: 'Route', type: 'lines', coordinateSystem: 'geo', geoIndex: 0, emphasis: { label: { show: false } }, polyline: true, lineStyle: { color: '#c46e54', width: 5, opacity: 1, type: 'dotted' }, effect: { show: true, loop: false, period: 3, color: '#a10000', trailLength: 0, symbolSize: [20, 12], delay: function (index, count) { return index * 3000 ; }, symbol: 'path://M35.5 40.5c0-22.16 17.84-40 40-40s40 17.84 40 40c0 1.6939-.1042 3.3626-.3067 5H35.8067c-.2025-1.6374-.3067-3.3061-.3067-5zm90.9621-2.6663c-.62-1.4856-.9621-3.1182-.9621-4.8337 0-6.925 5.575-12.5 12.5-12.5s12.5 5.575 12.5 12.5a12.685 12.685 0 0 1-.1529 1.9691l.9537.5506-15.6454 27.0986-.1554-.0897V65.5h-28.7285c-7.318 9.1548-18.587 15-31.2715 15s-23.9535-5.8452-31.2715-15H15.5v-2.8059l-.0937.0437-8.8727-19.0274C2.912 41.5258.5 37.5549.5 33c0-6.925 5.575-12.5 12.5-12.5S25.5 26.075 25.5 33c0 .9035-.0949 1.784-.2753 2.6321L29.8262 45.5h92.2098z' }, data: [ { coords: [ [110.6189462165178, 456.64349563895087], [124.10988522879458, 450.8570048730469], [123.9272226116071, 389.9520693708147], [61.58708083147317, 386.87942320312504] ] }, { coords: [ [61.58708083147317, 72.8954315876116], [258.29514854771196, 72.8954315876116], [260.75457021484374, 336.8559607533482], [280.5277985253906, 410.2406672084263] ] }, { coords: [ [275.948185765904, 528.0254369698661], [111.06907909458701, 552.795792593471], [118.87138231445309, 701.365737015904], [221.36468155133926, 758.7870354617745] ] }, { coords: [ [307.86195445452006, 742.164737297712], [366.8489324762834, 560.9895157073103], [492.8750778390066, 560.9895157073103], [492.8750778390066, 827.9639780566406] ] }, { coords: [ [294.9255269587053, 827.9639780566406], [282.79803391043527, 868.2476088113839] ] } ] } ] }; myChart.setOption(option); } ); ``` In this example: - I can't use the "delay" on "effect" because the "icon" walks no at the same speed if a segment as a different length. - multiple icons are showed The feature I would want: the effect should have a property to have a unique icon which walks on the line on each segment of data ### What does the proposed API look like? **constantSpeedSegment**: ``` series: [ { type: 'lines', polyline: true, effect: { show: true, symbol: '....', constantSpeedSegment: 8, }, data: [ { coords: [ [ 0, 10], [10, 20] ] }, { coords: [ [10, 20], [20, 30] ] }, ] } ] ``` -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
