echarts 4.4.0 → 4.6.0

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/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/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);
+});

package/theme/blue.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 = [
+        '#1790cf',
+        '#1bb2d8',
+        '#99d2dd',
+        '#88b0bb',
+        '#1c7099',
+        '#038cc4',
+        '#75abd0',
+        '#afd6dd'
+    ];
+
+    var theme = {
+        color: colorPalette,
+
+        title: {
+            textStyle: {
+                fontWeight: 'normal',
+                color: '#1790cf'
+            }
+        },
+
+        visualMap: {
+            color: ['#1790cf', '#a2d4e6']
+        },
+
+        toolbox: {
+            color: ['#1790cf', '#1790cf', '#1790cf', '#1790cf']
+        },
+
+        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: '#1790cf',
+                    type: 'dashed'
+                },
+                crossStyle: {
+                    color: '#1790cf'
+                },
+                shadowStyle: {
+                    // Shadow indicator style settings
+                    color: 'rgba(200,200,200,0.3)'
+                }
+            }
+        },
+
+        // Area scaling controller
+        dataZoom: {
+            dataBackgroundColor: '#eee', // Data background color
+            fillerColor: 'rgba(144,197,237,0.2)', // Fill the color
+            handleColor: '#1790cf' // Handle color
+        },
+
+        timeline: {
+            lineStyle: {
+                color: '#1790cfa'
+            },
+            controlStyle: {
+                color: '#1790cf',
+                borderColor: '#1790cf'
+            }
+        },
+
+        candlestick: {
+            itemStyle: {
+                color: '#1bb2d8',
+                color0: '#99d2dd'
+            },
+            lineStyle: {
+                width: 1,
+                color: '#1c7099',
+                color0: '#88b0bb'
+            },
+            areaStyle: {
+                color: '#1790cf',
+                color0: '#1bb2d8'
+            }
+        },
+
+        chord: {
+            padding: 4,
+            itemStyle: {
+                color: '#1bb2d8',
+                borderWidth: 1,
+                borderColor: 'rgba(128, 128, 128, 0.5)'
+            },
+            lineStyle: {
+                color: 'rgba(128, 128, 128, 0.5)'
+            },
+            areaStyle: {
+                color: '#1790cf'
+            }
+        },
+
+        graph: {
+            itemStyle: {
+                color: '#1bb2d8'
+            },
+            linkStyle: {
+                color: '#88b0bb'
+            }
+        },
+
+        map: {
+            itemStyle: {
+                color: '#ddd'
+            },
+            areaStyle: {
+                color: '99d2dd'
+            },
+            label: {
+                color: '#c12e34'
+            }
+        },
+
+        gauge: {
+            axisLine: {
+                lineStyle: {
+                    color: [
+                        [0.2, '#1bb2d8'],
+                        [0.8, '#1790cf'],
+                        [1, '#1c7099']
+                    ],
+                    width: 8
+                }
+            }
+        }
+    };
+
+    echarts.registerTheme('blue', theme);
+});