123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271 |
- var graphic = require("../../util/graphic");
- var ChartView = require("../../view/Chart");
- var DEFAULT_SMOOTH = 0.3;
- var ParallelView = ChartView.extend({
- type: 'parallel',
- init: function () {
-
- this._dataGroup = new graphic.Group();
- this.group.add(this._dataGroup);
-
- this._data;
-
- this._initialized;
- },
-
- render: function (seriesModel, ecModel, api, payload) {
- var dataGroup = this._dataGroup;
- var data = seriesModel.getData();
- var oldData = this._data;
- var coordSys = seriesModel.coordinateSystem;
- var dimensions = coordSys.dimensions;
- var seriesScope = makeSeriesScope(seriesModel);
- data.diff(oldData).add(add).update(update).remove(remove).execute();
- function add(newDataIndex) {
- var line = addEl(data, dataGroup, newDataIndex, dimensions, coordSys);
- updateElCommon(line, data, newDataIndex, seriesScope);
- }
- function update(newDataIndex, oldDataIndex) {
- var line = oldData.getItemGraphicEl(oldDataIndex);
- var points = createLinePoints(data, newDataIndex, dimensions, coordSys);
- data.setItemGraphicEl(newDataIndex, line);
- var animationModel = payload && payload.animation === false ? null : seriesModel;
- graphic.updateProps(line, {
- shape: {
- points: points
- }
- }, animationModel, newDataIndex);
- updateElCommon(line, data, newDataIndex, seriesScope);
- }
- function remove(oldDataIndex) {
- var line = oldData.getItemGraphicEl(oldDataIndex);
- dataGroup.remove(line);
- }
- if (!this._initialized) {
- this._initialized = true;
- var clipPath = createGridClipShape(coordSys, seriesModel, function () {
-
- setTimeout(function () {
- dataGroup.removeClipPath();
- });
- });
- dataGroup.setClipPath(clipPath);
- }
- this._data = data;
- },
- incrementalPrepareRender: function (seriesModel, ecModel, api) {
- this._initialized = true;
- this._data = null;
- this._dataGroup.removeAll();
- },
- incrementalRender: function (taskParams, seriesModel, ecModel) {
- var data = seriesModel.getData();
- var coordSys = seriesModel.coordinateSystem;
- var dimensions = coordSys.dimensions;
- var seriesScope = makeSeriesScope(seriesModel);
- for (var dataIndex = taskParams.start; dataIndex < taskParams.end; dataIndex++) {
- var line = addEl(data, this._dataGroup, dataIndex, dimensions, coordSys);
- line.incremental = true;
- updateElCommon(line, data, dataIndex, seriesScope);
- }
- },
- dispose: function () {},
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- remove: function () {
- this._dataGroup && this._dataGroup.removeAll();
- this._data = null;
- }
- });
- function createGridClipShape(coordSys, seriesModel, cb) {
- var parallelModel = coordSys.model;
- var rect = coordSys.getRect();
- var rectEl = new graphic.Rect({
- shape: {
- x: rect.x,
- y: rect.y,
- width: rect.width,
- height: rect.height
- }
- });
- var dim = parallelModel.get('layout') === 'horizontal' ? 'width' : 'height';
- rectEl.setShape(dim, 0);
- graphic.initProps(rectEl, {
- shape: {
- width: rect.width,
- height: rect.height
- }
- }, seriesModel, cb);
- return rectEl;
- }
- function createLinePoints(data, dataIndex, dimensions, coordSys) {
- var points = [];
- for (var i = 0; i < dimensions.length; i++) {
- var dimName = dimensions[i];
- var value = data.get(data.mapDimension(dimName), dataIndex);
- if (!isEmptyValue(value, coordSys.getAxis(dimName).type)) {
- points.push(coordSys.dataToPoint(value, dimName));
- }
- }
- return points;
- }
- function addEl(data, dataGroup, dataIndex, dimensions, coordSys) {
- var points = createLinePoints(data, dataIndex, dimensions, coordSys);
- var line = new graphic.Polyline({
- shape: {
- points: points
- },
- silent: true,
- z2: 10
- });
- dataGroup.add(line);
- data.setItemGraphicEl(dataIndex, line);
- return line;
- }
- function makeSeriesScope(seriesModel) {
- var smooth = seriesModel.get('smooth', true);
- smooth === true && (smooth = DEFAULT_SMOOTH);
- return {
- lineStyle: seriesModel.getModel('lineStyle').getLineStyle(),
- smooth: smooth != null ? smooth : DEFAULT_SMOOTH
- };
- }
- function updateElCommon(el, data, dataIndex, seriesScope) {
- var lineStyle = seriesScope.lineStyle;
- if (data.hasItemOption) {
- var lineStyleModel = data.getItemModel(dataIndex).getModel('lineStyle');
- lineStyle = lineStyleModel.getLineStyle();
- }
- el.useStyle(lineStyle);
- var elStyle = el.style;
- elStyle.fill = null;
- elStyle.stroke = data.getItemVisual(dataIndex, 'color');
- elStyle.opacity = data.getItemVisual(dataIndex, 'opacity');
- seriesScope.smooth && (el.shape.smooth = seriesScope.smooth);
- }
- function isEmptyValue(val, axisType) {
- return axisType === 'category' ? val == null : val == null || isNaN(val);
- }
- var _default = ParallelView;
- module.exports = _default;
|