Merge branch 'dev-3.0.0' of https://github.com/ecomfe/echarts into dev-3.0.0

build/config.js

@@ -52,6 +52,7 @@
         'echarts/component/markLine',
 
         'echarts/component/timeline',
+        'echarts/component/toolbox',
 
         'echarts/scale/Time',
         'echarts/scale/Log',

build/wrap/end.js

@@ -4,6 +4,9 @@ var echarts = require('echarts');
 require("${mod}");
 /** /for */
 
-return echarts;
+/** if: ${vml} */
+require('zrender/vml/vml');
+/** /if */
 
+return echarts;
 }));

src/CoordinateSystem.js

@@ -31,7 +31,7 @@ define(function(require) {
                 return list[idx || 0];
             }
         }
-    }
+    };
 
     CoordinateSystemManager.register = function (type, coordinateSystemCreator) {
         coordinateSystemCreators[type] = coordinateSystemCreator;

src/chart/graph/GraphView.js

@@ -6,6 +6,7 @@ define(function (require) {
     var RoamController = require('../../component/helper/RoamController');
 
     var modelUtil = require('../../util/model');
+    var graphic = require('../../util/graphic');
 
     require('../../echarts').extendChartView({
 
@@ -24,6 +25,8 @@ define(function (require) {
             this._symbolDraw = symbolDraw;
             this._lineDraw = lineDraw;
             this._controller = controller;
+
+            this._firstRender = true;
         },
 
         render: function (seriesModel, ecModel, api) {
@@ -68,10 +71,16 @@ define(function (require) {
             });
 
             var group = this.group;
-            group.attr({
+            var groupNewProp = {
                 position: coordSys.position,
                 scale: coordSys.scale
-            });
+            };
+            if (this._firstRender) {
+                group.attr(groupNewProp);
+            }
+            else {
+                graphic.updateProps(group, groupNewProp, seriesModel);
+            }
 
             this._nodeScaleRatio = seriesModel.get('nodeScaleRatio');
             // this._edgeScaleRatio = seriesModel.get('edgeScaleRatio');
@@ -106,6 +115,8 @@ define(function (require) {
                 }
                 el.setDraggable(draggable);
             }, this);
+
+            this._firstRender = false;
         },
 
         _startForceLayoutIteration: function (forceLayout, layoutAnimation) {

src/chart/helper/createListFromArray.js

@@ -156,7 +156,7 @@ define(function(require) {
                 // [[3, 0.2], [1, 0.3], [2, 0.15]]
                 // or given scatter data,
                 // pick the category
-                if (data[0] && data[0].length > 1) {
+                if (zrUtil.isArray(data[0]) && data[0].length > 1) {
                     nameList = [];
                     for (var i = 0; i < dataLen; i++) {
                         nameList[i] = categories[data[i][0]];

src/chart/treemap/Breadcrumb.js

@@ -124,7 +124,6 @@
                             lineJoin: 'bevel',
                             text: text,
                             textFill: textStyleModel.getTextColor(),
-                            textAlign: 'left',
                             textFont: textStyleModel.getFont()
                         }
                     ),

src/component/toolbox.js

@@ -5,4 +5,5 @@ define(function (require) {
 
     require('./toolbox/feature/SaveAsImage');
     require('./toolbox/feature/MagicType');
+    require('./toolbox/feature/DataView');
 });
\ No newline at end of file

src/component/toolbox/ToolboxModel.js

@@ -39,11 +39,11 @@ define(function (require) {
 
             borderWidth: 0,
 
-            padding: 10,
+            padding: 5,
 
-            itemGap: 10,
+            itemSize: 15,
 
-            itemSize: 18,
+            itemGap: 8,
 
             showTitle: true,
 

src/component/toolbox/ToolboxView.js

@@ -5,6 +5,7 @@ define(function (require) {
     var graphic = require('../../util/graphic');
     var Model = require('../../model/Model');
     var listComponentHelper = require('../helper/listComponent');
+    var textContain = require('zrender/contain/text');
 
     return require('../../echarts').extendComponentView({
 
@@ -36,18 +37,38 @@ define(function (require) {
                 var normalStyle = iconStyleModel.getModel('normal').getItemStyle();
                 var hoverStyle = iconStyleModel.getModel('emphasis').getItemStyle();
 
+                // If one feature has mutiple icon. they are orginaized as
+                // {
+                //     icon: {
+                //         foo: '',
+                //         bar: ''
+                //     },
+                //     title: {
+                //         foo: '',
+                //         bar: ''
+                //     }
+                // }
                 var icons = feature.getIcons ? feature.getIcons() : featureModel.get('icon');
+                var titles = featureModel.get('title') || {};
                 if (typeof icons === 'string') {
                     var icon = icons;
+                    var title = titles;
                     icons = {};
+                    titles = {};
                     icons[featureName] = icon;
+
+                    titles[featureName] = title;
                 }
 
                 zrUtil.each(icons, function (icon, iconName) {
                     var path = graphic.makePath(
                         icon, {
                             style: normalStyle,
-                            hoverStyle: hoverStyle,
+                            hoverStyle: zrUtil.extend({
+                                text: titles[iconName],
+                                textPosition: 'bottom',
+                                textFill: hoverStyle.fill || hoverStyle.stroke || '#000'
+                            }, hoverStyle),
                             rectHover: true
                         }, {
                             x: -itemSize / 2,
@@ -70,6 +91,34 @@ define(function (require) {
             // Render background after group is layout
             // FIXME
             listComponentHelper.addBackground(group, toolboxModel);
+
+            // Adjust icon title positions to avoid them out of screen
+            group.eachChild(function (icon) {
+                var hoverStyle = icon.hoverStyle;
+                // May be background element
+                if (hoverStyle && hoverStyle.text) {
+                    var rect = textContain.getBoundingRect(
+                        hoverStyle.text, hoverStyle.font
+                    );
+                    var offsetX = icon.position[0] + group.position[0];
+                    var offsetY = icon.position[1] + group.position[1] + itemSize;
+
+                    var needPutOnTop = false;
+                    if (offsetY + rect.height > api.getHeight()) {
+                        hoverStyle.textPosition = 'top';
+                        needPutOnTop = true;
+                    }
+                    var topOffset = needPutOnTop ? (-5 - rect.height) : (itemSize + 8);
+                    if (offsetX + rect.width /  2 > api.getWidth()) {
+                        hoverStyle.textPosition = ['100%', topOffset];
+                        hoverStyle.textAlign = 'right';
+                    }
+                    else if (offsetX - rect.width / 2 < 0) {
+                        hoverStyle.textPosition = [0, topOffset];
+                        hoverStyle.textAlign = 'left';
+                    }
+                }
+            });
         }
     });
 });
\ No newline at end of file

src/component/toolbox/feature/DataView.js

 define(function (require) {
-    
+
+    var zrUtil = require('zrender/core/util');
+    var eventTool = require('zrender/core/event');
+
+    /**
+     * Group series into two types
+     *  1. on category axis, like line, bar
+     *  2. others, like scatter, pie
+     * @param {module:echarts/model/Global} ecModel
+     * @return {Object}
+     */
+    function groupSeries(ecModel) {
+        var seriesGroupByCategoryAxis = {};
+        var otherSeries = [];
+        ecModel.eachRawSeries(function (seriesModel) {
+            var coordSys = seriesModel.coordinateSystem;
+
+            if (coordSys && (coordSys.type === 'cartesian2d' || coordSys.type === 'polar')) {
+                var baseAxis = coordSys.getBaseAxis();
+                if (baseAxis.type === 'category') {
+                    var key = baseAxis.dim + '_' + baseAxis.index;
+                    seriesGroupByCategoryAxis[key] = seriesGroupByCategoryAxis[key] || {
+                        categoryAxis: baseAxis,
+                        valueAxis: coordSys.getOtherAxis(baseAxis),
+                        series: []
+                    };
+                    seriesGroupByCategoryAxis[key].series.push(seriesModel);
+                }
+            }
+            else {
+                otherSeries.push(seriesModel);
+            }
+        });
+        return {
+            seriesGroupByCategoryAxis: seriesGroupByCategoryAxis,
+            other: otherSeries
+        };
+    }
+
+    /**
+     * Assemble content of series on cateogory axis
+     * @param {Array.<module:echarts/model/Series>} series
+     * @return {string}
+     */
+    function assembleSeriesWithCategoryAxis(series) {
+        var tables = [];
+        zrUtil.each(series, function (group, key) {
+            var categoryAxis = group.categoryAxis;
+            var valueAxis = group.valueAxis;
+            var valueAxisDim = valueAxis.dim;
+
+            var headers = ['类目'].concat(zrUtil.map(group.series, function (series) {
+                return series.name;
+            }));
+            var columns = [categoryAxis.model.getCategories()];
+            zrUtil.each(group.series, function (series) {
+                columns.push(series.getData().mapArray(valueAxisDim, function (val) {
+                    return val;
+                }));
+            });
+            // Assemble table content
+            var lines = [headers.join('\t')];
+            for (var i = 0; i < columns[0].length; i++) {
+                var items = [];
+                for (var j = 0; j < columns.length; j++) {
+                    items.push(columns[j][i]);
+                }
+                lines.push(items.join('\t'));
+            }
+            tables.push(lines.join('\n'));
+        });
+        return tables.join('\n\n\n');
+    }
+
+    /**
+     * Assemble content of other series
+     * @param {Array.<module:echarts/model/Series>} series
+     * @return {string}
+     */
+    function assembleOtherSeries(series) {
+        return zrUtil.map(series, function (series) {
+            var data = series.getData();
+            var lines = [series.name];
+            data.each(data.dimensions, function () {
+                var argLen = arguments.length;
+                var dataIndex = arguments[argLen - 1];
+                var vals = zrUtil.slice(arguments, 0, argLen - 1);
+                var name = data.getName(dataIndex);
+                if (name) {
+                    vals.unshift(name);
+                }
+                lines.push(vals.join('\t'));
+            });
+            return lines.join('\n');
+        }).join('\n\n\n');
+    }
+
+    /**
+     * @param {module:echarts/model/Global}
+     * @return {string}
+     */
+    function getContentFromModel(ecModel) {
+
+        var result = groupSeries(ecModel);
+
+        return [
+            assembleSeriesWithCategoryAxis(result.seriesGroupByCategoryAxis),
+            assembleOtherSeries(result.other)
+        ].join('\n\n\n');
+    }
+
+    function DataView(model) {
+
+        this._dom = null;
+
+        this.model = model;
+    }
+
+
+    DataView.defaultOption = {
+        show: true,
+        readOnly: false,
+        icon: 'M17.5,17.3H33 M17.5,17.3H33 M45.4,29.5h-28 M11.5,2v56H51V14.8L38.4,2H11.5z M38.4,2.2v12.7H51 M45.4,41.7h-28',
+        title: '数据视图',
+        lang: ['数据视图', '关闭', '刷新']
+    };
+
+
+    DataView.prototype.onclick = function (ecModel, api) {
+        var container = api.getDom();
+        var model = this.model;
+        if (this._dom) {
+            container.removeChild(this._dom);
+        }
+        var root = document.createElement('div');
+        root.style.cssText = 'position:absolute;left:5;top:5;bottom:5;right:5;'
+            + 'background-color: white';
+
+        // Create elements
+        var header = document.createElement('h4');
+        var lang = model.get('lang') || [];
+        header.innerHTML = lang[0] || model.get('title');
+        header.style.cssText = 'margin: 10px 20px;';
+        var textarea = document.createElement('textarea');
+        textarea.style.cssText = 'display:block;width:100%;font-size:14px;line-height:1.6rem;font-family:Monaco,Consolas,Courier New';
+        textarea.textContent = getContentFromModel(ecModel);
+
+        var buttonContainer = document.createElement('div');
+        buttonContainer.style.cssText = 'position:absolute;bottom:0;left:0;right:0;';
+
+        var buttonStyle = 'float:right;margin-right:20px;border:none;background:#c23531;'
+            + 'cursor:pointer;padding:4px 8px;color:#fff;font-size:12px;border-radius:3px;';
+        var closeButton = document.createElement('div');
+        var refreshButton = document.createElement('div');
+
+        var self = this;
+        eventTool.addEventListener(closeButton, 'click', function () {
+            container.removeChild(root);
+            self._dom = null;
+        });
+
+        closeButton.innerHTML = lang[1];
+        refreshButton.innerHTML = lang[2];
+        refreshButton.style.cssText = buttonStyle;
+        closeButton.style.cssText = buttonStyle;
+
+        buttonContainer.appendChild(refreshButton);
+        buttonContainer.appendChild(closeButton);
+
+        // http://stackoverflow.com/questions/6637341/use-tab-to-indent-in-textarea
+        eventTool.addEventListener(textarea, 'keydown', function (e) {
+            if ((e.keyCode || e.which) === 9) {
+                // get caret position/selection
+                var val = this.value;
+                var start = this.selectionStart;
+                var end = this.selectionEnd;
+
+                // set textarea value to: text before caret + tab + text after caret
+                this.value = val.substring(0, start) + '\t' + val.substring(end);
+
+                // put caret at right position again
+                this.selectionStart = this.selectionEnd = start + 1;
+
+                // prevent the focus lose
+                eventTool.stop(e);
+            }
+        });
+
+        root.appendChild(header);
+        root.appendChild(textarea);
+        root.appendChild(buttonContainer);
+
+        textarea.style.height = (container.clientHeight - 100) + 'px';
+
+        container.appendChild(root);
+        this._dom = root;
+    };
+
+    DataView.prototype.dispose = function (ecModel, api) {
+        this._dom && api.getDom().removeChild(this._dom);
+    };
+
+    require('../featureManager').register('dataView', DataView);
+
+    return DataView;
 });
\ No newline at end of file

src/component/toolbox/feature/MagicType.js

@@ -9,10 +9,11 @@ define(function(require) {
 
     MagicType.defaultOption = {
         show: true,
+        type: [],
         // Icon group
         icon: {
             line: 'M4.1,28.9h7.1l9.3-22l7.4,38l9.7-19.7l3,12.8h14.9M4.1,58h51.4',
-            bar: 'M8.5,22.9h6.9V50H8.5V22.9z M26.7,12.9h6.9v37h-6.9V12.9z M45,2h6.9v48H45V2z M3.3,58H57',
+            bar: 'M6.7,22.9h10V48h-10V22.9zM24.9,13h10v35h-10V13zM43.2,2h10v46h-10V2zM3.1,58h53.7',
             stack: 'M8.2,38.4l-8.4,4.1l30.6,15.3L60,42.5l-8.1-4.1l-21.5,11L8.2,38.4z M51.9,30l-8.1,4.2l-13.4,6.9l-13.9-6.9L8.2,30l-8.4,4.2l8.4,4.2l22.2,11l21.5-11l8.1-4.2L51.9,30z M51.9,21.7l-8.1,4.2L35.7,30l-5.3,2.8L24.9,30l-8.4-4.1l-8.3-4.2l-8.4,4.2L8.2,30l8.3,4.2l13.9,6.9l13.4-6.9l8.1-4.2l8.1-4.1L51.9,21.7zM30.4,2.2L-0.2,17.5l8.4,4.1l8.3,4.2l8.4,4.2l5.5,2.7l5.3-2.7l8.1-4.2l8.1-4.2l8.1-4.1L30.4,2.2z',
             tiled: 'M2.3,2.2h22.8V25H2.3V2.2z M35,2.2h22.8V25H35V2.2zM2.3,35h22.8v22.8H2.3V35z M35,35h22.8v22.8H35V35z'
         },
@@ -21,7 +22,9 @@ define(function(require) {
             bar: '切换为柱状图',
             stack: '切换为堆叠',
             tiled: '切换为平铺'
-        }
+        },
+        option: {},
+        seriesIndex: {}
     };
 
     var proto = MagicType.prototype;
@@ -30,7 +33,7 @@ define(function(require) {
         var model = this.model;
         var availableIcons = model.get('icon');
         var icons = {};
-        zrUtil.each(model.get('option'), function (option, type) {
+        zrUtil.each(model.get('type'), function (type) {
             if (availableIcons[type]) {
                 icons[type] = availableIcons[type];
             }
@@ -38,11 +41,89 @@ define(function(require) {
         return icons;
     };
 
+    var seriesOptGenreator = {
+        'line': function (seriesType, seriesId, seriesModel, model) {
+            if (seriesType === 'bar') {
+                return zrUtil.merge({
+                    id: seriesId,
+                    type: 'line',
+                    // Preserve data related option
+                    data: seriesModel.get('data'),
+                    stack: seriesModel.get('stack')
+                }, model.get('option.line'));
+            }
+        },
+        'bar': function (seriesType, seriesId, seriesModel, model) {
+            if (seriesType === 'line') {
+                return zrUtil.merge({
+                    id: seriesId,
+                    type: 'bar',
+                    // Preserve data related option
+                    data: seriesModel.get('data'),
+                    stack: seriesModel.get('stack')
+                }, model.get('option.bar'));
+            }
+        },
+        'stack': function (seriesType, seriesId, seriesModel, model) {
+            if (seriesType === 'line' || seriesType === 'bar') {
+                return {
+                    id: seriesId,
+                    stack: '__ec_magicType_stack__'
+                };
+            }
+        },
+        'tiled': function (seriesType, seriesId, seriesModel, model) {
+            if (seriesType === 'line' || seriesType === 'bar') {
+                return {
+                    id: seriesId,
+                    stack: ''
+                };
+            }
+        }
+    };
+
     proto.onclick = function (ecModel, api, type) {
-        if (type === 'stack') {
-            // var seriesModels = 
+        var model = this.model;
+        var seriesIndex = model.get('seriesIndex.' + type);
+        if (
+            type === 'stack' || type === 'tiled'
+            || type === 'bar' || type === 'line'
+        ) {
+            var newOption = {
+                series: []
+            };
+            ecModel.eachComponent(
+                {
+                    mainType: 'series',
+                    seriesIndex: seriesIndex
+                }, function (seriesModel) {
+                    var seriesType = seriesModel.subType;
+                    var seriesId = seriesModel.id;
+                    var newSeriesOpt = seriesOptGenreator[type](
+                        seriesType, seriesId, seriesModel, model
+                    );
+                    if (newSeriesOpt) {
+                        // PENDING If merge original option?
+                        zrUtil.defaults(newSeriesOpt, seriesModel.option);
+                        newOption.series.push(newSeriesOpt);
+                    }
+                }
+            );
+            api.dispatchAction({
+                type: 'magicType',
+                newOption: newOption
+            });
         }
-    }
+    };
+
+    var echarts = require('../../../echarts');
+    echarts.registerAction({
+        type: 'magicType',
+        event: 'magicType',
+        update: 'reoption'
+    }, function (payload, ecModel) {
+        ecModel.mergeOption(payload.newOption);
+    });
 
     require('../featureManager').register('magicType', MagicType);
 

src/component/tooltip/TooltipView.js

@@ -318,10 +318,7 @@ define(function (require) {
                     if (coordSys.type === 'cartesian2d') {
                         // FIXME `axisPointer.axis` is not baseAxis
                         baseAxis = coordSys.getBaseAxis();
-                        var baseDim = baseAxis.dim;
-                        var axisIndex = seriesModel.get(baseDim + 'AxisIndex');
-
-                        key = baseDim + axisIndex;
+                        key = baseAxis.dim + baseAxis.index;
                     }
                     else {
                         baseAxis = coordSys.getBaseAxis();

src/echarts.js

@@ -88,7 +88,7 @@ define(function (require) {
          * @type {Array.<module:echarts/view/Chart>}
          * @private
          */
-        this._chartsList = [];
+        this._chartsViews = [];
 
         /**
          * @type {Object.<string, module:echarts/view/Chart>}
@@ -100,7 +100,7 @@ define(function (require) {
          * @type {Array.<module:echarts/view/Component>}
          * @private
          */
-        this._componentsList = [];
+        this._componentsViews = [];
 
         /**
          * @type {Object.<string, module:echarts/view/Component>}
@@ -456,7 +456,7 @@ define(function (require) {
         ecModel.eachComponent(
             {mainType: 'series', query: payload},
             function (seriesModel, index, payloadInfo) {
-                var chartView = this._chartsMap[seriesModel.id];
+                var chartView = this._chartsMap[seriesModel.__viewId];
                 if (chartView) {
                     chartView[method](
                         seriesModel, ecModel, this._api, payloadInfo
@@ -548,7 +548,7 @@ define(function (require) {
         var api = this._api;
 
         // Update all components
-        each(this._componentsList, function (component) {
+        each(this._componentsViews, function (component) {
             var componentModel = component.__model;
             component[methodName](componentModel, ecModel, api, payload);
 
@@ -557,7 +557,7 @@ define(function (require) {
 
         // Upate all charts
         ecModel.eachSeries(function (seriesModel, idx) {
-            var chart = this._chartsMap[seriesModel.id];
+            var chart = this._chartsMap[seriesModel.__viewId];
             chart[methodName](seriesModel, ecModel, api, payload);
 
             updateZ(seriesModel, chart);
@@ -572,7 +572,7 @@ define(function (require) {
      */
     function prepareView(type, ecModel) {
         var isComponent = type === 'component';
-        var viewList = isComponent ? this._componentsList : this._chartsList;
+        var viewList = isComponent ? this._componentsViews : this._chartsViews;
         var viewMap = isComponent ? this._componentsMap : this._chartsMap;
         var zr = this._zr;
 
@@ -590,7 +590,8 @@ define(function (require) {
                 model = componentType;
             }
 
-            var view = viewMap[model.id];
+            var viewId = model.id + '_' + model.type;
+            var view = viewMap[viewId];
             if (!view) {
                 var classType = ComponentModel.parseClassType(model.type);
                 var Clazz = isComponent
@@ -599,7 +600,7 @@ define(function (require) {
                 if (Clazz) {
                     view = new Clazz();
                     view.init(ecModel, this._api);
-                    viewMap[model.id] = view;
+                    viewMap[viewId] = view;
                     viewList.push(view);
                     zr.add(view.group);
                 }
@@ -609,8 +610,9 @@ define(function (require) {
                 }
             }
 
+            model.__viewId = viewId;
             view.__keepAlive = true;
-            view.__id = model.id;
+            view.__id = viewId;
             view.__model = model;
         }, this);
 
@@ -694,28 +696,28 @@ define(function (require) {
     function doRender(ecModel, payload) {
         var api = this._api;
         // Render all components
-        each(this._componentsList, function (component) {
-            var componentModel = component.__model;
-            component.render(componentModel, ecModel, api, payload);
+        each(this._componentsViews, function (componentView) {
+            var componentModel = componentView.__model;
+            componentView.render(componentModel, ecModel, api, payload);
 
-            updateZ(componentModel, component);
+            updateZ(componentModel, componentView);
         }, this);
 
-        each(this._chartsList, function (chart) {
+        each(this._chartsViews, function (chart) {
             chart.__keepAlive = false;
         }, this);
 
         // Render all charts
         ecModel.eachSeries(function (seriesModel, idx) {
-            var chart = this._chartsMap[seriesModel.id];
-            chart.__keepAlive = true;
-            chart.render(seriesModel, ecModel, api, payload);
+            var chartView = this._chartsMap[seriesModel.__viewId];
+            chartView.__keepAlive = true;
+            chartView.render(seriesModel, ecModel, api, payload);
 
-            updateZ(seriesModel, chart);
+            updateZ(seriesModel, chartView);
         }, this);
 
         // Remove groups of unrendered charts
-        each(this._chartsList, function (chart) {
+        each(this._chartsViews, function (chart) {
             if (!chart.__keepAlive) {
                 chart.remove(ecModel, api);
             }

src/model/globalDefault.js

@@ -9,10 +9,10 @@ define(function () {
         backgroundColor: 'rgba(0,0,0,0)',
 
         // https://dribbble.com/shots/1065960-Infographic-Pie-chart-visualization
-        // color: ['#5793f3', '#d14a61', '#fd9c35', '#675bba', '#fec42c',
-        //         '#dd4444', '#d4df5a', '#cd4870'],
+        // color: ['#5793f3', '#d14a61', '#fd9c35', '#675bba', '#fec42c', '#dd4444', '#d4df5a', '#cd4870'],
         // 浅色
         // color: ['#bcd3bb', '#e88f70', '#edc1a5', '#9dc5c8', '#e1e8c8', '#7b7c68', '#e5b5b5', '#f0b489', '#928ea8', '#bda29a'],
+        // color: ['#cc5664', '#9bd6ec', '#ea946e', '#8acaaa', '#f1ec64', '#ee8686', '#a48dc1', '#5da6bc', '#b9dcae'],
         // 深色
         color: ['#c23531', '#314656', '#61a0a8', '#dd8668', '#91c7ae', '#6e7074', '#61a0a8', '#bda29a', '#44525d', '#c4ccd3'],
 
@@ -21,6 +21,7 @@ define(function () {
 
         // 主题，主题
         textStyle: {
+            // color: '#000',
             decoration: 'none',
             // PENDING
             fontFamily: platform.match(/^Win/) ? 'Microsoft YaHei' : 'sans-serif',

test/axes.html

@@ -75,7 +75,7 @@
                 var makePolar = zrUtil.curry(makeChart, defaultPolarOption);
 
 
-
+                console.profile('render');
                 renderTitle('cartesian normal');
 
                 // inverse
@@ -398,6 +398,7 @@
                     parallelAxis: makeParallelAxisOption({inverse: true, nameLocation: 'start'})
                 });
 
+                console.profileEnd('render');
             });
 
             function makeParallelAxisOption(secondOpt) {

test/bar.html

@@ -22,14 +22,15 @@
             require([
                 'echarts',
                 'echarts/chart/bar',
+                'echarts/chart/line',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/tooltip'
+                'echarts/component/tooltip',
+                'echarts/component/toolbox',
+                'zrender/vml/vml'
             ], function (echarts) {
 
-                var chart = echarts.init(document.getElementById('main'), null, {
-                    renderer: 'canvas'
-                });
+                var chart = echarts.init(document.getElementById('main'));
 
                 var xAxisData = [];
                 var data1 = [];
@@ -65,16 +66,27 @@
 
                 chart.setOption({
                     legend: {
+                        borderWidth: 1,
                         data: [{
                             name: 'bar'
                         }, 'bar2', 'bar3', 'bar4'],
                         selected: {
                             // 'bar': false
                         },
-                        orient: 'vertical',
-                        x: 'right',
-                        y: 'bottom',
-                        align: 'right'
+                        // orient: 'vertical',
+                        // x: 'right',
+                        // y: 'bottom',
+                        align: 'left'
+                    },
+                    toolbox: {
+                        // y: 'bottom',
+                        feature: {
+                            magicType: {
+                                type: ['line', 'bar', 'stack', 'tiled']
+                            },
+                            dataView: {},
+                            saveAsImage: {}
+                        }
                     },
                     tooltip: {},
                     xAxis: {

test/config.js

@@ -17,6 +17,6 @@ require.config({
             location: '../../zrender-dev3.0/src',
             name: 'zrender'
         }
-    ]//,
+    ]
     // urlArgs: '_v_=' + +new Date()
 });
\ No newline at end of file

test/connect.html

@@ -29,7 +29,8 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRange'
+                'echarts/component/dataRange',
+                'echarts/component/tooltip'
             ], function (echarts) {
 
                 var chart1 = echarts.init(document.getElementById('chart1'));
@@ -53,6 +54,9 @@
                         y: 50,
                         data: ['scatter']
                     },
+                    tooltip: {
+                        formatter: '{c}'
+                    },
                     grid: {
                         y: '26%',
                         y2: '26%'
@@ -76,7 +80,7 @@
                             // selectedMode: 'single',
                             selectedMode: 'multiple',
                             backgroundColor: '#eee',
-                            dimension: 'z',
+                            dimension: 2,
                             selected: [],
                             min: 0,
                             max: 24,
@@ -103,6 +107,9 @@
                         y: 50,
                         data: ['scatter']
                     },
+                    tooltip: {
+                        formatter: '{c}'
+                    },
                     grid: {
                         y: '26%',
                         y2: '26%'
@@ -125,7 +132,7 @@
                             // selectedMode: 'single',
                             selectedMode: 'multiple',
                             backgroundColor: '#eee',
-                            dimension: 'z',
+                            dimension: 2,
                             selected: [],
                             min: 0,
                             max: 24,
@@ -148,6 +155,7 @@
                 });
 
                 echarts.connect([chart1, chart2]);
+
             });
 
         </script>

test/dataZoom-cartesian-h.html

@@ -19,7 +19,7 @@
 
             require([
                 'echarts',
-                'echarts/chart/line',
+                'echarts/chart/bar',
                 'echarts/component/legend',
                 'echarts/component/grid',
                 'echarts/component/axis',
@@ -54,7 +54,7 @@
 
                 chart.setOption({
                     legend: {
-                        data: ['line', 'line2', 'line3']
+                        data: ['bar', 'bar2', 'bar3']
                     },
                     tooltip: {
                         trigger: 'axis'
@@ -70,22 +70,22 @@
                     },
                     series: [
                         {
-                            name: 'line2',
-                            type: 'line',
+                            name: 'bar2',
+                            type: 'bar',
                             stack: 'all',
                             data: data2,
                             smooth: true
                         },
                         {
-                            name: 'line3',
-                            type: 'line',
+                            name: 'bar3',
+                            type: 'bar',
                             stack: 'all',
                             data: data3,
                             smooth: 0.1
                         },
                         {
-                            name: 'line',
-                            type: 'line',
+                            name: 'bar',
+                            type: 'bar',
                             data: data1,
                             smooth: true,
                             stack: 'all',

test/dataZoom-rainfall-connect.html

@@ -38,12 +38,12 @@
                 'echarts/component/tooltip',
                 'echarts/component/grid',
                 'echarts/component/axis',
+                'echarts/component/toolbox',
                 'echarts/component/dataZoomInside'
             ], function (data, echarts) {
                 var chart1 = createChart1(data, echarts);
                 var chart2 = createChart2(data, echarts);
 
-
                 echarts.connect([chart1, chart2]);
 
                 // chart1.on('dataZoom', function (payload) {
@@ -84,6 +84,11 @@
                             borderWidth: 0
                         }
                     ],
+                    toolbox: {
+                        feature: {
+                            saveAsImage: {}
+                        }
+                    },
                     xAxis: [
                         {
                             // data: ['类目1', '类目2', '类目3', '类目4', '类目5',]

test/effectScatter.html

@@ -506,7 +506,7 @@
                                 symbolSize: function (val) {
                                     return val[2] / 10;
                                 },
-                                showEffectOn: 'render',
+                                showEffectOn: 'emphasis',
                                 rippleEffect: {
                                     brushType: 'stroke'
                                 },

test/geoLine.html

@@ -315,7 +315,7 @@
                             itemStyle: {
                                 normal: {
                                     areaColor: '#323c48',
-                                    borderColor: '#111'
+                                    borderColor: '#404a59'
                                 },
                                 emphasis: {
                                     areaColor: '#2a333d'

test/line.html

@@ -119,7 +119,7 @@
                         name: 'line3',
                         type: 'line',
                         stack: 'all',
-                        symbol: 'circle',
+                        symbol: 'triangle',
                         symbolSize: 10,
                         data: data3,
                         itemStyle: itemStyle

test/polarLine2.html

@@ -46,9 +46,12 @@
                         }
                     },
                     angleAxis: {
-                        type: 'value'
+                        type: 'value',
+                        startAngle: 0
                     },
                     radiusAxis: {
+                        min: 10,
+                        max: 20
                     },
                     series: [{
                         coordinateSystem: 'polar',

test/scatter.html

@@ -68,6 +68,11 @@
                     series: [{
                         name: 'scatter',
                         type: 'scatter',
+                        label: {
+                            emphasis: {
+                                show: true
+                            }
+                        },
                         // symbol: 'diamond',
                         symbolSize: function (val) {
                             return val[2] * 40;
@@ -83,6 +88,11 @@
                     }, {
                         name: 'scatter2',
                         type: 'scatter',
+                        label: {
+                            emphasis: {
+                                show: true
+                            }
+                        },
                         symbolSize: function (val) {
                             return val[2] * 40;
                         },
@@ -97,6 +107,11 @@
                     }, {
                         name: 'scatter3',
                         type: 'scatter',
+                        label: {
+                            emphasis: {
+                                show: true
+                            }
+                        },
                         symbolSize: function (val) {
                             return val[2] * 40;
                         },

test/timeline-finance.html

@@ -108,8 +108,14 @@ var option = {
         title: {
             subtext: '数据来自国家统计局'
         },
-        tooltip: {},
+        tooltip: {
+            trigger:'axis',
+            axisPointer: {
+                type: 'shadow'
+            }
+        },
         legend: {
+            align: 'right',
             x: 'right',
             data: ['第一产业', '第二产业', '第三产业', 'GDP', '金融', '房地产'],
             selected: {
@@ -118,19 +124,17 @@ var option = {
         },
         calculable : true,
         grid: {y:80, y2: 100},
-        xAxis: [
-            {
-                'type':'category',
-                'axisLabel':{'interval':0},
-                'data':[
-                    '北京','\n天津','河北','\n山西','内蒙古','\n辽宁','吉林','\n黑龙江',
-                    '上海','\n江苏','浙江','\n安徽','福建','\n江西','山东','\n河南',
-                    '湖北','\n湖南','广东','\n广西','海南','\n重庆','四川','\n贵州',
-                    '云南','\n西藏','陕西','\n甘肃','青海','\n宁夏','新疆'
-                ],
-                splitLine: {show: false}
-            }
-        ],
+        xAxis: {
+            'type':'category',
+            'axisLabel':{'interval':0},
+            'data':[
+                '北京','\n天津','河北','\n山西','内蒙古','\n辽宁','吉林','\n黑龙江',
+                '上海','\n江苏','浙江','\n安徽','福建','\n江西','山东','\n河南',
+                '湖北','\n湖南','广东','\n广西','海南','\n重庆','四川','\n贵州',
+                '云南','\n西藏','陕西','\n甘肃','青海','\n宁夏','新疆'
+            ],
+            splitLine: {show: false}
+        },
         yAxis: [
             {
                 type: 'value',

theme/dark.js

@@ -2,14 +2,10 @@ define(function() {
 
 var theme = {
     // 全图默认背景
-    backgroundColor: '#1b1b1b',
+    backgroundColor: '#3e4957',
 
     // 默认色板
-    color: [
-        '#FE8463','#9BCA63','#FAD860','#60C0DD','#0084C6',
-        '#D7504B','#C6E579','#26C0C0','#F0805A','#F4E001',
-        '#B5C334'
-    ],
+    color:  ['#d96666', '#8bced3', '#f0df95', '#b9dcae', '#76b8d1', '#ebe4af', '#bf9fc9', '#ea8092'],
 
     // 图表标题
     title: {