echarts 4.8.0 → 4.9.0

package/lib/chart/helper/multipleGraphEdgeHelper.js

@@ -0,0 +1,258 @@
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*   http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied.  See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
+var zrUtil = require("zrender/lib/core/util");
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*   http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied.  See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+var KEY_DELIMITER = '-->';
+/**
+ * params handler
+ * @param {module:echarts/model/SeriesModel} seriesModel
+ * @returns {*}
+ */
+
+var getAutoCurvenessParams = function (seriesModel) {
+  return seriesModel.get('autoCurveness') || null;
+};
+/**
+ * Generate a list of edge curvatures, 20 is the default
+ * @param {module:echarts/model/SeriesModel} seriesModel
+ * @param {number} appendLength
+ * @return  20 => [0, -0.2, 0.2, -0.4, 0.4, -0.6, 0.6, -0.8, 0.8, -1, 1, -1.2, 1.2, -1.4, 1.4, -1.6, 1.6, -1.8, 1.8, -2]
+ */
+
+
+var createCurveness = function (seriesModel, appendLength) {
+  var autoCurvenessParmas = getAutoCurvenessParams(seriesModel);
+  var length = 20;
+  var curvenessList = []; // handler the function set
+
+  if (typeof autoCurvenessParmas === 'number') {
+    length = autoCurvenessParmas;
+  } else if (zrUtil.isArray(autoCurvenessParmas)) {
+    seriesModel.__curvenessList = autoCurvenessParmas;
+    return;
+  } // append length
+
+
+  if (appendLength > length) {
+    length = appendLength;
+  } // make sure the length is even
+
+
+  var len = length % 2 ? length + 2 : length + 3;
+  curvenessList = [];
+
+  for (var i = 0; i < len; i++) {
+    curvenessList.push((i % 2 ? i + 1 : i) / 10 * (i % 2 ? -1 : 1));
+  }
+
+  seriesModel.__curvenessList = curvenessList;
+};
+/**
+ * Create different cache key data in the positive and negative directions, in order to set the curvature later
+ * @param {number|string|module:echarts/data/Graph.Node} n1
+ * @param {number|string|module:echarts/data/Graph.Node} n2
+ * @param {module:echarts/model/SeriesModel} seriesModel
+ * @returns {string} key
+ */
+
+
+var getKeyOfEdges = function (n1, n2, seriesModel) {
+  var source = [n1.id, n1.dataIndex].join('.');
+  var target = [n2.id, n2.dataIndex].join('.');
+  return [seriesModel.uid, source, target].join(KEY_DELIMITER);
+};
+/**
+ * get opposite key
+ * @param {string} key
+ * @returns {string}
+ */
+
+
+var getOppositeKey = function (key) {
+  var keys = key.split(KEY_DELIMITER);
+  return [keys[0], keys[2], keys[1]].join(KEY_DELIMITER);
+};
+/**
+ * get edgeMap with key
+ * @param edge
+ * @param {module:echarts/model/SeriesModel} seriesModel
+ */
+
+
+var getEdgeFromMap = function (edge, seriesModel) {
+  var key = getKeyOfEdges(edge.node1, edge.node2, seriesModel);
+  return seriesModel.__edgeMap[key];
+};
+/**
+ * calculate all cases total length
+ * @param edge
+ * @param seriesModel
+ * @returns {number}
+ */
+
+
+var getTotalLengthBetweenNodes = function (edge, seriesModel) {
+  var len = getEdgeMapLengthWithKey(getKeyOfEdges(edge.node1, edge.node2, seriesModel), seriesModel);
+  var lenV = getEdgeMapLengthWithKey(getKeyOfEdges(edge.node2, edge.node1, seriesModel), seriesModel);
+  return len + lenV;
+};
+/**
+ *
+ * @param key
+ */
+
+
+var getEdgeMapLengthWithKey = function (key, seriesModel) {
+  var edgeMap = seriesModel.__edgeMap;
+  return edgeMap[key] ? edgeMap[key].length : 0;
+};
+/**
+ * Count the number of edges between the same two points, used to obtain the curvature table and the parity of the edge
+ * @see /graph/GraphSeries.js@getInitialData
+ * @param {module:echarts/model/SeriesModel} seriesModel
+ */
+
+
+function initCurvenessList(seriesModel) {
+  if (!getAutoCurvenessParams(seriesModel)) {
+    return;
+  }
+
+  seriesModel.__curvenessList = [];
+  seriesModel.__edgeMap = {}; // calc the array of curveness List
+
+  createCurveness(seriesModel);
+}
+/**
+ * set edgeMap with key
+ * @param {number|string|module:echarts/data/Graph.Node} n1
+ * @param {number|string|module:echarts/data/Graph.Node} n2
+ * @param {module:echarts/model/SeriesModel} seriesModel
+ * @param {number} index
+ */
+
+
+function createEdgeMapForCurveness(n1, n2, seriesModel, index) {
+  if (!getAutoCurvenessParams(seriesModel)) {
+    return;
+  }
+
+  var key = getKeyOfEdges(n1, n2, seriesModel);
+  var edgeMap = seriesModel.__edgeMap;
+  var oppositeEdges = edgeMap[getOppositeKey(key)]; // set direction
+
+  if (edgeMap[key] && !oppositeEdges) {
+    edgeMap[key].isForward = true;
+  } else if (oppositeEdges && edgeMap[key]) {
+    oppositeEdges.isForward = true;
+    edgeMap[key].isForward = false;
+  }
+
+  edgeMap[key] = edgeMap[key] || [];
+  edgeMap[key].push(index);
+}
+/**
+ * get curvature for edge
+ * @param edge
+ * @param {module:echarts/model/SeriesModel} seriesModel
+ * @param index
+ */
+
+
+function getCurvenessForEdge(edge, seriesModel, index, needReverse) {
+  var autoCurvenessParams = getAutoCurvenessParams(seriesModel);
+  var isArrayParam = zrUtil.isArray(autoCurvenessParams);
+
+  if (!autoCurvenessParams) {
+    return null;
+  }
+
+  var edgeArray = getEdgeFromMap(edge, seriesModel);
+
+  if (!edgeArray) {
+    return null;
+  }
+
+  var edgeIndex = -1;
+
+  for (var i = 0; i < edgeArray.length; i++) {
+    if (edgeArray[i] === index) {
+      edgeIndex = i;
+      break;
+    }
+  } // if totalLen is Longer createCurveness
+
+
+  var totalLen = getTotalLengthBetweenNodes(edge, seriesModel);
+  createCurveness(seriesModel, totalLen);
+  edge.lineStyle = edge.lineStyle || {}; // if is opposite edge, must set curvenss to opposite number
+
+  var curKey = getKeyOfEdges(edge.node1, edge.node2, seriesModel);
+  var curvenessList = seriesModel.__curvenessList; // if pass array no need parity
+
+  var parityCorrection = isArrayParam ? 0 : totalLen % 2 ? 0 : 1;
+
+  if (!edgeArray.isForward) {
+    // the opposite edge show outside
+    var oppositeKey = getOppositeKey(curKey);
+    var len = getEdgeMapLengthWithKey(oppositeKey, seriesModel);
+    var resValue = curvenessList[edgeIndex + len + parityCorrection]; // isNeedReverse, simple, force type need reverse the curveness in the junction of the forword and the opposite
+
+    if (needReverse) {
+      // set as array may make the parity handle with the len of opposite
+      if (isArrayParam) {
+        if (autoCurvenessParams && autoCurvenessParams[0] === 0) {
+          return (len + parityCorrection) % 2 ? resValue : -resValue;
+        } else {
+          return ((len % 2 ? 0 : 1) + parityCorrection) % 2 ? resValue : -resValue;
+        }
+      } else {
+        return (len + parityCorrection) % 2 ? resValue : -resValue;
+      }
+    } else {
+      return curvenessList[edgeIndex + len + parityCorrection];
+    }
+  } else {
+    return curvenessList[parityCorrection + edgeIndex];
+  }
+}
+
+exports.initCurvenessList = initCurvenessList;
+exports.createEdgeMapForCurveness = createEdgeMapForCurveness;
+exports.getCurvenessForEdge = getCurvenessForEdge;

