echarts.js 15.4 KB
Newer Older
L
lang 已提交
1
/**
L
tweak  
lang 已提交
2
 * TODO visualCoding 的优先级
L
lang 已提交
3
 *      setTheme
4
 *      axis position 统一处理
L
lang 已提交
5
 *      规范 Symbol 配置和绘制, customPath
L
lang 已提交
6 7
 *
 *      每次 update 只刷新 model 变化的那些 component(需要做依赖收集)
L
lang 已提交
8
 */
L
lang 已提交
9 10
define(function (require) {

L
lang 已提交
11
    var GlobalModel = require('./model/Global');
L
lang 已提交
12
    var ExtensionAPI = require('./ExtensionAPI');
L
lang 已提交
13
    var CoordinateSystemManager = require('./CoordinateSystem');
L
lang 已提交
14

L
Update  
lang 已提交
15 16 17 18 19 20
    var ComponentModel = require('./model/Component');
    var SeriesModel = require('./model/Series');

    var ComponentView = require('./view/Component');
    var ChartView = require('./view/Chart');

L
lang 已提交
21
    var zrender = require('zrender');
L
lang 已提交
22
    var zrUtil = require('zrender/core/util');
L
lang 已提交
23

24 25
    var VISUAL_CODING_STAGES = ['echarts', 'chart', 'component'];

L
lang 已提交
26 27 28
    /**
     * @module echarts~ECharts
     */
L
lang 已提交
29 30
    var ECharts = function (dom, theme, opts) {
        opts = opts || {};
L
lang 已提交
31

L
lang 已提交
32 33 34 35 36
        /**
         * @type {HTMLDomElement}
         * @private
         */
        this._dom = dom;
L
lang 已提交
37 38 39 40
        /**
         * @type {module:zrender/ZRender}
         * @private
         */
L
lang 已提交
41 42 43
        this._zr = zrender.init(dom, {
            renderer: opts.renderer || 'canvas'
        });
L
lang 已提交
44

L
lang 已提交
45 46 47 48
        /**
         * @type {Object}
         * @private
         */
L
lang 已提交
49
        this._theme = zrUtil.clone(theme);
L
lang 已提交
50

L
lang 已提交
51 52 53 54
        /**
         * @type {Array.<module:echarts/view/Chart>}
         * @private
         */
L
lang 已提交
55
        this._chartsList = [];
L
lang 已提交
56 57 58 59 60

        /**
         * @type {Object.<string, module:echarts/view/Chart>}
         * @private
         */
L
lang 已提交
61 62
        this._chartsMap = {};

L
lang 已提交
63 64 65 66
        /**
         * @type {Array.<module:echarts/view/Component>}
         * @private
         */
L
lang 已提交
67
        this._componentsList = [];
L
lang 已提交
68 69 70 71 72

        /**
         * @type {Object.<string, module:echarts/view/Component>}
         * @private
         */
L
lang 已提交
73 74
        this._componentsMap = {};

L
lang 已提交
75
        /**
L
lang 已提交
76
         * @type {module:echarts/ExtensionAPI}
L
lang 已提交
77 78
         * @private
         */
L
lang 已提交
79
        this._extensionAPI = new ExtensionAPI(this);
L
lang 已提交
80

L
lang 已提交
81 82 83 84
        /**
         * @type {module:echarts/CoordinateSystem}
         * @private
         */
L
lang 已提交
85
        this._coordinateSystem = new CoordinateSystemManager();
L
lang 已提交
86

L
lang 已提交
87 88 89 90 91
        /**
         * Layout instances
         * @type {Array}
         * @private
         */
L
lang 已提交
92 93 94
        this._layouts = zrUtil.map(layoutClasses, function (Layout) {
            return new Layout();
        });
L
lang 已提交
95 96 97 98 99 100 101 102 103 104 105 106

        /**
         * @type {boolean}
         * @private
         */
        this._needsUpdate = false;

        this._zr.animation.on('frame', function () {
            if (this._needsUpdate) {
                this.updateImmediately();
            }
        }, this);
L
lang 已提交
107 108 109 110
    };

    ECharts.prototype = {

L
lang 已提交
111 112 113 114
        getDom: function () {
            return this._dom;
        },

L
lang 已提交
115 116 117 118
        getZr: function () {
            return this._zr;
        },

L
lang 已提交
119
        setOption: function (option, notMerge) {
L
lang 已提交
120
            // PENDING
L
lang 已提交
121
            option = zrUtil.clone(option, true);
L
lang 已提交
122

L
lang 已提交
123
            var ecModel = this._model;
L
lang 已提交
124
            if (!ecModel || notMerge) {
L
lang 已提交
125 126 127 128
                ecModel = new GlobalModel(option, null, this._theme);
                this._model = ecModel;
            }
            else {
P
pah100 已提交
129
                ecModel.restoreData();
L
lang 已提交
130 131
                ecModel.mergeOption(option);
            }
L
lang 已提交
132

L
lang 已提交
133
            this._prepareComponents(ecModel);
L
lang 已提交
134

L
lang 已提交
135
            this._prepareCharts(ecModel);
L
lang 已提交
136 137

            this.updateImmediately();
L
lang 已提交
138 139
        },

L
lang 已提交
140 141 142 143 144 145 146
        setTheme: function (theme) {

        },

        /**
         * @return {number}
         */
L
lang 已提交
147 148 149
        getWidth: function () {
            return this._zr.getWidth();
        },
L
lang 已提交
150

L
lang 已提交
151 152 153
        /**
         * @return {number}
         */
L
lang 已提交
154 155 156 157 158
        getHeight: function () {
            return this._zr.getHeight();
        },

        update: function () {
L
lang 已提交
159
            this._needsUpdate = true;
L
lang 已提交
160 161
        },

P
pah100 已提交
162
        updateImmediately: function (event) {
L
lang 已提交
163
            console.time('update');
164

L
lang 已提交
165 166
            var ecModel = this._model;

P
pah100 已提交
167
            ecModel.restoreData();
L
lang 已提交
168

P
pah100 已提交
169 170 171 172
            // TODO
            // Save total ecModel here for undo/redo (after restoring data and before processing data).
            // Undo (restoration of total ecModel) can be carried out in 'action' or outside API call.

L
lang 已提交
173
            this._processData(ecModel);
L
lang 已提交
174

L
lang 已提交
175 176
            this._stackSeriesData(ecModel);

L
lang 已提交
177
            this._coordinateSystem.update(ecModel, this._extensionAPI);
L
lang 已提交
178

P
pah100 已提交
179
            this._doLayout(ecModel, event);
L
lang 已提交
180

181 182
            this._doVisualCoding(ecModel);

P
pah100 已提交
183
            this._doRender(ecModel, event);
L
lang 已提交
184 185

            this._needsUpdate = false;
186

L
lang 已提交
187
            console.timeEnd('update');
L
lang 已提交
188 189
        },

L
lang 已提交
190
        resize: function () {
L
lang 已提交
191
            // var ecModel = this._model;
L
lang 已提交
192

L
lang 已提交
193
            // this._coordinateSystem.resize(ecModel, this._extensionAPI);
L
lang 已提交
194

L
lang 已提交
195
            // this._doVisualCoding(ecModel);
L
lang 已提交
196

L
lang 已提交
197 198 199 200 201
            // this._doLayout(ecModel);

            // this._doRender(ecModel);

            this.updateImmediately();
L
lang 已提交
202 203
        },

P
pah100 已提交
204 205 206 207 208 209 210 211 212 213 214 215 216 217
        /**
         * @pubilc
         * @param {Object} event
         * @param {string} [event.type] Event type
         * @param {number} [event.from] From uid
         */
        dispatch: function (event) {
            var action = actions[event.type];
            if (action) {
                action(event, this._model);
                this.updateImmediately(event);
            }
        },

L
lang 已提交
218
        _prepareCharts: function (ecModel) {
L
lang 已提交
219

L
lang 已提交
220 221
            var chartsList = this._chartsList;
            var chartsMap = this._chartsMap;
L
lang 已提交
222
            var zr = this._zr;
L
lang 已提交
223 224 225 226 227 228

            for (var i = 0; i < chartsList.length; i++) {
                chartsList[i].__keepAlive = false;
            }

            ecModel.eachSeries(function (seriesModel, idx) {
P
pah100 已提交
229
                var id = seriesModel.uid;
L
lang 已提交
230 231

                var chart = chartsMap[id];
232 233
                if (!chart) {
                    var Clazz = ChartView.getClass(
234 235
                        ComponentModel.parseComponentType(seriesModel.type).sub
                    );
236 237
                    if (Clazz) {
                        chart = new Clazz();
L
lang 已提交
238
                        chart.init(ecModel, this._extensionAPI);
L
lang 已提交
239 240
                        chartsMap[id] = chart;
                        chartsList.push(chart);
L
lang 已提交
241
                        zr.add(chart.group);
L
lang 已提交
242 243 244 245 246 247
                    }
                    else {
                        // Error
                    }
                }

L
lang 已提交
248 249
                chart.__keepAlive = true;
                chart.__id = id;
L
lang 已提交
250 251
            }, this);

L
lang 已提交
252 253 254
            for (var i = 0; i < chartsList.length;) {
                var chart = chartsList[i];
                if (! chart.__keepAlive) {
L
lang 已提交
255
                    zr.remove(chart.group);
L
lang 已提交
256
                    chart.dispose(this._extensionAPI);
L
lang 已提交
257 258
                    chartsList.splice(i, 1);
                    delete chartsMap[chart.__id];
L
lang 已提交
259 260 261 262
                }
                else {
                    i++;
                }
263
            }
L
lang 已提交
264 265
        },

L
lang 已提交
266
        _prepareComponents: function (ecModel) {
L
lang 已提交
267 268 269 270 271 272 273 274

            var componentsMap = this._componentsMap;
            var componentsList = this._componentsList;

            for (var i = 0; i < componentsList.length; i++) {
                componentsList[i].__keepAlive = true;
            }

P
pah100 已提交
275
            ecModel.eachComponent(function (componentType, componentModel) {
276 277 278 279
                if (componentType === 'series') {
                    return;
                }

P
pah100 已提交
280
                var id = componentModel.uid;
281 282 283
                var component = componentsMap[id];
                if (!component) {
                    // Create and add component
P
pah100 已提交
284 285 286
                    var Clazz = ComponentView.getClass(
                        componentType, componentModel.option.type
                    );
L
lang 已提交
287

288 289
                    if (Clazz) {
                        component = new Clazz();
L
lang 已提交
290
                        component.init(ecModel, this._extensionAPI);
L
lang 已提交
291
                        componentsMap[id] = component;
L
lang 已提交
292
                        componentsList.push(component);
L
lang 已提交
293 294

                        this._zr.add(component.group);
L
lang 已提交
295
                    }
296 297 298 299 300
                }
                component.__id = id;
                component.__keepAlive = true;
                // Used in rendering
                component.__model = componentModel;
L
lang 已提交
301 302 303 304 305 306
            }, this);

            for (var i = 0; i < componentsList.length;) {
                var component = componentsList[i];
                if (! component.__keepAlive) {
                    this._zr.remove(component.group);
L
lang 已提交
307
                    component.dispose(this._extensionAPI);
L
lang 已提交
308 309
                    componentsList.splice(i, 1);
                    delete componentsMap[component.__id];
L
lang 已提交
310 311
                }
                else {
L
lang 已提交
312
                    i++;
L
lang 已提交
313
                }
314
            }
L
lang 已提交
315 316
        },

L
lang 已提交
317 318 319 320 321 322
        /**
         * Processor data in each series
         *
         * @param {module:echarts/model/Global} ecModel
         * @private
         */
L
lang 已提交
323
        _processData: function (ecModel) {
L
lang 已提交
324
            zrUtil.each(dataProcessorFuncs, function (processor) {
L
lang 已提交
325 326
                processor(ecModel);
            });
L
lang 已提交
327 328
        },

L
lang 已提交
329 330 331 332 333 334 335 336
        /**
         * @private
         */
        _stackSeriesData: function (ecModel) {
            var stackedDataMap = {};
            ecModel.eachSeries(function (series) {
                var stack = series.get('stack');
                var data = series.getData();
L
lang 已提交
337
                if (stack && data.type === 'list') {
L
lang 已提交
338 339
                    var previousStack = stackedDataMap[stack];
                    if (previousStack) {
L
lang 已提交
340
                        data.stackedOn = previousStack;
L
lang 已提交
341 342 343 344 345 346
                    }
                    stackedDataMap[stack] = data;
                }
            });
        },

L
lang 已提交
347 348 349 350 351 352
        /**
         * Layout before each chart render there series after visual coding and data processing
         *
         * @param {module:echarts/model/Global} ecModel
         * @private
         */
P
pah100 已提交
353
        _doLayout: function (ecModel, event) {
L
Add pie  
lang 已提交
354
            var api = this._extensionAPI;
L
lang 已提交
355
            zrUtil.each(this._layouts, function (layout) {
L
Add pie  
lang 已提交
356
                layout.update(ecModel, api, event);
357 358
            });
            zrUtil.each(layoutFuncs, function (layout) {
L
Add pie  
lang 已提交
359
                layout(ecModel, api, event);
L
lang 已提交
360 361 362 363 364 365 366 367 368 369
            });
        },

        /**
         * Code visual infomation from data after data processing
         *
         * @param {module:echarts/model/Global} ecModel
         * @private
         */
        _doVisualCoding: function (ecModel) {
370 371 372 373
            zrUtil.each(VISUAL_CODING_STAGES, function (stage) {
                zrUtil.each(visualCodingFuncs[stage] || [], function (visualCoding) {
                    visualCoding(ecModel);
                });
L
lang 已提交
374 375 376 377 378 379
            });
        },

        /**
         * Render each chart and component
         */
P
pah100 已提交
380
        _doRender: function (ecModel, event) {
L
lang 已提交
381
            var api = this._extensionAPI;
L
lang 已提交
382
            // Render all components
L
lang 已提交
383
            zrUtil.each(this._componentsList, function (component) {
L
lang 已提交
384 385 386 387 388 389 390
                var componentModel = component.__model;
                component.render(componentModel, ecModel, api, event);

                var z = componentModel.get('z');
                var zlevel = componentModel.get('zlevel');
                // Set z and zlevel
                component.group.traverse(function (el) {
L
lang 已提交
391 392
                    z != null && (el.z = z);
                    zlevel != null && (el.zlevel = zlevel);
L
lang 已提交
393
                });
L
lang 已提交
394
            }, this);
P
pah100 已提交
395

L
lang 已提交
396
            zrUtil.each(this._chartsList, function (chart) {
397
                chart.__keepAlive = false;
L
lang 已提交
398
            }, this);
P
pah100 已提交
399

L
lang 已提交
400
            // Render all charts
L
lang 已提交
401
            ecModel.eachSeries(function (seriesModel, idx) {
P
pah100 已提交
402
                var id = seriesModel.uid;
L
lang 已提交
403
                var chart = this._chartsMap[id];
404
                chart.__keepAlive = true;
P
pah100 已提交
405
                chart.render(seriesModel, ecModel, api, event);
L
lang 已提交
406 407 408 409 410

                var z = seriesModel.get('z');
                var zlevel = seriesModel.get('zlevel');
                // Set z and zlevel
                chart.group.traverse(function (el) {
L
lang 已提交
411 412
                    z != null && (el.z = z);
                    zlevel != null && (el.zlevel = zlevel);
L
lang 已提交
413
                });
L
lang 已提交
414
            }, this);
P
pah100 已提交
415

416 417 418 419 420 421
            // Remove groups of charts
            zrUtil.each(this._chartsList, function (chart) {
                if (!chart.__keepAlive) {
                    chart.remove();
                }
            }, this);
L
lang 已提交
422 423 424 425 426 427 428 429 430 431 432 433 434 435 436
        },

        dispose: function () {
            zrUtil.each(this._components, function (component) {
                component.dispose();
            });
            zrUtil.each(this._charts, function (chart) {
                chart.dispose();
            });

            this.zr.dispose();
        }
    };


L
lang 已提交
437
    var dataProcessorFuncs = [];
L
lang 已提交
438

P
pah100 已提交
439 440
    var actions = [];

L
lang 已提交
441 442
    var layoutClasses = [];

443 444
    var layoutFuncs = [];

445
    var visualCodingFuncs = {};
L
lang 已提交
446

L
lang 已提交
447 448 449 450 451
    /**
     * @module echarts
     */
    var echarts = {

L
lang 已提交
452 453
        init: function (dom, theme, opts) {
            return new ECharts(dom, theme, opts);
L
lang 已提交
454 455
        },

L
lang 已提交
456 457 458 459 460 461
        /**
         * @param {Function}
         */
        registerProcessor: function (processorFunc) {
            if (zrUtil.indexOf(dataProcessorFuncs, processorFunc) < 0) {
                dataProcessorFuncs.push(processorFunc);
L
lang 已提交
462
            }
L
lang 已提交
463 464
        },

P
pah100 已提交
465
        /**
466 467 468 469 470 471 472
         * Usage:
         * registerAction('someAction', 'someEvent', function () { ... });
         * registerAction('someAction', function () { ... });
         *
         * @param {string} actionName
         * @param {string=} eventName Can be ignored
         * @param {Function=} action
P
pah100 已提交
473
         */
474 475 476 477 478
        registerAction: function (actionName, eventName, action) {
            if (typeof eventName === 'function') {
                action = eventName;
                eventName = null;
            }
P
pah100 已提交
479 480 481
            if (!actions[actionName]) {
                actions[actionName] = action;
            }
482 483
            // TODO
            // event
P
pah100 已提交
484 485
        },

L
lang 已提交
486 487 488 489
        /**
         * @param {string} type
         * @param {*} CoordinateSystem
         */
L
lang 已提交
490
        registerCoordinateSystem: function (type, CoordinateSystem) {
L
lang 已提交
491 492 493
            CoordinateSystemManager.register(type, CoordinateSystem);
        },

L
lang 已提交
494 495 496
        /**
         * @param {*} layout
         */
497
        registerLayout: function (layout, isFactory) {
L
tweak  
lang 已提交
498
            // PENDING All functions ?
499 500 501 502 503 504 505 506 507
            if (isFactory) {
                if (zrUtil.indexOf(layoutClasses, layout) < 0) {
                    layoutClasses.push(layout);
                }
            }
            else {
                if (zrUtil.indexOf(layoutFuncs, layout) < 0) {
                    layoutFuncs.push(layout);
                }
L
lang 已提交
508 509 510
            }
        },

511 512 513 514 515 516
        registerVisualCoding: function (stage, visualCodingFunc) {
            if (zrUtil.indexOf(VISUAL_CODING_STAGES, stage) < 0) {
                throw new Error('stage should be one of ' + VISUAL_CODING_STAGES);
            }
            var funcs = visualCodingFuncs[stage] || (visualCodingFuncs[stage] = []);
            funcs.push(visualCodingFunc);
L
Update  
lang 已提交
517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532
        },

        /**
         * @param {Object} opts
         */
        extendChartView: function (opts) {
            return ChartView.extend(opts);
        },

        /**
         * @param {Object} opts
         */
        extendComponentModel: function (opts) {
            return ComponentModel.extend(opts);
        },

P
pah100 已提交
533 534 535 536 537 538 539
        /**
         * @param {Object} opts
         */
        extendSeriesModel: function (opts) {
            return SeriesModel.extend(opts);
        },

L
Update  
lang 已提交
540 541 542 543 544
        /**
         * @param {Object} opts
         */
        extendComponentView: function (opts) {
            return ComponentView.extend(opts);
L
lang 已提交
545
        }
L
lang 已提交
546 547
    };

548
    echarts.registerVisualCoding('echarts', require('./visual/defaultColor'));
L
lang 已提交
549

L
lang 已提交
550 551
    return echarts;
});