提交 4753d29e 编写于 作者: P pah100

parallel update

上级 3cdbd5ed
define(function(require) {
var createListFromArray = require('../helper/createListFromArray');
var List = require('../../data/List');
var zrUtil = require('zrender/core/util');
var SeriesModel = require('../../model/Series');
return SeriesModel.extend({
......@@ -10,7 +11,18 @@ define(function(require) {
dependencies: ['parallel'],
getInitialData: function (option, ecModel) {
return createListFromArray(option.data, this, ecModel);
var dimensions = ecModel.getComponent(
'parallel', this.get('parallelIndex')
).get('dimensions');
dimensions = zrUtil.map(dimensions, function (dim) {
return dim.name;
});
var list = new List(dimensions, this);
list.initData(option.data);
return list;
},
defaultOption: {
......
......@@ -5,7 +5,7 @@ define(function (require) {
var ParallelView = require('../../view/Chart').extend({
type: 'pie',
type: 'parallel',
init: function () {
this._dataGroup = new graphic.Group();
......@@ -19,12 +19,17 @@ define(function (require) {
var group = this.group;
var coordSys = seriesModel.coordinateSystem;
var dimensions = coordSys.dimensions;
var dimensionNames = zrUtil.map(dimensions, function (dim) {
return dim.name;
});
var hasAnimation = ecModel.get('animation');
var isFirstRender = !oldData;
var lineStyleModel = seriesModel.getModel('lineStyle.normal');
var lineStyle = lineStyleModel.getLineStyle();
var globalColors = ecModel.get('color');
var defaultColor = globalColors[seriesModel.seriesIndex % globalColors.length];
var lineStyle = zrUtil.defaults(lineStyleModel.getLineStyle(), {stroke: defaultColor});
// var onSectorClick = zrUtil.curry(
// updateDataSelected, this.uid, seriesModel, hasAnimation, api
......@@ -34,7 +39,7 @@ define(function (require) {
data.diff(oldData)
.add(function (dataIndex) {
var values = data.getValues(dimensions, dataIndex);
var values = data.getValues(dimensionNames, dataIndex);
var els = createEls(
dataGroup, values, dimensions, coordSys,
......@@ -156,18 +161,37 @@ define(function (require) {
var els = [];
for (var i = 0, len = dimensions.length - 1; i < len; i++) {
var dimA = dimensions[i];
var dimB = dimensions[i + 1];
var valueA = values[i];
var valueB = values[i + 1];
if (isEmptyValue(valueA, dimA) || isEmptyValue(valueB, dimB)) {
continue;
}
var points = [
coordSys.dataToPoint(values[i], dimensions[i]),
coordSys.dataToPoint(values[i + 1], dimensions[i + 1])
coordSys.dataToPoint(valueA, dimA.name),
coordSys.dataToPoint(valueB, dimB.name)
];
dataGroup.add(els[i] = new graphic.Polyline({
points: points,
style: lineStyle
shape: {points: points},
style: lineStyle,
silent: true
}));
}
return els;
}
// FIXME
// 公用方法?
function isEmptyValue(val, dim) {
return dim.axisType === 'category'
? val == null
: (val == null || isNaN(val)); // axisType === 'value'
}
// function updateEls(els, values, dimensions, coordSys) {
// // FIXME
// // update animation
......
......@@ -17,9 +17,13 @@ define(function (require) {
return;
}
var coordSys = ecModel.getComponent('parallel', axisModel.get('parallelIndex'));
var coordSys = ecModel.getComponent(
'parallel', axisModel.get('parallelIndex')
).coordinateSystem;
var axisBuilder = new AxisBuilder(coordSys.getAxisLayout(axisModel.axis.dim));
var axisBuilder = new AxisBuilder(
axisModel, coordSys.getAxisLayout(axisModel.axis.dim)
);
zrUtil.each(elementList, function (name) {
if (axisModel.get(name +'.show')) {
......
define(function(require) {
require('../coord/parallel/parallelCreator');
require('../coord/parallel/parallelModel');
require('./parallelAxis');
var echarts = require('../echarts');
......
......@@ -45,8 +45,6 @@ define(function(require) {
this._rect;
this._init(parallelModel, ecModel, api);
this.resize(parallelModel, api);
}
Parallel.prototype = {
......@@ -77,11 +75,11 @@ define(function(require) {
var dim = dimensions[idx];
var axis = this._axesMap[dim] = new ParallelAxis(
dim,
var axis = this._axesMap[dim.name] = new ParallelAxis(
dim.name,
axisHelper.createScaleByModel(axisModel),
[0, 0],
axisModel.get('type')
dim.axisType // FIXME 检查和 axisModel.get('type') 的不一样
);
var isCategory = axis.type === 'category';
......@@ -94,7 +92,27 @@ define(function(require) {
// Inject axisModel into axis
axis.model = axisModel;
axisHelper.niceScaleExtent(axis, axisModel);
}, this);
this._updateAxesFromSeries(parallelModel, ecModel);
},
/**
* Update properties from series
* @private
*/
_updateAxesFromSeries: function (parallelModel, ecModel) {
ecModel.eachSeries(function (seriesModel) {
if (!parallelModel.containsSeries(seriesModel, ecModel)) {
return;
}
var data = seriesModel.getData();
each(this.dimensions, function (dim) {
this._axesMap[dim.name].scale.unionExtent(data.getDataExtent(dim.name));
}, this);
}, this);
},
......@@ -136,26 +154,27 @@ define(function(require) {
var sizeIdx = layout === 'horizontal' ? 0 : 1;
var layoutLength = size[sizeIdx];
var axisLength = size[1 - sizeIdx];
var axisExtent = [0, axisLength];
each(axes, function (axis) {
var idx = axis.inverse ? 1 : 0;
axis.setExtent(axisExtent[idx], axisExtent[1 - idx]);
axisHelper.niceScaleExtent(axis, axis.model);
});
each(dimensions, function (dim, idx) {
var axis = axes[dim];
var axis = axes[dim.name];
var pos = layoutLength * idx / (dimensions.length - 1);
var inverse = axis.inverse ? 'inverse' : 'forward';
var positionTable = {
horizontal: {
x: pos,
y: {forward: layoutLength, inverse: 0}
x: {forward: pos, inverse: pos},
y: {forward: axisLength, inverse: 0}
},
vertical: {
x: {forward: 0, inverse: layoutLength},
y: pos
x: {forward: 0, inverse: axisLength},
y: {forward: pos, inverse: pos}
}
};
var rotationTable = {
......@@ -179,7 +198,7 @@ define(function(require) {
// TODO
// 根据axis order 更新 dimensions顺序。
this._axesLayout[dim] = {
this._axesLayout[dim.name] = {
position: position,
rotation: rotation,
transform: transform
......@@ -209,7 +228,7 @@ define(function(require) {
*/
axisCoordToPoint: function (coord, dim) {
var axisLayout = this._axesLayout[dim];
var point = [0, coord];
var point = [coord, 0];
vector.applyTransform(point, point, axisLayout.transform);
return point;
},
......
define(function(require) {
var zrUtil = require('zrender/core/util');
var Component = require('../../model/Component');
require('./AxisModel');
require('../../echarts').extendComponentModel({
var VALID_DIM_TYPES = {value: 1, category: 1};
Component.extend({
type: 'parallel',
......@@ -18,6 +21,7 @@ define(function(require) {
dimensions: 5, // {number} 表示 dim数,如设为 3 会自动转化成 ['dim0', 'dim1', 'dim2']
// {Array.<string>} 表示哪些dim,如 ['dim3', 'dim2']
// {Array.<Object>} 表示哪些dim,如 [{name: 'dim3', axisType: 'category', ...]
parallelAxisIndex: null, // {Array.<number>} 表示引用哪些axis,如 [2, 1, 4]
// {Object} 表示 mapping,如{dim1: 3, dim3: 1, others: 0},others不设则自动取0
......@@ -27,16 +31,25 @@ define(function(require) {
y: 60,
x2: 80,
y2: 60,
// width: {totalWidth} - x - x2,
// height: {totalHeight} - y - y2,
layout: 'horizontal', // 'horizontal' or 'vertical'
// width: {totalWidth} - x - x2,
// height: {totalHeight} - y - y2,
backgroundColor: 'rgba(0,0,0,0)',
borderWidth: 0,
borderColor: '#ccc'
},
/**
* @override
*/
init: function (option, parentModel, ecModel, dependentModels, index) {
Component.prototype.init.apply(this, arguments);
this.mergeOption({});
},
/**
* @override
*/
......@@ -58,6 +71,16 @@ define(function(require) {
thisOption.dimensions = dimensions;
thisOption.parallelAxisIndex = parallelAxisIndex;
},
/**
* Whether series is in this coordinate system.
*/
containsSeries: function (seriesModel, ecModel) {
var parallelIndex;
return seriesModel.get('coordinateSystem') === 'parallel'
&& (parallelIndex = seriesModel.get('parallelIndex')) != null
&& ecModel.getComponent('parallel', parallelIndex) === this;
}
});
......@@ -74,6 +97,17 @@ define(function(require) {
}
}
for (var i = 0; i < dimensions.length; i++) {
var dim = dimensions[i];
// dim might be string, represent dim name.
if (!zrUtil.isObject(dim)) {
dim = dimensions[i] = {name: dim};
}
if (!VALID_DIM_TYPES[dim.axisType]) {
dim.axisType = 'value';
}
}
return dimensions;
}
......@@ -90,7 +124,7 @@ define(function(require) {
var otherAxisIndex = 0; // Others default 0.
zrUtil.each(mapping, function (axisIndex, dim) {
var dimIndex = zrUtil.indexOf(dimensions, dim);
var dimIndex = getDimIndex(dimensions, dim);
if (dimIndex >= 0) {
parallelAxisIndex[dimIndex] = dim;
}
......@@ -110,6 +144,15 @@ define(function(require) {
return parallelAxisIndex;
}
function getDimIndex(dimensions, dimName) {
for (var i = 0; i < dimensions.length; i++) {
if (dimensions[i] === dimName) {
return i;
}
}
return -1;
}
function completeParallelAxisIndexWhenNone(parallelAxisIndex, dimensions) {
if (!zrUtil.isObject(parallelAxisIndex)
|| !zrUtil.isArray(parallelAxisIndex)
......
......@@ -10,12 +10,14 @@ define(function (require) {
// {
// axisLine: [],
// axisLabel: []
// parallelIndex: 0 // ??? 是axis引用到coord,还是coord引用到axis?
// }
// ],
// parallel: [ // 如果没有写parallel则自动创建。FIXME 是不是应该强制用户写,自动创建埋bug?
// {
// dimensions: 3 // number表示 count, 根据dimensionCount创建 []。
// ['dim1', 'dim3'], //
// ['dim1', 'dim3', {name: 'dim0', type: 'category'}], // FIXME 某列是category怎么指定?
// // 默认dim type 是value。
//
// parallelAxisIndex: [3, 1], // TODO 如果不设置则根据parallelAxisMap创建此项,
// // 如果没有parallelAxisMap则顺序引用。
......@@ -29,7 +31,7 @@ define(function (require) {
// ],
// series: [
// {
// parallelIndex: 0, // 缺省则0
// parallelIndex: 0, // 缺省则0。series引用到axis,还是引用到coord?
// data: [
// [22, 23, 34, 6, 19],
// [22, 23, 34, 6, 19]
......
......@@ -31,11 +31,12 @@
'data/aqi/BJdata',
'data/aqi/GZdata',
'data/aqi/SHdata',
'zrender/core/util',
'echarts',
'echarts/chart/parallel',
// 'echarts/component/legend',
'echarts/component/parallel',
], function (dataBJ, dataGZ, dataSH, echarts) {
], function (dataBJ, dataGZ, dataSH, zrUtil, echarts) {
var chart = echarts.init(document.getElementById('main'), null, {
renderer: 'canvas'
......@@ -52,7 +53,7 @@
}
};
var axis = {
var baseAxis = {
type: 'value',
name: 'AQI指数',
nameLocation: 'end',
......@@ -61,6 +62,11 @@
color: '#fff',
fontSize: 20
},
axisLine: {
lineStyle: {
color: '#fff'
}
},
axisTick: {
lineStyle: {
color: '#777'
......@@ -76,10 +82,14 @@
}
};
var dimensions = 5;
var dimensionCount = 8;
var dimensions = [];
var parallelAxis = [];
var parallelAxisIndex = [];
for (var i = 0; i < dimensions.length; i++) {
for (var i = 0; i < dimensionCount; i++) {
dimensions.push('dim' + i);
var axis = zrUtil.clone(baseAxis, true);
axis.name = '指标' + i;
parallelAxis.push(axis);
parallelAxisIndex.push(i);
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册