echarts 4.5.0 → 4.9.0

package/lib/chart/radar/RadarView.js

@@ -70,12 +70,14 @@ var _default = echarts.extendChartView({
 
       var symbolSize = normalizeSymbolSize(data.getItemVisual(idx, 'symbolSize'));
       var symbolPath = symbolUtil.createSymbol(symbolType, -1, -1, 2, 2, color);
+      var symbolRotate = data.getItemVisual(idx, 'symbolRotate') || 0;
       symbolPath.attr({
         style: {
           strokeNoScale: true
         },
         z2: 100,
-        scale: [symbolSize[0] / 2, symbolSize[1] / 2]
+        scale: [symbolSize[0] / 2, symbolSize[1] / 2],
+        rotation: symbolRotate * Math.PI / 180 || 0
       });
       return symbolPath;
     }

package/lib/chart/sankey/SankeySeries.js

@@ -160,6 +160,18 @@ var SankeySeries = SeriesModel.extend({
       option.focusNodeAdjacency = 'allEdges';
     }
   },
+  // Override Series.getDataParams()
+  getDataParams: function (dataIndex, dataType) {
+    var params = SankeySeries.superCall(this, 'getDataParams', dataIndex, dataType);
+
+    if (params.value == null && dataType === 'node') {
+      var node = this.getGraph().getNodeByIndex(dataIndex);
+      var nodeValue = node.getLayout().value;
+      params.value = nodeValue;
+    }
+
+    return params;
+  },
   defaultOption: {
     zlevel: 0,
     z: 2,
@@ -205,7 +217,7 @@ var SankeySeries = SeriesModel.extend({
         show: true
       },
       lineStyle: {
-        opacity: 0.6
+        opacity: 0.5
       }
     },
     animationEasing: 'linear',

package/lib/chart/sankey/SankeyView.js

@@ -43,7 +43,9 @@ var zrUtil = require("zrender/lib/core/util");
 * under the License.
 */
 var nodeOpacityPath = ['itemStyle', 'opacity'];
+var hoverNodeOpacityPath = ['emphasis', 'itemStyle', 'opacity'];
 var lineOpacityPath = ['lineStyle', 'opacity'];
+var hoverLineOpacityPath = ['emphasis', 'lineStyle', 'opacity'];
 
 function getItemOpacity(item, opacityPath) {
   return item.getVisual('opacity') || item.getModel().get(opacityPath);
@@ -69,12 +71,13 @@ function fadeOutItem(item, opacityPath, opacityRatio) {
 function fadeInItem(item, opacityPath) {
   var opacity = getItemOpacity(item, opacityPath);
   var el = item.getGraphicEl();
-  el.highlight && el.highlight();
   el.traverse(function (child) {
     if (child.type !== 'group') {
       child.setStyle('opacity', opacity);
     }
-  });
+  }); // Support emphasis here.
+
+  el.highlight && el.highlight();
 }
 
 var SankeyShape = graphic.extendShape({
@@ -104,6 +107,12 @@ var SankeyShape = graphic.extendShape({
     }
 
     ctx.closePath();
+  },
+  highlight: function () {
+    this.trigger('emphasis');
+  },
+  downplay: function () {
+    this.trigger('normal');
   }
 });
 
@@ -266,9 +275,22 @@ var _default = echarts.extendChartView({
         el.cursor = 'move';
       }
 
+      el.highlight = function () {
+        this.trigger('emphasis');
+      };
+
+      el.downplay = function () {
+        this.trigger('normal');
+      };
+
+      el.focusNodeAdjHandler && el.off('mouseover', el.focusNodeAdjHandler);
+      el.unfocusNodeAdjHandler && el.off('mouseout', el.unfocusNodeAdjHandler);
+
       if (itemModel.get('focusNodeAdjacency')) {
-        el.off('mouseover').on('mouseover', function () {
+        el.on('mouseover', el.focusNodeAdjHandler = function () {
           if (!sankeyView._focusAdjacencyDisabled) {
+            sankeyView._clearTimer();
+
             api.dispatchAction({
               type: 'focusNodeAdjacency',
               seriesId: seriesModel.id,
@@ -276,22 +298,23 @@ var _default = echarts.extendChartView({
             });
           }
         });
-        el.off('mouseout').on('mouseout', function () {
+        el.on('mouseout', el.unfocusNodeAdjHandler = function () {
           if (!sankeyView._focusAdjacencyDisabled) {
-            api.dispatchAction({
-              type: 'unfocusNodeAdjacency',
-              seriesId: seriesModel.id
-            });
+            sankeyView._dispatchUnfocus(api);
           }
         });
       }
     });
     edgeData.eachItemGraphicEl(function (el, dataIndex) {
       var edgeModel = edgeData.getItemModel(dataIndex);
+      el.focusNodeAdjHandler && el.off('mouseover', el.focusNodeAdjHandler);
+      el.unfocusNodeAdjHandler && el.off('mouseout', el.unfocusNodeAdjHandler);
 
       if (edgeModel.get('focusNodeAdjacency')) {
-        el.off('mouseover').on('mouseover', function () {
+        el.on('mouseover', el.focusNodeAdjHandler = function () {
           if (!sankeyView._focusAdjacencyDisabled) {
+            sankeyView._clearTimer();
+
             api.dispatchAction({
               type: 'focusNodeAdjacency',
               seriesId: seriesModel.id,
@@ -299,12 +322,9 @@ var _default = echarts.extendChartView({
             });
           }
         });
-        el.off('mouseout').on('mouseout', function () {
+        el.on('mouseout', el.unfocusNodeAdjHandler = function () {
           if (!sankeyView._focusAdjacencyDisabled) {
-            api.dispatchAction({
-              type: 'unfocusNodeAdjacency',
-              seriesId: seriesModel.id
-            });
+            sankeyView._dispatchUnfocus(api);
           }
         });
       }
@@ -318,10 +338,30 @@ var _default = echarts.extendChartView({
 
     this._data = seriesModel.getData();
   },
-  dispose: function () {},
-  focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
-    var data = this._model.getData();
+  dispose: function () {
+    this._clearTimer();
+  },
+  _dispatchUnfocus: function (api) {
+    var self = this;
 
+    this._clearTimer();
+
+    this._unfocusDelayTimer = setTimeout(function () {
+      self._unfocusDelayTimer = null;
+      api.dispatchAction({
+        type: 'unfocusNodeAdjacency',
+        seriesId: self._model.id
+      });
+    }, 500);
+  },
+  _clearTimer: function () {
+    if (this._unfocusDelayTimer) {
+      clearTimeout(this._unfocusDelayTimer);
+      this._unfocusDelayTimer = null;
+    }
+  },
+  focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
+    var data = seriesModel.getData();
     var graph = data.graph;
     var dataIndex = payload.dataIndex;
     var itemModel = data.getItemModel(dataIndex);
@@ -341,7 +381,7 @@ var _default = echarts.extendChartView({
     });
 
     if (node) {
-      fadeInItem(node, nodeOpacityPath);
+      fadeInItem(node, hoverNodeOpacityPath);
       var focusNodeAdj = itemModel.get('focusNodeAdjacency');
 
       if (focusNodeAdj === 'outEdges') {
@@ -350,8 +390,8 @@ var _default = echarts.extendChartView({
             return;
           }
 
-          fadeInItem(edge, lineOpacityPath);
-          fadeInItem(edge.node2, nodeOpacityPath);
+          fadeInItem(edge, hoverLineOpacityPath);
+          fadeInItem(edge.node2, hoverNodeOpacityPath);
         });
       } else if (focusNodeAdj === 'inEdges') {
         zrUtil.each(node.inEdges, function (edge) {
@@ -359,8 +399,8 @@ var _default = echarts.extendChartView({
             return;
           }
 
-          fadeInItem(edge, lineOpacityPath);
-          fadeInItem(edge.node1, nodeOpacityPath);
+          fadeInItem(edge, hoverLineOpacityPath);
+          fadeInItem(edge.node1, hoverNodeOpacityPath);
         });
       } else if (focusNodeAdj === 'allEdges') {
         zrUtil.each(node.edges, function (edge) {
@@ -368,22 +408,21 @@ var _default = echarts.extendChartView({
             return;
           }
 
-          fadeInItem(edge, lineOpacityPath);
-          fadeInItem(edge.node1, nodeOpacityPath);
-          fadeInItem(edge.node2, nodeOpacityPath);
+          fadeInItem(edge, hoverLineOpacityPath);
+          edge.node1 !== node && fadeInItem(edge.node1, hoverNodeOpacityPath);
+          edge.node2 !== node && fadeInItem(edge.node2, hoverNodeOpacityPath);
         });
       }
     }
 
     if (edge) {
-      fadeInItem(edge, lineOpacityPath);
-      fadeInItem(edge.node1, nodeOpacityPath);
-      fadeInItem(edge.node2, nodeOpacityPath);
+      fadeInItem(edge, hoverLineOpacityPath);
+      fadeInItem(edge.node1, hoverNodeOpacityPath);
+      fadeInItem(edge.node2, hoverNodeOpacityPath);
     }
   },
   unfocusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
-    var graph = this._model.getGraph();
-
+    var graph = seriesModel.getGraph();
     graph.eachNode(function (node) {
       fadeOutItem(node, nodeOpacityPath);
     });
@@ -405,8 +444,7 @@ function createGridClipShape(rect, seriesModel, cb) {
   });
   graphic.initProps(rectEl, {
     shape: {
-      width: rect.width + 20,
-      height: rect.height + 20
+      width: rect.width + 20
     }
   }, seriesModel, cb);
   return rectEl;

package/lib/chart/sankey/sankeyLayout.js

@@ -97,7 +97,8 @@ function computeNodeValues(nodes) {
   zrUtil.each(nodes, function (node) {
     var value1 = sum(node.outEdges, getEdgeValue);
     var value2 = sum(node.inEdges, getEdgeValue);
-    var value = Math.max(value1, value2);
+    var nodeRawValue = node.getValue() || 0;
+    var value = Math.max(value1, value2, nodeRawValue);
     node.setLayout({
       value: value
     }, true);
@@ -456,6 +457,11 @@ function relaxRightToLeft(nodesByBreadth, alpha, orient) {
       if (node.outEdges.length) {
         var y = sum(node.outEdges, weightedTarget, orient) / sum(node.outEdges, getEdgeValue, orient);
 
+        if (isNaN(y)) {
+          var len = node.outEdges.length;
+          y = len ? sum(node.outEdges, centerTarget, orient) / len : 0;
+        }
+
         if (orient === 'vertical') {
           var nodeX = node.getLayout().x + (y - center(node, orient)) * alpha;
           node.setLayout({
@@ -476,10 +482,18 @@ function weightedTarget(edge, orient) {
   return center(edge.node2, orient) * edge.getValue();
 }
 
+function centerTarget(edge, orient) {
+  return center(edge.node2, orient);
+}
+
 function weightedSource(edge, orient) {
   return center(edge.node1, orient) * edge.getValue();
 }
 
+function centerSource(edge, orient) {
+  return center(edge.node1, orient);
+}
+
 function center(node, orient) {
   return orient === 'vertical' ? node.getLayout().x + node.getLayout().dx / 2 : node.getLayout().y + node.getLayout().dy / 2;
 }
@@ -488,13 +502,13 @@ function getEdgeValue(edge) {
   return edge.getValue();
 }
 
-function sum(array, f, orient) {
+function sum(array, cb, orient) {
   var sum = 0;
   var len = array.length;
   var i = -1;
 
   while (++i < len) {
-    var value = +f.call(array, array[i], orient);
+    var value = +cb.call(array, array[i], orient);
 
     if (!isNaN(value)) {
       sum += value;
@@ -518,6 +532,11 @@ function relaxLeftToRight(nodesByBreadth, alpha, orient) {
       if (node.inEdges.length) {
         var y = sum(node.inEdges, weightedSource, orient) / sum(node.inEdges, getEdgeValue, orient);
 
+        if (isNaN(y)) {
+          var len = node.inEdges.length;
+          y = len ? sum(node.inEdges, centerSource, orient) / len : 0;
+        }
+
         if (orient === 'vertical') {
           var nodeX = node.getLayout().x + (y - center(node, orient)) * alpha;
           node.setLayout({

package/lib/chart/scatter/ScatterSeries.js

@@ -44,7 +44,9 @@ var _default = SeriesModel.extend({
   type: 'series.scatter',
   dependencies: ['grid', 'polar', 'geo', 'singleAxis', 'calendar'],
   getInitialData: function (option, ecModel) {
-    return createListFromArray(this.getSource(), this);
+    return createListFromArray(this.getSource(), this, {
+      useEncodeDefaulter: true
+    });
   },
   brushSelector: 'point',
   getProgressive: function () {

package/lib/chart/sunburst/SunburstPiece.js

@@ -149,6 +149,7 @@ SunburstPieceProto.updateData = function (firstCreate, node, state, seriesModel,
 
   this._seriesModel = seriesModel || this._seriesModel;
   this._ecModel = ecModel || this._ecModel;
+  graphic.setHoverStyle(this);
 };
 
 SunburstPieceProto.onEmphasis = function (highlightPolicy) {
@@ -187,7 +188,10 @@ SunburstPieceProto._updateLabel = function (seriesModel, visualColor, state) {
   var normalModel = itemModel.getModel('label');
   var labelModel = state === 'normal' || state === 'emphasis' ? normalModel : itemModel.getModel(state + '.label');
   var labelHoverModel = itemModel.getModel('emphasis.label');
-  var text = zrUtil.retrieve(seriesModel.getFormattedLabel(this.node.dataIndex, state, null, null, 'label'), this.node.name);
+  var labelFormatter = labelModel.get('formatter'); // Use normal formatter if no state formatter is defined
+
+  var labelState = labelFormatter ? state : 'normal';
+  var text = zrUtil.retrieve(seriesModel.getFormattedLabel(this.node.dataIndex, labelState, null, null, 'label'), this.node.name);
 
   if (getLabelAttr('show') === false) {
     text = '';

package/lib/chart/sunburst/SunburstSeries.js

@@ -24,6 +24,8 @@ var SeriesModel = require("../../model/Series");
 
 var Tree = require("../../data/Tree");
 
+var Model = require("../../model/Model");
+
 var _treeHelper = require("../helper/treeHelper");
 
 var wrapTreePathInfo = _treeHelper.wrapTreePathInfo;
@@ -60,14 +62,24 @@ var _default = SeriesModel.extend({
       children: option.data
     };
     completeTreeValue(root);
-    var levels = option.levels || []; // levels = option.levels = setDefault(levels, ecModel);
-
-    var treeOption = {};
-    treeOption.levels = levels; // Make sure always a new tree is created when setOption,
+    var levelModels = zrUtil.map(option.levels || [], function (levelDefine) {
+      return new Model(levelDefine, this, ecModel);
+    }, this); // Make sure always a new tree is created when setOption,
     // in TreemapView, we check whether oldTree === newTree
     // to choose mappings approach among old shapes and new shapes.
 
-    return Tree.createTree(root, this, treeOption).data;
+    var tree = Tree.createTree(root, this, beforeLink);
+
+    function beforeLink(nodeData) {
+      nodeData.wrapMethod('getItemModel', function (model, idx) {
+        var node = tree.getNodeByDataIndex(idx);
+        var levelModel = levelModels[node.depth];
+        levelModel && (model.parentModel = levelModel);
+        return model;
+      });
+    }
+
+    return tree.data;
   },
   optionUpdated: function () {
     this.resetViewRoot();
@@ -113,8 +125,7 @@ var _default = SeriesModel.extend({
       align: 'center',
       position: 'inside',
       distance: 5,
-      silent: true,
-      emphasis: {}
+      silent: true
     },
     itemStyle: {
       borderWidth: 1,
@@ -124,13 +135,19 @@ var _default = SeriesModel.extend({
       shadowColor: 'rgba(0, 0, 0, 0.2)',
       shadowOffsetX: 0,
       shadowOffsetY: 0,
-      opacity: 1,
-      emphasis: {},
-      highlight: {
+      opacity: 1
+    },
+    highlight: {
+      itemStyle: {
         opacity: 1
+      }
+    },
+    downplay: {
+      itemStyle: {
+        opacity: 0.5
       },
-      downplay: {
-        opacity: 0.9
+      label: {
+        opacity: 0.6
       }
     },
     // Animation type canbe expansion, scale

package/lib/chart/sunburst/SunburstView.js

@@ -26,6 +26,10 @@ var SunburstPiece = require("./SunburstPiece");
 
 var DataDiffer = require("../../data/DataDiffer");
 
+var _format = require("../../util/format");
+
+var windowOpen = _format.windowOpen;
+
 /*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
@@ -193,7 +197,7 @@ var SunburstView = ChartView.extend({
 
             if (link) {
               var linkTarget = itemModel.get('target', true) || '_blank';
-              window.open(link, linkTarget);
+              windowOpen(link, linkTarget);
             }
           }
 

package/lib/chart/themeRiver/ThemeRiverSeries.js

@@ -38,6 +38,8 @@ var _format = require("../../util/format");
 
 var encodeHTML = _format.encodeHTML;
 
+var LegendVisualProvider = require("../../visual/LegendVisualProvider");
+
 /*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
@@ -76,9 +78,7 @@ var ThemeRiverSeries = SeriesModel.extend({
     // Enable legend selection for each data item
     // Use a function instead of direct access because data reference may changed
 
-    this.legendDataProvider = function () {
-      return this.getRawData();
-    };
+    this.legendVisualProvider = new LegendVisualProvider(zrUtil.bind(this.getData, this), zrUtil.bind(this.getRawData, this));
   },
 
   /**
@@ -88,9 +88,22 @@ var ThemeRiverSeries = SeriesModel.extend({
    * @return {Array}
    */
   fixData: function (data) {
-    var rawDataLength = data.length; // grouped data by name
+    var rawDataLength = data.length;
+    /**
+     * Make sure every layer data get the same keys.
+     * The value index tells which layer has visited.
+     * {
+     *  2014/01/01: -1
+     * }
+     */
+
+    var timeValueKeys = {}; // grouped data by name
 
     var groupResult = groupData(data, function (item) {
+      if (!timeValueKeys.hasOwnProperty(item[0])) {
+        timeValueKeys[item[0]] = -1;
+      }
+
       return item[2];
     });
     var layData = [];
@@ -101,40 +114,18 @@ var ThemeRiverSeries = SeriesModel.extend({
       });
     });
     var layerNum = layData.length;
-    var largestLayer = -1;
-    var index = -1;
-
-    for (var i = 0; i < layerNum; ++i) {
-      var len = layData[i].dataList.length;
-
-      if (len > largestLayer) {
-        largestLayer = len;
-        index = i;
-      }
-    }
 
     for (var k = 0; k < layerNum; ++k) {
-      if (k === index) {
-        continue;
-      }
-
       var name = layData[k].name;
 
-      for (var j = 0; j < largestLayer; ++j) {
-        var timeValue = layData[index].dataList[j][0];
-        var length = layData[k].dataList.length;
-        var keyIndex = -1;
-
-        for (var l = 0; l < length; ++l) {
-          var value = layData[k].dataList[l][0];
-
-          if (value === timeValue) {
-            keyIndex = l;
-            break;
-          }
-        }
+      for (var j = 0; j < layData[k].dataList.length; ++j) {
+        var timeValue = layData[k].dataList[j][0];
+        timeValueKeys[timeValue] = k;
+      }
 
-        if (keyIndex === -1) {
+      for (var timeValue in timeValueKeys) {
+        if (timeValueKeys.hasOwnProperty(timeValue) && timeValueKeys[timeValue] !== k) {
+          timeValueKeys[timeValue] = k;
           data[rawDataLength] = [];
           data[rawDataLength][0] = timeValue;
           data[rawDataLength][1] = 0;

package/lib/chart/tree/TreeSeries.js

@@ -26,6 +26,8 @@ var _format = require("../../util/format");
 
 var encodeHTML = _format.encodeHTML;
 
+var Model = require("../../model/Model");
+
 /*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
@@ -63,9 +65,21 @@ var _default = SeriesModel.extend({
       children: option.data
     };
     var leaves = option.leaves || {};
-    var treeOption = {};
-    treeOption.leaves = leaves;
-    var tree = Tree.createTree(root, this, treeOption);
+    var leavesModel = new Model(leaves, this, this.ecModel);
+    var tree = Tree.createTree(root, this, beforeLink);
+
+    function beforeLink(nodeData) {
+      nodeData.wrapMethod('getItemModel', function (model, idx) {
+        var node = tree.getNodeByDataIndex(idx);
+
+        if (!node.children.length || !node.isExpand) {
+          model.parentModel = leavesModel;
+        }
+
+        return model;
+      });
+    }
+
     var treeDepth = 0;
     tree.eachNode('preorder', function (node) {
       if (node.depth > treeDepth) {
@@ -133,6 +147,9 @@ var _default = SeriesModel.extend({
     bottom: '12%',
     // the layout of the tree, two value can be selected, 'orthogonal' or 'radial'
     layout: 'orthogonal',
+    // value can be 'polyline'
+    edgeShape: 'curve',
+    edgeForkPosition: '50%',
     // true | false | 'move' | 'scale', see module:component/helper/RoamController.
     roam: false,
     // Symbol size scale ratio in roam