[GitHub] [incubator-echarts] leaon4 commented on issue #11493: 树图用setOption更新数据时，发现图有残留BUG

[GitBox]

leaon4 commented on issue #11493: 树图用setOption更新数据时，发现图有残留BUG
URL: 
https://github.com/apache/incubator-echarts/issues/11493#issuecomment-546659635
 
 
   js版的代码
   
   > "use strict";
   const container = document.getElementById('mychart');
   const myChart = geta('echarts').init(container);
   function geta(str) {
       return window[str];
   }
   const option = {
       tooltip: {
           trigger: 'item',
           triggerOn: 'mousemove'
       },
       series: [
           {
               type: 'tree',
               // data: [data],
               data: [],
               left: '2%',
               right: '2%',
               top: '8%',
               bottom: '20%',
               symbol: 'emptyCircle',
               orient: 'vertical',
               expandAndCollapse: true,
               lineStyle: {
                   curveness: 0,
               },
               initialTreeDepth: -1,
               // symbolSize:20,
               label: {
                   normal: {
                       position: 'top',
                       align: 'middle',
                       fontSize: 19,
                       color: 'black'
                   }
               },
               leaves: {
                   label: {
                       normal: {
                           position: 'bottom',
                           align: 'middle'
                       }
                   }
               },
               animationDurationUpdate: 750
           }
       ]
   };
   function itemCompare(item1, item2) {
       return item2.num - item1.num;
   }
   class BTree {
       constructor() {
           this.size = 0;
           this.root = null;
       }
       createNode(item) {
           return {
               item,
               left: null,
               right: null
           };
       }
       addItem(item) {
           let newNode = this.createNode(item);
           this.root = this._addItem(this.root, newNode);
           this.size++;
       }
       _addItem(node, newNode) {
           if (!node) {
               return newNode;
           }
           let dir = itemCompare(node.item, newNode.item);
           if (dir < 0) {
               node.left = this._addItem(node.left, newNode);
           }
           else if (dir > 0) {
               node.right = this._addItem(node.right, newNode);
           }
           else {
               console.warn('same item');
               this.size--;
           }
           return node;
       }
       createChartData(node) {
           if (!node) {
               return { name: '' };
           }
           let data = {
               name: node.item.num,
               children: []
           };
           data.children[0] = this.createChartData(node.left);
           data.children[1] = this.createChartData(node.right);
           if (data.children.every(item => item.name === '')) {
               data.children = [];
           }
           return data;
       }
       show() {
           let data = this.createChartData(this.root);
           option.series[0].data = [data];
           myChart.setOption(option);
       }
   }
   class AVLTree extends BTree {
       constructor() {
           super();
       }
       addItem(item) {
           let newNode = this.createNode(item);
           newNode.height = 0;
           this.root = this._addItem(this.root, newNode);
           this.size++;
       }
       createNode(item) {
           let newNode = super.createNode(item);
           newNode.height = 0;
           return newNode;
       }
       _addItem(node, newNode) {
           if (!node) {
               return newNode;
           }
           let dir = itemCompare(node.item, newNode.item);
           if (dir < 0) {
               node.left = this._addItem(node.left, newNode);
               if (this.getNodeHeight(node.left) - 
this.getNodeHeight(node.right) == 2) {
                   if (itemCompare(node.left.item, newNode.item) < 0) {
                       console.log('left single rotation');
                       return this.singleRotate(node, -1);
                   }
                   console.log('left double rotation');
                   return this.doubleRotate(node, -1);
               }
           }
           else if (dir > 0) {
               node.right = this._addItem(node.right, newNode);
               if (this.getNodeHeight(node.left) - 
this.getNodeHeight(node.right) == -2) {
                   if (itemCompare(node.right.item, newNode.item) < 0) {
                       console.log('right double rotation');
                       return this.doubleRotate(node, 1);
                   }
                   console.log('right single rotation');
                   return this.singleRotate(node, 1);
               }
           }
           else {
               console.warn('same item');
               this.size--;
           }
           node.height = Math.max(this.getNodeHeight(node.left), 
this.getNodeHeight(node.right)) + 1;
           return node;
       }
       getNodeHeight(node) {
           if (!node) {
               return -1;
           }
           return node.height;
       }
       singleRotate(parentNode, dir) {
           let childNode;
           if (dir < 0) {
               childNode = parentNode.left;
               parentNode.left = childNode.right;
               childNode.right = parentNode;
           }
           else {
               childNode = parentNode.right;
               parentNode.right = childNode.left;
               childNode.left = parentNode;
           }
           parentNode.height = Math.max(this.getNodeHeight(parentNode.left), 
this.getNodeHeight(parentNode.right)) + 1;
           childNode.height = Math.max(this.getNodeHeight(childNode.left), 
this.getNodeHeight(childNode.right)) + 1;
           return childNode;
       }
       doubleRotate(parentNode, dir) {
           if (dir < 0) {
               parentNode.left = this.singleRotate(parentNode.left, 1);
           }
           else {
               parentNode.right = this.singleRotate(parentNode.right, -1);
           }
           return this.singleRotate(parentNode, dir);
       }
   }
   // 以下为驱动代码
   function addItem(num) {
       tree.addItem({ num });
       tree.show();
   }
   const tree = new AVLTree();
   function* main() {
       let testcase = [3, 2, 1, 4, 5, 6, 7, 16, 15, 14, 13, 12, 11, 10, 8, 9];
       // let testcase = [1, 10, 2, 9, 3, 8, 4, 7, 5, 6];
       for (let num of testcase) {
           addItem(num);
           yield;
       }
   }
   let gen = main();
   function refresh() {
       myChart.clear();
       myChart.setOption(option);
   }
   //# sourceMappingURL=tree.js.map

----------------------------------------------------------------
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.
 
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org
For additional commands, e-mail: commits-h...@echarts.apache.org