package/lib/chart/lines/LinesSeries.js

@@ -106,8 +106,6 @@ var LinesSeries = SeriesModel.extend({
     LinesSeries.superApply(this, 'init', arguments);
   },
   mergeOption: function (option) {
-    // The input data may be null/undefined.
-    option.data = option.data || [];
     compatEc2(option);
 
     if (option.data) {

package/lib/chart/map/MapSeries.js

@@ -153,7 +153,7 @@ var MapSeries = SeriesModel.extend({
    *
    * @param {number} dataIndex
    */
-  formatTooltip: function (dataIndex) {
+  formatTooltip: function (dataIndex, multipleSeries, dataType, renderMode) {
     // FIXME orignalData and data is a bit confusing
     var data = this.getData();
     var formattedValue = addCommas(this.getRawValue(dataIndex));
@@ -170,7 +170,8 @@ var MapSeries = SeriesModel.extend({
       }
     }
 
-    return seriesNames.join(', ') + '<br />' + encodeHTML(name + ' : ' + formattedValue);
+    var newLine = renderMode === 'html' ? '<br/>' : '\n';
+    return seriesNames.join(', ') + newLine + encodeHTML(name + ' : ' + formattedValue);
   },
 
   /**

package/lib/chart/radar/RadarSeries.js

@@ -64,15 +64,16 @@ var RadarSeries = SeriesModel.extend({
       generateCoordCount: Infinity
     });
   },
-  formatTooltip: function (dataIndex) {
+  formatTooltip: function (dataIndex, multipleSeries, dataType, renderMode) {
     var data = this.getData();
     var coordSys = this.coordinateSystem;
     var indicatorAxes = coordSys.getIndicatorAxes();
     var name = this.getData().getName(dataIndex);
-    return encodeHTML(name === '' ? this.name : name) + '<br/>' + zrUtil.map(indicatorAxes, function (axis, idx) {
+    var newLine = renderMode === 'html' ? '<br/>' : '\n';
+    return encodeHTML(name === '' ? this.name : name) + newLine + zrUtil.map(indicatorAxes, function (axis, idx) {
       var val = data.get(data.mapDimension(axis.dim), dataIndex);
       return encodeHTML(axis.name + ' : ' + val);
-    }).join('<br />');
+    }).join(newLine);
   },
 
   /**

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/sunburst/SunburstPiece.js

@@ -188,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();

package/lib/chart/themeRiver/ThemeRiverSeries.js

@@ -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

@@ -66,7 +66,7 @@ var _default = SeriesModel.extend({
     };
     var leaves = option.leaves || {};
     var leavesModel = new Model(leaves, this, this.ecModel);
-    var tree = Tree.createTree(root, this, {}, beforeLink);
+    var tree = Tree.createTree(root, this, beforeLink);
 
     function beforeLink(nodeData) {
       nodeData.wrapMethod('getItemModel', function (model, idx) {

package/lib/chart/tree/TreeView.js

@@ -467,9 +467,9 @@ function drawEdge(seriesModel, node, virtualRoot, symbolEl, sourceOldLayout, sou
 
       graphic.updateProps(edge, {
         shape: getEdgeShape(seriesScope, sourceLayout, targetLayout),
-        style: {
+        style: zrUtil.defaults({
           opacity: 1
-        }
+        }, seriesScope.lineStyle)
       }, seriesModel);
     }
   } else if (edgeShape === 'polyline') {
@@ -503,9 +503,9 @@ function drawEdge(seriesModel, node, virtualRoot, symbolEl, sourceOldLayout, sou
             parentPoint: [targetLayout.x, targetLayout.y],
             childPoints: childPoints
           },
-          style: {
+          style: zrUtil.defaults({
             opacity: 1
-          }
+          }, seriesScope.lineStyle)
         }, seriesModel);
       }
     } else {}

package/lib/chart/treemap/TreemapSeries.js

@@ -226,21 +226,30 @@ var _default = SeriesModel.extend({
       children: option.data
     };
     completeTreeValue(root);
-    var levels = option.levels || [];
+    var levels = option.levels || []; // Used in "visual priority" in `treemapVisual.js`.
+    // This way is a little tricky, must satisfy the precondition:
+    //   1. There is no `treeNode.getModel('itemStyle.xxx')` used.
+    //   2. The `Model.prototype.getModel()` will not use any clone-like way.
+
+    var designatedVisualItemStyle = this.designatedVisualItemStyle = {};
+    var designatedVisualModel = new Model({
+      itemStyle: designatedVisualItemStyle
+    }, this, ecModel);
     levels = option.levels = setDefault(levels, ecModel);
     var levelModels = zrUtil.map(levels || [], function (levelDefine) {
-      return new Model(levelDefine, this, ecModel);
+      return new Model(levelDefine, designatedVisualModel, 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.
 
-    var tree = Tree.createTree(root, this, null, beforeLink);
+    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);
+        var levelModel = levelModels[node.depth]; // If no levelModel, we also need `designatedVisualModel`.
+
+        model.parentModel = levelModel || designatedVisualModel;
         return model;
       });
     }

package/lib/chart/treemap/treemapLayout.js

@@ -445,7 +445,7 @@ function position(row, rowFixedLength, rect, halfGapWidth, flush) {
 
   rect[xy[idx1WhenH]] += rowOtherLength;
   rect[wh[idx1WhenH]] -= rowOtherLength;
-} // Return [containerWidth, containerHeight] as defualt.
+} // Return [containerWidth, containerHeight] as default.
 
 
 function estimateRootSize(seriesModel, targetInfo, viewRoot, containerWidth, containerHeight) {

package/lib/chart/treemap/treemapVisual.js

@@ -49,21 +49,17 @@ var _default = {
   reset: function (seriesModel, ecModel, api, payload) {
     var tree = seriesModel.getData().tree;
     var root = tree.root;
-    var seriesItemStyleModel = seriesModel.getModel(ITEM_STYLE_NORMAL);
 
     if (root.isRemoved()) {
       return;
     }
 
-    var levelItemStyles = zrUtil.map(tree.levelModels, function (levelModel) {
-      return levelModel ? levelModel.get(ITEM_STYLE_NORMAL) : null;
-    });
     travelTree(root, // Visual should calculate from tree root but not view root.
-    {}, levelItemStyles, seriesItemStyleModel, seriesModel.getViewRoot().getAncestors(), seriesModel);
+    {}, seriesModel.getViewRoot().getAncestors(), seriesModel);
   }
 };
 
-function travelTree(node, designatedVisual, levelItemStyles, seriesItemStyleModel, viewRootAncestors, seriesModel) {
+function travelTree(node, designatedVisual, viewRootAncestors, seriesModel) {
   var nodeModel = node.getModel();
   var nodeLayout = node.getLayout(); // Optimize
 
@@ -72,8 +68,7 @@ function travelTree(node, designatedVisual, levelItemStyles, seriesItemStyleMode
   }
 
   var nodeItemStyleModel = node.getModel(ITEM_STYLE_NORMAL);
-  var levelItemStyle = levelItemStyles[node.depth];
-  var visuals = buildVisuals(nodeItemStyleModel, designatedVisual, levelItemStyle, seriesItemStyleModel); // calculate border color
+  var visuals = buildVisuals(nodeItemStyleModel, designatedVisual, seriesModel); // calculate border color
 
   var borderColor = nodeItemStyleModel.get('borderColor');
   var borderColorSaturation = nodeItemStyleModel.get('borderColorSaturation');
@@ -99,21 +94,20 @@ function travelTree(node, designatedVisual, levelItemStyles, seriesItemStyleMode
       // If higher than viewRoot, only ancestors of viewRoot is needed to visit.
       if (child.depth >= viewRootAncestors.length || child === viewRootAncestors[child.depth]) {
         var childVisual = mapVisual(nodeModel, visuals, child, index, mapping, seriesModel);
-        travelTree(child, childVisual, levelItemStyles, seriesItemStyleModel, viewRootAncestors, seriesModel);
+        travelTree(child, childVisual, viewRootAncestors, seriesModel);
       }
     });
   }
 }
 
-function buildVisuals(nodeItemStyleModel, designatedVisual, levelItemStyle, seriesItemStyleModel) {
+function buildVisuals(nodeItemStyleModel, designatedVisual, seriesModel) {
   var visuals = zrUtil.extend({}, designatedVisual);
+  var designatedVisualItemStyle = seriesModel.designatedVisualItemStyle;
   zrUtil.each(['color', 'colorAlpha', 'colorSaturation'], function (visualName) {
     // Priority: thisNode > thisLevel > parentNodeDesignated > seriesModel
-    var val = nodeItemStyleModel.get(visualName, true); // Ignore parent
-
-    val == null && levelItemStyle && (val = levelItemStyle[visualName]);
-    val == null && (val = designatedVisual[visualName]);
-    val == null && (val = seriesItemStyleModel.get(visualName));
+    designatedVisualItemStyle[visualName] = designatedVisual[visualName];
+    var val = nodeItemStyleModel.get(visualName);
+    designatedVisualItemStyle[visualName] = null;
     val != null && (visuals[visualName] = val);
   });
   return visuals;

package/lib/component/axisPointer/axisTrigger.js

@@ -179,7 +179,7 @@ function processOnAxis(axisInfo, newValue, updaters, dontSnap, outputFinder) {
   var payloadInfo = buildPayloadsBySeries(newValue, axisInfo);
   var payloadBatch = payloadInfo.payloadBatch;
   var snapToValue = payloadInfo.snapToValue; // Fill content of event obj for echarts.connect.
-  // By defualt use the first involved series data as a sample to connect.
+  // By default use the first involved series data as a sample to connect.
 
   if (payloadBatch[0] && outputFinder.seriesIndex == null) {
     zrUtil.extend(outputFinder, payloadBatch[0]);

package/lib/component/legend/ScrollableLegendView.js

@@ -428,7 +428,7 @@ var ScrollableLegendView = LegendView.extend({
     contentGroup.eachChild(function (child, idx) {
       var legendDataIdx = child.__legendDataIndex; // FIXME
       // If the given targetDataIndex (from model) is illegal,
-      // we use defualtIndex. But the index on the legend model and
+      // we use defaultIndex. But the index on the legend model and
       // action payload is still illegal. That case will not be
       // changed until some scenario requires.