echarts 4.5.0 → 4.9.0

package/src/util/graphic.js

@@ -652,11 +652,13 @@ export function getHighlightDigit(highlightKey) {
  * @param {Object} opt Check `opt` of `setTextStyleCommon` to find other props.
  * @param {string|Function} [opt.defaultText]
  * @param {module:echarts/model/Model} [opt.labelFetcher] Fetch text by
- *      `opt.labelFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
- * @param {module:echarts/model/Model} [opt.labelDataIndex] Fetch text by
- *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
- * @param {module:echarts/model/Model} [opt.labelDimIndex] Fetch text by
- *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
+ *      `opt.labelFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex, opt.labelProp)`
+ * @param {number} [opt.labelDataIndex] Fetch text by
+ *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex, opt.labelProp)`
+ * @param {number} [opt.labelDimIndex] Fetch text by
+ *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex, opt.labelProp)`
+ * @param {string} [opt.labelProp] Fetch text by
+ *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex, opt.labelProp)`
  * @param {Object} [normalSpecified]
  * @param {Object} [emphasisSpecified]
  */
@@ -670,6 +672,7 @@ export function setLabelStyle(
     var labelFetcher = opt.labelFetcher;
     var labelDataIndex = opt.labelDataIndex;
     var labelDimIndex = opt.labelDimIndex;
+    var labelProp = opt.labelProp;
 
     // This scenario, `label.normal.show = true; label.emphasis.show = false`,
     // is not supported util someone requests.
@@ -683,7 +686,7 @@ export function setLabelStyle(
     var baseText;
     if (showNormal || showEmphasis) {
         if (labelFetcher) {
-            baseText = labelFetcher.getFormattedLabel(labelDataIndex, 'normal', null, labelDimIndex);
+            baseText = labelFetcher.getFormattedLabel(labelDataIndex, 'normal', null, labelDimIndex, labelProp);
         }
         if (baseText == null) {
             baseText = zrUtil.isFunction(opt.defaultText) ? opt.defaultText(labelDataIndex, opt) : opt.defaultText;
@@ -693,7 +696,7 @@ export function setLabelStyle(
     var emphasisStyleText = showEmphasis
         ? zrUtil.retrieve2(
             labelFetcher
-                ? labelFetcher.getFormattedLabel(labelDataIndex, 'emphasis', null, labelDimIndex)
+                ? labelFetcher.getFormattedLabel(labelDataIndex, 'emphasis', null, labelDimIndex, labelProp)
                 : null,
             baseText
         )
@@ -1071,8 +1074,7 @@ function rollbackDefaultTextStyle(style) {
 }
 
 export function getFont(opt, ecModel) {
-    // ecModel or default text style model.
-    var gTextStyleModel = ecModel || ecModel.getModel('textStyle');
+    var gTextStyleModel = ecModel && ecModel.getModel('textStyle');
     return zrUtil.trim([
         // FIXME in node-canvas fontWeight is before fontStyle
         opt.fontStyle || gTextStyleModel && gTextStyleModel.getShallow('fontStyle') || '',
@@ -1125,7 +1127,7 @@ function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb)
  * configuration in series.
  *
  * Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
  * animation starts, unless you know what you are doing.
  *
  * @param {module:zrender/Element} el
@@ -1151,7 +1153,7 @@ export function updateProps(el, props, animatableModel, dataIndex, cb) {
  * configuration in series.
  *
  * Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
  * animation starts, unless you know what you are doing.
  *
  * @param {module:zrender/Element} el

package/src/visual/LegendVisualProvider.js

@@ -0,0 +1,55 @@
+/*
+* 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.
+*/
+
+
+/**
+ * LegendVisualProvider is an bridge that pick encoded color from data and
+ * provide to the legend component.
+ * @param {Function} getDataWithEncodedVisual Function to get data after filtered. It stores all the encoding info
+ * @param {Function} getRawData Function to get raw data before filtered.
+ */
+function LegendVisualProvider(getDataWithEncodedVisual, getRawData) {
+    this.getAllNames = function () {
+        var rawData = getRawData();
+        // We find the name from the raw data. In case it's filtered by the legend component.
+        // Normally, the name can be found in rawData, but can't be found in filtered data will display as gray.
+        return rawData.mapArray(rawData.getName);
+    };
+
+    this.containName = function (name) {
+        var rawData = getRawData();
+        return rawData.indexOfName(name) >= 0;
+    };
+
+    this.indexOfName = function (name) {
+        // Only get data when necessary.
+        // Because LegendVisualProvider constructor may be new in the stage that data is not prepared yet.
+        // Invoking Series#getData immediately will throw an error.
+        var dataWithEncodedVisual = getDataWithEncodedVisual();
+        return dataWithEncodedVisual.indexOfName(name);
+    };
+
+    this.getItemVisual = function (dataIndex, key) {
+        // Get encoded visual properties from final filtered data.
+        var dataWithEncodedVisual = getDataWithEncodedVisual();
+        return dataWithEncodedVisual.getItemVisual(dataIndex, key);
+    };
+}
+
+export default LegendVisualProvider;

package/src/visual/VisualMapping.js

@@ -49,7 +49,7 @@ var CATEGORY_DEFAULT_VISUAL_INDEX = -1;
  *                                            visual data can be array or object
  *                                            (like: {cate1: '#222', none: '#fff'})
  *                                            or primary types (which represents
- *                                            defualt category visual), otherwise visual
+ *                                            default category visual), otherwise visual
  *                                            can be array or primary (which will be
  *                                            normalized to array).
  *

package/src/visual/dataColor.js

@@ -68,33 +68,20 @@ export default function (seriesType) {
                             dataAll.getName(rawIdx) || (rawIdx + ''), seriesModel.__paletteScope,
                             dataAll.count()
                         );
-                    // Legend may use the visual info in data before processed
-                    dataAll.setItemVisual(rawIdx, 'color', color);
-
                     // Data is not filtered
                     if (filteredIdx != null) {
                         data.setItemVisual(filteredIdx, 'color', color);
                     }
                 }
-                else {
-                    // Set data all color for legend
-                    dataAll.setItemVisual(rawIdx, 'color', singleDataColor);
-                }
 
                 if (!singleDataBorderColor) {
                     var borderColor = itemModel.get('itemStyle.borderColor');
-                    // Legend may use the visual info in data before processed
-                    dataAll.setItemVisual(rawIdx, 'borderColor', borderColor);
 
                     // Data is not filtered
                     if (filteredIdx != null) {
                         data.setItemVisual(filteredIdx, 'borderColor', borderColor);
                     }
                 }
-                else {
-                    // Set data all borderColor for legend
-                    dataAll.setItemVisual(rawIdx, 'borderColor', singleDataBorderColor);
-                }
             });
         }
     };

package/src/visual/seriesColor.js

@@ -18,6 +18,7 @@
 */
 
 import Gradient from 'zrender/src/graphic/Gradient';
+import {isFunction} from 'zrender/src/core/util';
 
 export default {
     createOnAllSeries: true,
@@ -25,25 +26,30 @@ export default {
     reset: function (seriesModel, ecModel) {
         var data = seriesModel.getData();
         var colorAccessPath = (seriesModel.visualColorAccessPath || 'itemStyle.color').split('.');
-        var color = seriesModel.get(colorAccessPath) // Set in itemStyle
-            || seriesModel.getColorFromPalette(
+        // Set in itemStyle
+        var color = seriesModel.get(colorAccessPath);
+        var colorCallback = (isFunction(color) && !(color instanceof Gradient))
+            ? color : null;
+        // Default color
+        if (!color || colorCallback) {
+            color = seriesModel.getColorFromPalette(
                 // TODO series count changed.
                 seriesModel.name, null, ecModel.getSeriesCount()
-            );  // Default color
+            );
+        }
 
-        // FIXME Set color function or use the platte color
         data.setVisual('color', color);
-        
+
         var borderColorAccessPath = (seriesModel.visualBorderColorAccessPath || 'itemStyle.borderColor').split('.');
         var borderColor = seriesModel.get(borderColorAccessPath);
         data.setVisual('borderColor', borderColor);
 
         // Only visible series has each data be visual encoded
         if (!ecModel.isSeriesFiltered(seriesModel)) {
-            if (typeof color === 'function' && !(color instanceof Gradient)) {
+            if (colorCallback) {
                 data.each(function (idx) {
                     data.setItemVisual(
-                        idx, 'color', color(seriesModel.getDataParams(idx))
+                        idx, 'color', colorCallback(seriesModel.getDataParams(idx))
                     );
                 });
             }

package/src/visual/symbol.js

@@ -33,12 +33,15 @@ export default function (seriesType, defaultSymbolType, legendSymbol) {
             var symbolType = seriesModel.get('symbol');
             var symbolSize = seriesModel.get('symbolSize');
             var keepAspect = seriesModel.get('symbolKeepAspect');
+            var symbolRotate = seriesModel.get('symbolRotate');
 
             var hasSymbolTypeCallback = isFunction(symbolType);
             var hasSymbolSizeCallback = isFunction(symbolSize);
-            var hasCallback = hasSymbolTypeCallback || hasSymbolSizeCallback;
+            var hasSymbolRotateCallback = isFunction(symbolRotate);
+            var hasCallback = hasSymbolTypeCallback || hasSymbolSizeCallback || hasSymbolRotateCallback;
             var seriesSymbol = (!hasSymbolTypeCallback && symbolType) ? symbolType : defaultSymbolType;
             var seriesSymbolSize = !hasSymbolSizeCallback ? symbolSize : null;
+            var seriesSymbolRotate = !hasSymbolRotateCallback ? seriesSymbolRotate : null;
 
             data.setVisual({
                 legendSymbol: legendSymbol || seriesSymbol,
@@ -48,7 +51,8 @@ export default function (seriesType, defaultSymbolType, legendSymbol) {
                 // some cases but generally it is not recommanded.
                 symbol: seriesSymbol,
                 symbolSize: seriesSymbolSize,
-                symbolKeepAspect: keepAspect
+                symbolKeepAspect: keepAspect,
+                symbolRotate: symbolRotate
             });
 
             // Only visible series has each data be visual encoded
@@ -62,12 +66,14 @@ export default function (seriesType, defaultSymbolType, legendSymbol) {
                     var params = seriesModel.getDataParams(idx);
                     hasSymbolTypeCallback && data.setItemVisual(idx, 'symbol', symbolType(rawValue, params));
                     hasSymbolSizeCallback && data.setItemVisual(idx, 'symbolSize', symbolSize(rawValue, params));
+                    hasSymbolRotateCallback && data.setItemVisual(idx, 'symbolRotate', symbolRotate(rawValue, params));
                 }
 
                 if (data.hasItemOption) {
                     var itemModel = data.getItemModel(idx);
                     var itemSymbolType = itemModel.getShallow('symbol', true);
                     var itemSymbolSize = itemModel.getShallow('symbolSize', true);
+                    var itemSymbolRotate = itemModel.getShallow('symbolRotate', true);
                     var itemSymbolKeepAspect = itemModel.getShallow('symbolKeepAspect', true);
 
                     // If has item symbol
@@ -78,6 +84,9 @@ export default function (seriesType, defaultSymbolType, legendSymbol) {
                         // PENDING Transform symbolSize ?
                         data.setItemVisual(idx, 'symbolSize', itemSymbolSize);
                     }
+                    if (itemSymbolRotate != null) {
+                         data.setItemVisual(idx, 'symbolRotate', itemSymbolRotate);
+                    }
                     if (itemSymbolKeepAspect != null) {
                         data.setItemVisual(idx, 'symbolKeepAspect', itemSymbolKeepAspect);
                     }

package/theme/azul.js

@@ -0,0 +1,163 @@
+/*
+ * 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.
+ */
+
+(function(root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        // AMD. Register as an anonymous module.
+        define(['exports', 'echarts'], factory);
+    } else if (
+        typeof exports === 'object' &&
+        typeof exports.nodeName !== 'string'
+    ) {
+        // CommonJS
+        factory(exports, require('echarts'));
+    } else {
+        // Browser globals
+        factory({}, root.echarts);
+    }
+})(this, function(exports, echarts) {
+    var log = function(msg) {
+        if (typeof console !== 'undefined') {
+            console && console.error && console.error(msg);
+        }
+    };
+    if (!echarts) {
+        log('ECharts is not Loaded');
+        return;
+    }
+
+    var colorPalette = [
+        '#f2385a',
+        '#f5a503',
+        '#4ad9d9',
+        '#f7879c',
+        '#c1d7a8',
+        '#4dffd2',
+        '#fccfd7',
+        '#d5f6f6'
+    ];
+
+    var theme = {
+        color: colorPalette,
+
+        title: {
+            textStyle: {
+                fontWeight: 'normal',
+                color: '#f2385a'
+            }
+        },
+
+        visualMap: {
+            color: ['#f2385a', '#f5a503']
+        },
+
+        toolbox: {
+            color: ['#f2385a', '#f2385a', '#f2385a', '#f2385a']
+        },
+
+        tooltip: {
+            backgroundColor: 'rgba(0,0,0,0.5)',
+            axisPointer: {
+                // Axis indicator, coordinate trigger effective
+                type: 'line', // The default is a straight line： 'line' | 'shadow'
+                lineStyle: {
+                    // Straight line indicator style settings
+                    color: '#f2385a',
+                    type: 'dashed'
+                },
+                crossStyle: {
+                    color: '#f2385a'
+                },
+                shadowStyle: {
+                    // Shadow indicator style settings
+                    color: 'rgba(200,200,200,0.3)'
+                }
+            }
+        },
+
+        // Area scaling controller
+        dataZoom: {
+            dataBackgroundColor: '#eee', // Data background color
+            fillerColor: 'rgba(200,200,200,0.2)', // Fill the color
+            handleColor: '#f2385a' // Handle color
+        },
+
+        timeline: {
+            lineStyle: {
+                color: '#f2385a'
+            },
+            controlStyle: {
+                color: '#f2385a',
+                borderColor: '#f2385a'
+            }
+        },
+
+        candlestick: {
+            itemStyle: {
+                color: '#f2385a',
+                color0: '#f5a503'
+            },
+            lineStyle: {
+                width: 1,
+                color: '#f2385a',
+                color0: '#f5a503'
+            },
+            areaStyle: {
+                color: '#c1d7a8',
+                color0: '#4ad9d9'
+            }
+        },
+
+        map: {
+            itemStyle: {
+                color: '#f2385a'
+            },
+            areaStyle: {
+                color: '#ddd'
+            },
+            label: {
+                color: '#c12e34'
+            }
+        },
+
+        graph: {
+            itemStyle: {
+                color: '#f2385a'
+            },
+            linkStyle: {
+                color: '#f2385a'
+            }
+        },
+
+        gauge: {
+            axisLine: {
+                lineStyle: {
+                    color: [
+                        [0.2, '#f5a503'],
+                        [0.8, '#f2385a'],
+                        [1, '#c1d7a8']
+                    ],
+                    width: 8
+                }
+            }
+        }
+    };
+
+    echarts.registerTheme('azul', theme);
+});

package/theme/bee-inspired.js

@@ -0,0 +1,178 @@
+/*
+ * 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.
+ */
+
+(function(root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        // AMD. Register as an anonymous module.
+        define(['exports', 'echarts'], factory);
+    } else if (
+        typeof exports === 'object' &&
+        typeof exports.nodeName !== 'string'
+    ) {
+        // CommonJS
+        factory(exports, require('echarts'));
+    } else {
+        // Browser globals
+        factory({}, root.echarts);
+    }
+})(this, function(exports, echarts) {
+    var log = function(msg) {
+        if (typeof console !== 'undefined') {
+            console && console.error && console.error(msg);
+        }
+    };
+    if (!echarts) {
+        log('ECharts is not Loaded');
+        return;
+    }
+
+    var colorPalette = [
+        '#001727',
+        '#805500',
+        '#ffff00',
+        '#ffd11a',
+        '#f2d71f',
+        '#f2be19',
+        '#f3a81a',
+        '#fff5cc'
+    ];
+
+    var theme = {
+        color: colorPalette,
+
+        title: {
+            textStyle: {
+                fontWeight: 'normal',
+                color: '#001727'
+            }
+        },
+
+        visualMap: {
+            color: ['#001727', '#805500']
+        },
+
+        toolbox: {
+            color: ['#001727', '#001727', '#001727', '#001727']
+        },
+
+        tooltip: {
+            backgroundColor: 'rgba(0,0,0,0.5)',
+            axisPointer: {
+                // Axis indicator, coordinate trigger effective
+                type: 'line', // The default is a straight line： 'line' | 'shadow'
+                lineStyle: {
+                    // Straight line indicator style settings
+                    color: '#001727',
+                    type: 'dashed'
+                },
+                crossStyle: {
+                    color: '#001727'
+                },
+                shadowStyle: {
+                    // Shadow indicator style settings
+                    color: 'rgba(200,200,200,0.3)'
+                }
+            }
+        },
+
+        // Area scaling controller
+        dataZoom: {
+            dataBackgroundColor: '#eee', // Data background color
+            fillerColor: 'rgba(200,200,200,0.2)', // Fill the color
+            handleColor: '#001727' // Handle color
+        },
+
+        timeline: {
+            lineStyle: {
+                color: '#001727'
+            },
+            controlStyle: {
+                color: '#001727',
+                borderColor: '#001727'
+            }
+        },
+
+        candlestick: {
+            itemStyle: {
+                color: '#f3a81a',
+                color0: '#ffff00'
+            },
+            lineStyle: {
+                width: 1,
+                color: '#ffff00',
+                color0: '#f3a81a'
+            },
+            areaStyle: {
+                color: '#805500',
+                color0: '#ffff00'
+            }
+        },
+
+        chord: {
+            padding: 4,
+            itemStyle: {
+                color: '#f3a81a',
+                borderWidth: 1,
+                borderColor: 'rgba(128, 128, 128, 0.5)'
+            },
+            lineStyle: {
+                color: 'rgba(128, 128, 128, 0.5)'
+            },
+            areaStyle: {
+                color: '#805500'
+            }
+        },
+
+        map: {
+            itemStyle: {
+                color: '#ffd11a'
+            },
+            areaStyle: {
+                color: '#f2be19'
+            },
+            label: {
+                color: '#ffd11a'
+            }
+        },
+
+        graph: {
+            itemStyle: {
+                color: '#001727'
+            },
+            linkStyle: {
+                color: '#001727'
+            }
+        },
+
+        gauge: {
+            axisLine: {
+                lineStyle: {
+                    color: [
+                        [0.2, '#f2d71f'],
+                        [0.8, '#001727'],
+                        [1, '#ffff00']
+                    ],
+                    width: 8
+                }
+            }
+        }
+    };
+
+    echarts.registerTheme('bee-inspired', theme);
+});