[GitHub] freebuff commented on issue #5456: 希望`还原toolbox-feature-mark功能, 用来做趋势分析

[GitBox <gi...@apache.org>]

freebuff commented on issue #5456: 希望`还原toolbox-feature-mark功能, 用来做趋势分析
URL: https://github.com/apache/incubator-echarts/issues/5456#issuecomment-389441292
 
 
   var base = +new Date(1968, 9, 3);
   var oneDay = 24 * 3600 * 1000;
   var date = [];
   
   var data = [Math.random() * 300];
   
   for (var i = 1; i < 20000; i++) {
       var now = new Date(base += oneDay);
       date.push([now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'));
       data.push(Math.round((Math.random() - 0.5) * 20 + data[i - 1]));
   }
   
   option = {
       tooltip: {
           trigger: 'axis',
           position: function (pt) {
               return [pt[0], '10%'];
           }
       },
       title: {
           left: 'center',
           text: '大数据量面积图',
       },
       toolbox: {
           feature: {
               
                myTool1: {
                   show: true,
                   title: '自定义扩展方法1',
                   icon: 'path://M432.45,595.444c0,2.177-4.661,6.82-11.305,6.82c-6.475,0-11.306-4.567-11.306-6.82s4.852-6.812,11.306-6.812C427.841,588.632,432.452,593.191,432.45,595.444L432.45,595.444z M421.155,589.876c-3.009,0-5.448,2.495-5.448,5.572s2.439,5.572,5.448,5.572c3.01,0,5.449-2.495,5.449-5.572C426.604,592.371,424.165,589.876,421.155,589.876L421.155,589.876z M421.146,591.891c-1.916,0-3.47,1.589-3.47,3.549c0,1.959,1.554,3.548,3.47,3.548s3.469-1.589,3.469-3.548C424.614,593.479,423.062,591.891,421.146,591.891L421.146,591.891zM421.146,591.891',
                   onclick: function (){
                       
       
       var zr = myChart.getZr();
       
       var Arrow = echarts.graphic.extendShape({
   
           type: 'arrow',
   
           shape: {
               x: 0,
               y: 0,
               width: 0,
               height: 0
           },
   
           buildPath: function (ctx, shape) {
               var height = shape.height;
               var width = shape.width;
               var x = shape.x;
               var y = shape.y;
               var dx = width / 3 * 2;
               ctx.moveTo(x, y);
               ctx.lineTo(x + dx, y + height);
               ctx.lineTo(x, y + height / 4 * 3);
               ctx.lineTo(x - dx, y + height);
               ctx.lineTo(x, y);
               ctx.closePath();
           }
       });
       
       var drawing;
       var points = [];
       var startPoint;
       var traceEl;
       var arrowEl;
       
       zr.on('mousedown', function (e) {
           drawing = true;
           startPoint = [e.offsetX, e.offsetY];
   
           // 如果需要清除箭头，用这个逻辑。
           // if (traceEl) {
           //     zr.remove(traceEl);
           // }
           // if (arrowEl) {
           //     zr.remove(arrowEl);
           // }
           
           traceEl = new echarts.graphic.Line({
               shape: {
                   x1: 0, y1: 0, x2: 0, y2: 0
               },
               style: {
                   stroke: 'red',
                   lineWidth: 1
               }
           });
           arrowEl = new Arrow({
               ignore: true,
               shape: {
                   x: 0, y: 0, width: 10, height: 20
               },
               style: {
                   fill: 'red',
                   stroke: null
               }
           });
           zr.add(traceEl);
           zr.add(arrowEl);
       });
       
       zr.on('mouseup', function (e) {
           drawing = false;
           points.length = 0;
           startPoint = null;
       })
       
       zr.on('mousemove', function (e) {
           if (!drawing) {
               return;
           }
           
           traceEl.attr('shape', {
               x1: startPoint[0],
               y1: startPoint[1],
               x2: e.offsetX,
               y2: e.offsetY
           });
           
           arrowEl.attr({
               ignore: false,
               position: [e.offsetX, e.offsetY],
               rotation: Math.atan(
                   -(startPoint[1] - e.offsetY) / (startPoint[0] - e.offsetX)
               ) 
               + (startPoint[0] > e.offsetX ? 1 : -1) * Math.PI / 2
           })
       })
       
       
   
                   }
               },
           }
       },
       xAxis: {
           type: 'category',
           boundaryGap: false,
           data: date
       },
       yAxis: {
           type: 'value',
           boundaryGap: [0, '100%']
       },
       dataZoom: [{
           type: 'inside',
           start: 0,
           end: 10
       }, {
           start: 0,
           end: 10,
           handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
           handleSize: '80%',
           handleStyle: {
               color: '#fff',
               shadowBlur: 3,
               shadowColor: 'rgba(0, 0, 0, 0.6)',
               shadowOffsetX: 2,
               shadowOffsetY: 2
           }
       }],
       series: [
           {
               name:'模拟数据',
               type:'line',
               smooth:true,
               symbol: 'none',
               sampling: 'average',
               itemStyle: {
                   normal: {
                       color: 'rgb(255, 70, 131)'
                   }
               },
               areaStyle: {
                   normal: {
                       color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                           offset: 0,
                           color: 'rgb(255, 158, 68)'
                       }, {
                           offset: 1,
                           color: 'rgb(255, 70, 131)'
                       }])
                   }
               },
               data: data
           }
       ]
   };
   

----------------------------------------------------------------
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:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@echarts.apache.org
For additional commands, e-mail: dev-help@echarts.apache.org