Skip to content

E
echarts

alon@wen / echarts
与 Fork 源项目一致

从无法访问的项目Fork

通知 1
Star 1
Fork 0
E
echarts

体验新版 GitCode，发现更多精彩内容 >>

提交 e24dba70 编写于 作者: P pah100
浏览文件
操作

udpate datazoom, list, action

上级 da4fed1f
隐藏空白更改
内联 并排
Showing with 1122 addition and 468 deletion
src/ExtensionAPI.js
浏览文件 @ e24dba70
......@@ -5,7 +5,7 @@ define(function(require) {
var zrUtil = require('zrender/core/util');
var echartsAPIList = [
'getZr', 'update', 'getCoordinateSystem', 'getWidth', 'getHeight'
'getZr', 'getCoordinateSystem', 'getWidth', 'getHeight', 'dispatch'
];
function ExtensionAPI(echarts) {
......
src/chart/bar/BarView.js
浏览文件 @ e24dba70
......@@ -19,7 +19,7 @@ define(function (require) {
var data = seriesModel.getData();
data.diff(this._data)
.add(function (dataItem, idx) {
.add(function (dataItem, dataIndex) {
// 空数据
if (dataItem.getValue() == null) {
return;
......@@ -48,7 +48,7 @@ define(function (require) {
// Animation
rect.animateTo({
shape: layout
}, 1000, 300 * dataItem.dataIndex / data.elements.length, 'cubicOut');
}, 1000, 300 * dataIndex / data.count(), 'cubicOut');
})
.update(function (newData, oldData) {
var el = oldData.__el;
......
src/chart/line/LineView.js
浏览文件 @ e24dba70
......@@ -66,11 +66,13 @@ define(function(require) {
this._polyline = polyline;
}
else {
this._polyline.animateShape()
.when(500, {
points: points
})
.start('cubicOut');
// this._polyline.animateShape()
// .when(500, {
// points: points
// })
// .start('cubicOut');
this._polyline.shape.points = points;
this._polyline.dirty(true);
}
this._data = data;
......
src/chart/line/lineLayout.js
浏览文件 @ e24dba70
......@@ -5,6 +5,7 @@ define(function (require) {
ecModel.eachSeriesByType('line', function (lineSeries) {
var data = lineSeries.getData();
var coords = lineSeries.coordinateSystem.dataToCoords(data);
data.each(function (dataItem, idx) {
var coord = coords[idx];
var value = dataItem.getValue();
......
src/component/axis.js
浏览文件 @ e24dba70
......@@ -92,9 +92,7 @@ define(function(require) {
p1[0] = p2[0] = this._axisLinePosition;
}
api.subPixelOptimizeLine(p1, p2, lineWidth);
this.group.add(new api.Line({
this.group.add(new api.Line(api.subPixelOptimizeLine({
shape: {
x1: p1[0],
y1: p1[1],
......@@ -106,7 +104,7 @@ define(function(require) {
}, lineStyleModel.getLineStyle()),
z: axisModel.get('z'),
silent: true
}));
})));
},
/**
......@@ -144,7 +142,7 @@ define(function(require) {
|| i % (tickInterval + 1)
)
) {
continue
continue;
}
var tickCoord = ticksCoords[i];
......@@ -173,16 +171,18 @@ define(function(require) {
var p1 = [x, y];
var p2 = [x + offX, y + offY];
api.subPixelOptimizeLine(p1, p2, tickLineWidth);
// Tick line
tickLines.push(new api.Line({
tickLines.push(new api.Line(api.subPixelOptimizeLine({
shape: {
x1: p1[0],
y1: p1[1],
x2: p2[0],
y2: p2[1]
},
style: {
lineWidth: tickLineWidth
}
}));
})));
}
var tickEl = api.mergePath(tickLines, {
style: lineStyleModel.getLineStyle(),
......@@ -218,7 +218,7 @@ define(function(require) {
var labels;
if (axis.scale.type === 'ordinal') {
labels = zrUtil.map(ticks, zrUtil.bind(axis.scale.getItem, axis.scale));
labels = zrUtil.map(ticks, axis.scale.getItem, axis.scale);
}
else {
labels = ticks.slice();
......@@ -229,8 +229,8 @@ define(function(require) {
for (var i = 0; i < ticks.length; i++) {
// Default is false
showList[i] = false;
needsCheckTextSpace = false;
var tick = ticks[i];
// Only ordinal scale support label interval
if (axis.scale.type === 'ordinal') {
......@@ -239,14 +239,14 @@ define(function(require) {
}
if (isLabelIntervalFunction
&& !labelInterval(tick, axis.scale.getItem(tick))
|| tick % (labelInterval + 1)) {
|| tick % (labelInterval + 1)
) {
continue;
}
}
var x;
var y;
var tick = ticks[i];
var tickCoord = axis.dataToCoord(tick);
var labelTextAlign = 'center';
var labelTextBaseline = 'middle';
......@@ -353,18 +353,20 @@ define(function(require) {
p2[0] = gridRect.x + gridRect.width;
p2[1] = tickCoord;
}
api.subPixelOptimizeLine(p1, p2, lineWidth);
var colorIndex = (lineCount++) % lineColors.length;
splitLines[colorIndex] = splitLines[colorIndex] || [];
splitLines[colorIndex].push(new api.Line({
splitLines[colorIndex].push(new api.Line(api.subPixelOptimizeLine({
shape: {
x1: p1[0],
y1: p1[1],
x2: p2[0],
y2: p2[1]
},
style: {
lineWidth: lineWidth
}
}));
})));
}
// Simple optimization
......
src/component/dataZoom.js
浏览文件 @ e24dba70
......@@ -6,5 +6,6 @@ define(function (require) {
require('./dataZoom/DataZoomModel');
require('./dataZoom/DataZoomView');
require('./dataZoom/dataZoomProcessor');
require('./dataZoom/dataZoomAction');
});
\ No newline at end of file
src/component/dataZoom/DataZoomLayout.js 0 → 100644
浏览文件 @ e24dba70
define(function (require) {
var zrUtil = require('zrender/core/util');
var helper = require('./helper');
var retrieveValue = helper.retrieveValue;
var linearMap = require('../../util/number').linearMap;
var round = Math.round;
// Constants
var DEFAULT_LOCATION_EDGE_GAP = 2;
var DEFAULT_FILLER_SIZE = 30;
function DataZoomLayout(dataZoomModel, ecModel, api) {
/**
* @readOnly
*/
this.dataZoomModel = dataZoomModel;
/**
* @readOnly
*/
this.ecModel = ecModel;
/**
* @readOnly
*/
this.api = api;
/**
* @private
*/
this._orient = dataZoomModel.get('orient');
/**
* @readOnly
* @type {Object}
*/
this.layout = {
viewRange: {
// handle1 may less than handle2,
// so we dont naming them as 'start', 'end'
handle1: null,
handle2: null
},
/**
* {
* x: {number},
* y: {number},
* width: {number},
* height: {number}
* }
* @type {Object}
*/
location: {},
filler: {
shape: {}
},
startHandle: {
shape: {}
},
endHandle: {
shape: {}
},
startFrame: {
shape: {}
},
endFrame: {
shape: {}
}
};
}
DataZoomLayout.prototype = {
constructor: DataZoomLayout,
/**
* @public
*/
reset: function () {
this._initLocation();
this._initViewRange();
this.update();
},
/**
* @public
* @param {Object} dataZoomModel
* @param {Object} operation If empty, just re-calculate layout.
* @param {string} [operation.rangeArgs] ['start'] or ['end'] or ['start', 'end']
* @param {number} [operation.dx]
* @param {number} [operation.dy]
*/
update: function (operation) {
operation && this._updateViewRange(operation);
this._orient === 'horizontal'
? this._updateWidgetsLayoutHorizontally()
: this._updateWidgetsLayoutVertically();
},
/**
* @public
* @return {Object} {start, end}
*/
normalizeToRange: function () {
var viewRange = this.layout.viewRange;
var viewExtend = [0, this._getViewTotalLength()];
var percentExtent = [0, 100];
var range = {
start: linearMap(viewRange.handle1, viewExtend, percentExtent, true),
end: linearMap(viewRange.handle2, viewExtend, percentExtent, true)
};
// Auto exchange
if (range.start > range.end) {
range.start = [range.end, range.end = range.start][0];
}
return range;
},
/**
* @private
*/
_initLocation: function () {
var dataZoomModel = this.dataZoomModel;
var x;
var y;
var width;
var height;
// If some of x/y/width/height are not specified, auto-adapt according to target grid.
var gridRect = this._findGridRectForLocating();
if (this._orient === 'horizontal') { // Horizontal layout
width = retrieveValue(dataZoomModel.get('width'), gridRect.width);
height = retrieveValue(dataZoomModel.get('height'), DEFAULT_FILLER_SIZE);
x = retrieveValue(dataZoomModel.get('x'), gridRect.x);
y = retrieveValue(
dataZoomModel.get('y'),
(this.api.getHeight() - height - DEFAULT_LOCATION_EDGE_GAP)
);
}
else { // Vertical layout
width = retrieveValue(dataZoomModel.get('width'), DEFAULT_FILLER_SIZE);
height = retrieveValue(dataZoomModel.get('height'), gridRect.height);
x = retrieveValue(dataZoomModel.get('x'), DEFAULT_LOCATION_EDGE_GAP);
y = retrieveValue(dataZoomModel.get('y'), gridRect.y);
}
this.layout.location = {
x: x, y: y, width: width, height: height
};
},
/**
* @private
*/
_findGridRectForLocating: function () {
// Find the grid coresponding to the first axis referred by dataZoom.
var axisModel;
var dataZoomModel = this.dataZoomModel;
var ecModel = this.ecModel;
helper.eachAxisDim(function (dimNames) {
var axisIndices = dataZoomModel.get(dimNames.axisIndex);
if (!axisModel && axisIndices.length) {
axisModel = ecModel.getComponent(dimNames.axis, axisIndices[0]);
}
});
return ecModel
.getComponent('grid', axisModel.get('gridIndex'))
.coordinateSystem
.getRect();
},
/**
* @private
*/
_initViewRange: function () {
// Based on layout.location.
var range = this.dataZoomModel.getRange();
var viewExtend = [0, this._getViewTotalLength()];
var percentExtent = [0, 100];
this.layout.viewRange = {
handle1: round(linearMap(range.start, percentExtent, viewExtend, true)),
handle2: round(linearMap(range.end, percentExtent, viewExtend, true))
};
},
/**
* @private
* @param {Object} dataZoomModel
* @param {Object} operation
* @param {string} [operation.rangeArgs] ['handle1'] or ['handle2'] or ['handle1', 'handle2']
* @param {number} [operation.dx]
* @param {number} [operation.dy]
*/
_updateViewRange: function (operation) {
var delta = retrieveValue(
this._orient === 'horizontal' ? operation.dx : operation.dy,
0
);
var standardValue = delta > 0 ? Number.MIN_VALUE : Number.MAX_VALUE;
var methods = ['min', 'max'];
var methodIndex = delta > 0 ? 1 : 0;
var edgeValue = delta > 0 ? this._getViewTotalLength() : 0;
zrUtil.each(operation.rangeArgs, function (rangeArg) {
var value = this.layout.viewRange[rangeArg];
standardValue = Math[methods[methodIndex]](standardValue, value);
}, this);
var standardValueResult = Math[methods[1 - methodIndex]](standardValue + delta, edgeValue);
delta = standardValueResult - standardValue;
zrUtil.each(operation.rangeArgs, function (rangeArg) {
this.layout.viewRange[rangeArg] += delta;
}, this);
},
/**
* @private
*/
_getViewTotalLength: function () {
var location = this.layout.location;
return this._orient === 'horizontal' ? location.width : location.height;
},
/**
* @private
*/
_updateWidgetsLayoutHorizontally: function () {
// Based on layout.viewRange and this.layout.location.
var dataZoomModel = this.dataZoomModel;
var layout = this.layout;
var location = layout.location;
var handleSize = dataZoomModel.get('handleSize');
var viewRange = layout.viewRange;
var viewRangeStart = Math.min(viewRange.handle1, viewRange.handle2);
var viewRangeEnd = Math.max(viewRange.handle1, viewRange.handle2);
var fillerStyle = layout.filler.shape = {
x: location.x + viewRangeStart + handleSize,
y: location.y,
width: viewRangeEnd - viewRangeStart - handleSize * 2,
height: location.height
};
var handleBase = {
shape: {
y: location.y,
width: handleSize,
height: location.height
}
};
var handles = [
zrUtil.merge(
{
shape: {x: fillerStyle.x - handleSize}
},
handleBase
),
zrUtil.merge(
{
shape: {x: fillerStyle.x + fillerStyle.width}
},
handleBase
)
];
var handle1Index = viewRange.handle1 > viewRange.handle2 ? 1 : 0;
layout.handle1 = handles[handle1Index];
layout.handle2 = handles[1 - handle1Index];
var startHandleShape = handles[0].shape;
var endHandleShape = handles[1].shape;
layout.startFrame = {
shape: {
x: location.x,
y: location.y,
width: startHandleShape.x - location.x,
height: location.height
}
};
layout.endFrame = {
shape: {
x: endHandleShape.x + endHandleShape.width,
y: location.y,
width: location.x + location.width
- (endHandleShape.x + endHandleShape.width),
height: location.height
}
};
},
/**
* @private
*/
_updateWidgetsLayoutVertically: function () {
// Based on layout.viewRange and this.layout.location.
var dataZoomModel = this.dataZoomModel;
var layout = this.layout;
var location = layout.location;
var handleSize = dataZoomModel.get('handleSize');
var viewRange = layout.viewRange;
var viewRangeStart = Math.min(viewRange.handle1, viewRange.handle2);
var viewRangeEnd = Math.max(viewRange.handle1, viewRange.handle2);
var fillerStyle = layout.filler.shape = {
x: location.x,
y: location.y + viewRangeStart + handleSize,
width: location.width,
height: viewRangeEnd - viewRangeStart - handleSize * 2
};
var handleBase = {
shape: {
x: location.x,
width: location.width,
height: handleSize
}
};
var handles = [
zrUtil.merge(
{
shape: {y: fillerStyle.y - handleSize}
},
handleBase
),
layout.endHandle = zrUtil.merge(
{
shape: {y: fillerStyle.y + fillerStyle.height}
},
handleBase
)
];
var handle1Index = viewRange.handle1 > viewRange.handle2 ? 1 : 0;
layout.handle1 = handles[handle1Index];
layout.handle2 = handles[1 - handle1Index];
var startHandleShape = handles[0].shape;
var endHandleShape = handles[1].shape;
layout.startFrame = {
shape: {
x: location.x,
y: location.y,
width: location.width,
height: startHandleShape.y - location.y
}
};
layout.endFrame = {
shape: {
x: location.x,
y: endHandleShape.y + endHandleShape.height,
width: location.width,
height: location.y + location.height
- (endHandleShape.y + endHandleShape.height)
}
};
}
};
return DataZoomLayout;
});
\ No newline at end of file
src/component/dataZoom/DataZoomModel.js
浏览文件 @ e24dba70
......@@ -14,12 +14,43 @@ define(function(require) {
dependencies: ['xAxis', 'yAxis', 'series'],
/**
* @protected
*/
defaultOption: {
zlevel: 0, // 一级层叠
z: 4, // 二级层叠
show: false,
orient: 'horizontal', // 布局方式，默认为水平布局，可选为：
// 'horizontal' ¦ 'vertical'
// x: {number}, // 水平安放位置，默认为根据grid参数适配，可选为：
// {number}（x坐标，单位px）
// y: {number}, // 垂直安放位置，默认为根据grid参数适配，可选为：
// {number}（y坐标，单位px）
// width: {number}, // 指定宽度，横向布局时默认为根据grid参数适配
// height: {number}, // 指定高度，纵向布局时默认为根据grid参数适配
backgroundColor: 'rgba(0,0,0,0)', // 背景颜色
dataBackgroundColor: '#eee', // 数据背景颜色
fillerColor: 'rgba(144,197,237,0.2)', // 填充颜色
handleColor: 'rgba(70,130,180,0.8)', // 手柄颜色
handleSize: 10,
showDetail: true,
// xAxisIndex: [], // 默认控制所有横向类目
// yAxisIndex: [], // 默认控制所有横向类目
start: 0, // 默认为0
end: 100, // 默认为全部 100%
start2: 0, // 默认为0
end2: 100, // 默认为全部 100%
realtime: true
// zoomLock: false // 是否锁定选择区域大小
},
/**
* @override
*/
init: function (option, parentModel, ecModel) {
this.mergeDefaultAndTheme(option, ecModel);
this.mergeOption();
this.mergeOption({});
},
/**
......@@ -48,12 +79,12 @@ define(function(require) {
var thisOption = this.option;
var noAxisDefined = true;
helper.eachAxisDim(function (names) {
helper.eachAxisDim(function (dimNames) {
// Overlap these arrays but not merge.
var axisIndices = helper.toArray(helper.retrieveValue(
newOption[names.axisIndex], thisOption[names.axisIndex], []
newOption[dimNames.axisIndex], thisOption[dimNames.axisIndex], []
));
var axisModels = this.dependentModels[names.axis];
var axisModels = this.dependentModels[dimNames.axis];
// If not specified, set default.
if (axisModels.length && !axisIndices.length) {
......@@ -63,7 +94,7 @@ define(function(require) {
}
}
}
thisOption[names.axisIndex] = axisIndices;
thisOption[dimNames.axisIndex] = axisIndices;
if (axisIndices.length) {
noAxisDefined = false;
......@@ -80,9 +111,9 @@ define(function(require) {
// both xAxis and yAxis which type is 'value'.
this.ecModel.eachSeries(function (seriesModel) {
if (this._isSeriesHasAllAxesTypeOf(seriesModel, 'value')) {
helper.eachAxisDim(function (names) {
var axisIndices = thisOption[names.axisIndex];
var axisIndex = seriesModel.get(names.axisIndex);
helper.eachAxisDim(function (dimNames) {
var axisIndices = thisOption[dimNames.axisIndex];
var axisIndex = seriesModel.get(dimNames.axisIndex);
if (zrUtil.indexOf(axisIndices, axisIndex) < 0) {
axisIndices.push(axisIndex);
}
......@@ -98,9 +129,9 @@ define(function(require) {
// 例如series.type === scatter时。
var is = true;
helper.eachAxisDim(function (names) {
var seriesAxisIndex = seriesModel.get(names.axisIndex);
var axisModel = this.dependentModels[names.axis][seriesAxisIndex];
helper.eachAxisDim(function (dimNames) {
var seriesAxisIndex = seriesModel.get(dimNames.axisIndex);
var axisModel = this.dependentModels[dimNames.axis][seriesAxisIndex];
if (!axisModel || axisModel.get('type') !== axisType) {
is = false;
......@@ -122,9 +153,9 @@ define(function(require) {
// When only xAxisIndex or only yAxisIndex is specified, start/end controls them.
// targetDim === false means that both xAxisIndex and yAxisIndex are specified.
var targetDim;
helper.eachAxisDim(function (names) {
if (thisOption[names.axisIndex].length) {
targetDim = targetDim !== false ? false : names.dim;
helper.eachAxisDim(function (dimNames) {
if (thisOption[dimNames.axisIndex].length) {
targetDim = targetDim !== false ? false : dimNames.dim;
}
});
......@@ -136,7 +167,7 @@ define(function(require) {
targetDim2 = targetDim === 'x' ? 'y' : 'x';
}
var optAttrs = [];
var optAttrs = {};
optAttrs[targetDim] = {start: 'start', end: 'end'};
targetDim2 && (optAttrs[targetDim2] = {start: 'start2', end: 'end2'});
......@@ -156,13 +187,45 @@ define(function(require) {
});
thisOption[dimItem.start] = startValue;
thisOption[dimItem.end] = endValue;
});
}, this);
if (!targetDim2) {
thisOption.start2 = thisOption.end2 = null;
}
},
/**
* @public
* @param {Function} callback param: axisModel, dimNames, axisIndex, dataZoomModel, ecModel
*/
eachTargetAxis: function (callback, context) {
var ecModel = this.ecModel;
helper.eachAxisDim(function (dimNames) {
zrUtil.each(
this.get(dimNames.axisIndex),
function (axisIndex) {
callback.call(context, dimNames, axisIndex, this, ecModel);
},
this
);
}, this);
},
/**
* @public
* @param {string} dimName 'x', 'y', 'z'
* @param {number} axisIndex
*/
getTargetSeriesModels: function (dimName, axisIndex) {
var seriesModels = [];
this.ecModel.eachSeries(function (seriesModel) {
if (axisIndex === seriesModel.get(dimName + 'AxisIndex')) {
seriesModels.push(seriesModel);
}
});
return seriesModels;
},
/**
* @public
* @param {Object} param
......@@ -193,37 +256,6 @@ define(function(require) {
star2: thisOption.star2,
end2: thisOption.end2
};
},
/**
* @protected
*/
defaultOption: {
zlevel: 0, // 一级层叠
z: 4, // 二级层叠
show: false,
orient: 'horizontal', // 布局方式，默认为水平布局，可选为：
// 'horizontal' ¦ 'vertical'
// x: {number}, // 水平安放位置，默认为根据grid参数适配，可选为：
// {number}（x坐标，单位px）
// y: {number}, // 垂直安放位置，默认为根据grid参数适配，可选为：
// {number}（y坐标，单位px）
// width: {number}, // 指定宽度，横向布局时默认为根据grid参数适配
// height: {number}, // 指定高度，纵向布局时默认为根据grid参数适配
backgroundColor: 'rgba(0,0,0,0)', // 背景颜色
dataBackgroundColor: '#eee', // 数据背景颜色
fillerColor: 'rgba(144,197,237,0.2)', // 填充颜色
handleColor: 'rgba(70,130,180,0.8)', // 手柄颜色
handleSize: 8,
showDetail: true,
// xAxisIndex: [], // 默认控制所有横向类目
// yAxisIndex: [], // 默认控制所有横向类目
start: 0, // 默认为0
end: 100, // 默认为全部 100%
start2: 0, // 默认为0
end2: 100, // 默认为全部 100%
realtime: true
// zoomLock: false // 是否锁定选择区域大小
}
});
......
src/component/dataZoom/DataZoomView.js
浏览文件 @ e24dba70
......@@ -2,19 +2,35 @@ define(function (require) {
var echarts = require('../../echarts');
var zrUtil = require('zrender/core/util');
var helper = require('./helper');
var retrieveValue = helper.retrieveValue;
var DataZoomLayout = require('./DataZoomLayout');
var graphic = require('../../util/graphic');
// Constants
var DEFAULT_LOCATION_EDGE_GAP = 2;
var DEFAULT_FILLER_SIZE = 30;
var DEFAULT_FRAME_BORDER_WIDTH = 1;
var DEFAULT_HANDLE_INNER_COLOR = '#fff';
return echarts.extendComponentView({
type: 'dataZoom',
init: function (echarts) {
this._location;
/**
* @private
* @type {Object}
*/
this._updatableShapes = {};
/**
* @private
* @type {module:echarts/component/dataZoom/DataZoomLayout}
*/
this._layout;
/**
* @private
* @type {string}
*/
this._orient;
},
render: function (dataZoomModel, ecModel, api, event) {
......@@ -22,9 +38,10 @@ define(function (require) {
// 需要区别用户事件在本component上触发的render和其他render。
// 后者不重新构造shape。否则难于实现拖拽。
this._dataZoomModel = dataZoomModel;
this._ecModel = ecModel;
this._api = api;
this.dataZoomModel = dataZoomModel;
this.ecModel = ecModel;
this.api = api;
this._orient = dataZoomModel.get('orient');
if (!event || event.type !== 'dataZoom' || event.from !== this.uid) {
......@@ -35,288 +52,198 @@ define(function (require) {
}
// Layout
this._updateLocation();
this._updateSliderRange({init: true});
this._updateWidgetSize();
this._layout = new DataZoomLayout(dataZoomModel, ecModel, api);
this._layout.reset();
// Render
this._renderBackground();
this._renderDataShadow();
this._renderFrame();
this._renderFiller();
this._renderHandle();
}
},
/**
* 根据选项计算实体的位置坐标
*/
_updateLocation: function () {
var dataZoomModel = this._dataZoomModel;
var x;
var y;
var width;
var height;
// If some of x/y/width/height are not specified, auto-adapt according to target grid.
var gridRect = this._findGridRectForLocating();
if (this._orient === 'horizontal') { // Horizontal layout
width = retrieveValue(dataZoomModel.get('width'), gridRect.width);
height = retrieveValue(dataZoomModel.get('height'), DEFAULT_FILLER_SIZE);
x = retrieveValue(dataZoomModel.get('x'), gridRect.x);
y = retrieveValue(
dataZoomModel.get('y'), (api.getHeight() - height - DEFAULT_LOCATION_EDGE_GAP)
);
}
else { // Vertical layout
width = retrieveValue(dataZoomModel.get('width'), DEFAULT_FILLER_SIZE);
height = retrieveValue(dataZoomModel.get('height'), gridRect.height);
x = retrieveValue(dataZoomModel.get('x'), DEFAULT_LOCATION_EDGE_GAP);
y = retrieveValue(dataZoomModel.get('y'), gridRect.y);
}
this._location = {
x: x, y: y, width: width, height: height
};
},
/**
* @private
* @param {Object} dataZoomModel
* @param {Object} operation
* @param {boolean} [operation.init]
* @param {string} [operation.rangeArg] 'start' or 'end'
* @param {number} [operation.dx]
* @param {number} [operation.dy]
*/
_updateSliderRange: function (operation) {
// Based on this._location.
if (operation.init) {
var dataZoomModel = this._dataZoomModel;
var range = dataZoomModel.getRange();
var sliderTotalLength = this._getSliderTotalLength();
this._sliderRange = {
start: Math.round(range.start * 100 / sliderTotalLength),
end: Math.round(range.end * 100 / sliderTotalLength)
};
}
if (operation.rangeArg) {
this._sliderRange[operation.rangeArg] += this._getSliderDelta(operation);
}
},
_getSliderTotalLength: function () {
var location = this._location;
return this._orient === 'horizontal' ? location.width : location.height;
},
_getSliderDelta: function (operation) {
return retrieveValue(
this._orient === 'horizontal' ? operation.dx : operation.dy,
0
);
},
_normalizeToRange: function () {
var sliderTotalLength = this._getSliderTotalLength();
var sliderRange = this._sliderRange;
return {
start: sliderRange.start / sliderTotalLength * 100,
end: sliderRange.end / sliderTotalLength * 100
};
},
_updateWidgetSize: function () {
// Based on this._sliderRange and this._location.
var dataZoomModel = this._dataZoomModel;
var sliderRange = this._sliderRange;
var location = this._location;
var handleSize = dataZoomModel.get('handleSize');
var widgetSize = this._widgetSize = {};
if (dataZoomModel.get('orient') === 'horizontal') {
widgetSize.filler = {
x: location.x + sliderRange.start + handleSize,
y: location.y,
width: sliderRange.end - sliderRange.start - handleSize * 2,
height: location.height
};
}
else { // 'vertical'
widgetSize.filler = {
x: location.x,
y: location.y + sliderRange.start + handleSize,
width: location.width,
height: sliderRange.end - sliderRange.start - handleSize * 2
};
}
},
_findGridRectForLocating: function () {
// Find the grid coresponding to the first axis referred by dataZoom.
var axisModel;
var dataZoomModel = this._dataZoomModel;
var ecModel = this._ecModel;
helper.eachAxisDim(function (dimNames) {
var axisIndices = dataZoomModel.get(dimNames.axisIndex);
if (!axisModel && axisIndices.length) {
axisModel = ecModel.get(dimNames.axis)[axisIndices[0]];
}
});
return ecModel.getComponent('grid', axisModel.get('gridIndex')).getRect();
},
_renderBackground : function () {
var dataZoomModel = this._dataZoomModel;
var location = this._location;
var dataZoomModel = this.dataZoomModel;
var location = this._layout.layout.location;
this.group.push(new api.Rect({
this.group.add(new this.api.Rect({
// FIXME
// zlevel: this.getZlevelBase(),
// z: this.getZBase(),
hoverable:false,
style: {
shape: {
x: location.x,
y: location.y,
width: location.width,
height: location.height,
color: dataZoomModel.get('backgroundColor')
height: location.height
},
style: {
fill: dataZoomModel.get('backgroundColor')
}
}));
},
_renderFrame: function () {
var updatableShapes = this._updatableShapes;
var layout = this._layout.layout;
var baseFrame = {
// FIXME
// zlevel: this.getZlevelBase(),
// z: this.getZBase(),
hoverable: false,
style: {
stroke: this.dataZoomModel.get('handleColor'),
lineWidth: DEFAULT_FRAME_BORDER_WIDTH,
fill: 'rgba(0,0,0,0)'
}
};
this.group
.add(updatableShapes.startFrame = new this.api.Rect(zrUtil.mergeAll(
{},
baseFrame,
layout.startFrame
)))
.add(updatableShapes.endFrame = new this.api.Rect(zrUtil.mergeAll(
{},
baseFrame,
layout.endFrame
)));
},
_renderDataShadow: function () {
// Data shadow
// TODO
},
_renderFiller: function () {
var dataZoomModel = this._dataZoomModel;
var orient = dataZoomModel.get('orient');
this._fillerShape = new api.Rect({
// FIXME
// zlevel: this.getZlevelBase(),
// z: this.getZBase(),
draggable: true,
ondrift: zrUtil.bind(this._onDrift, this, 'both'),
ondragend: zrUtil.bind(this._onDragEnd, this),
style: zrUtil.merge(
this.group.add(
this._updatableShapes.filler = new this.api.Rect(zrUtil.merge(
{
color: dataZoomModel.get('fillerColor'),
text: orient === 'horizontal' ? ':::' : '::',
textPosition : 'inside'
// FIXME
// zlevel: this.getZlevelBase(),
// z: this.getZBase(),
draggable: this._orient,
drift: zrUtil.bind(this._onDrift, this, this._getUpdateArgs()),
ondragend: zrUtil.bind(this._onDragEnd, this),
style: {
fill: this.dataZoomModel.get('fillerColor'),
text: this._orient === 'horizontal' ? ':::' : '::',
textPosition : 'inside'
}
// FIXME
// highlightStyle: {
// brushType: 'fill',
// color: 'rgba(0,0,0,0)'
// }
},
this._widgetSize
),
highlightStyle: {
brushType: 'fill',
color: 'rgba(0,0,0,0)'
}
});
this.group.push(this._fillerShape);
this._layout.layout.filler
))
);
},
_renderHandle : function () {
var detail = this.zoomOption.showDetail ? this._getDetail() : {start: '',end: ''};
this._startShape = {
zlevel: this.getZlevelBase(),
z: this.getZBase(),
draggable : true,
style : {
iconType: 'rectangle',
x: this._location.x,
y: this._location.y,
width: this._handleSize,
height: this._handleSize,
color: this.zoomOption.handleColor,
_renderHandle: function () {
var dataZoomModel = this.dataZoomModel;
var layout = this._layout.layout;
var updatableShapes = this._updatableShapes;
// FIXME
// var detailInfo = this.zoomOption.showDetail ? this._getDetail() : {start: '',end: ''};
var baseHandle = {
// FIXME
// zlevel: this.getZlevelBase(),
// z: this.getZBase(),
draggable: this._orient,
style: {
fill: dataZoomModel.get('handleColor'),
textColor: DEFAULT_HANDLE_INNER_COLOR,
text: '=',
textPosition: 'inside'
},
highlightStyle: {
text: detail.start,
brushType: 'fill',
textPosition: 'left'
},
ondrift: this._ondrift,
ondragend: this._ondragend
}
// FIXME
// highlightStyle: {
// text: detail.start,
// brushType: 'fill',
// textPosition: 'left'
// },
};
if (this.zoomOption.orient === 'horizontal') {
this._startShape.style.height = this._location.height;
this._endShape = zrUtil.clone(this._startShape);
this.group
.add(updatableShapes.handle1 = new this.api.Rect(zrUtil.mergeAll(
{
drift: zrUtil.bind(this._onDrift, this, this._getUpdateArgs('handle1')),
ondragend: zrUtil.bind(this._onDragEnd, this)
},
baseHandle,
layout.handle1
)))
.add(updatableShapes.handle2 = new this.api.Rect(zrUtil.mergeAll(
{
drift: zrUtil.bind(this._onDrift, this, this._getUpdateArgs('handle2')),
ondragend: zrUtil.bind(this._onDragEnd, this)
},
baseHandle,
layout.handle2
)));
},
this._startShape.style.x = this._fillerShae.style.x - this._handleSize,
this._endShape.style.x = this._fillerShae.style.x + this._fillerShae.style.width;
this._endShape.highlightStyle.text = detail.end;
this._endShape.highlightStyle.textPosition = 'right';
_updateView: function () {
// Only shape can be modified.
// So only update shape for convenience and performance.
zrUtil.each(this._updatableShapes, function (shape, name) {
shape.attr('shape', subPixelOptimize(this._layout.layout[name].shape, name));
}, this);
function subPixelOptimize(shape, name) {
var subPixelOptimizeLineWidth = {
startFrame: DEFAULT_FRAME_BORDER_WIDTH,
endFrame: DEFAULT_FRAME_BORDER_WIDTH
};
if (subPixelOptimizeLineWidth.hasOwnProperty(name)) {
shape = graphic.subPixelOptimizeRect({
shape: shape,
style: {lineWidth: subPixelOptimizeLineWidth[name]}
}).shape;
}
return shape;
}
else {
this._startShape.style.width = this._location.width;
this._endShape = zrUtil.clone(this._startShape);
this._startShape.style.y = this._fillerShae.style.y + this._fillerShae.style.height;
this._startShape.highlightStyle.textPosition = 'bottom';
},
this._endShape.style.y = this._fillerShae.style.y - this._handleSize;
this._endShape.highlightStyle.text = detail.end;
this._endShape.highlightStyle.textPosition = 'top';
}
this._startShape = new IconShape(this._startShape);
this._endShape = new IconShape(this._endShape);
this.shapeList.push(this._startShape);
this.shapeList.push(this._endShape);
_getUpdateArgs: function (arg) {
return (!arg || this.dataZoomModel.get('zoomLock'))
? ['handle1', 'handle2']
: [arg];
},
_onDrift : function (rangeArg, dx, dy) {
var dataZoomModel = this._dataZoomModel;
_onDrift: function (rangeArgs, dx, dy) {
var dataZoomModel = this.dataZoomModel;
if (rangeArg === 'both' || dataZoomModel.get('zoomLock')) {
this._updateSliderRange({rangeArg: 'start', dx: dx, dy: dy});
this._updateSliderRange({rangeArg: 'end', dx: dx, dy: dy});
}
else { // rangeArg === 'start' or 'end'
this._updateSliderRange({rangeArg: rangeArg, dx: dx, dy: dy});
}
this._layout.update({rangeArgs: rangeArgs, dx: dx, dy: dy});
// FIXME
// refresh shape location
this._updateView();
// FIXME
if (dataZoomModel.get('realtime')) {
// this._syncData();
}
// FIXME
if (this.zoomOption.showDetail) {
// var detail = this._getDetail();
// this._startShape.style.text = this._startShape.highlightStyle.text = detail.start;
// this._endShape.style.text = this._endShape.highlightStyle.text = detail.end;
// this._startShape.style.textPosition = this._startShape.highlightStyle.textPosition;
// this._endShape.style.textPosition = this._endShape.highlightStyle.textPosition;
// FIXME
// if (this.zoomOption.showDetail) {
// }
this.api.dispatch({
type: 'dataZoom',
from: this.uid,
dataZoomRange: this._layout.normalizeToRange(),
dataZoomModel: this.dataZoomModel
});
}
this._api.dispatch({
type: 'dataZoom',
from: this.uid,
param: this._normalizeToRange(),
targetModel: this._dataZoomModel
});
// FIXME
return true;
},
_onDragEnd : function () {
// FIXME
// if (this.zoomOption.showDetail) {
// this._startShape.style.text = this._endShape.style.text = '=';
// this._startShape.style.textPosition = this._endShape.style.textPosition = 'inside';
// this.zr.modShape(this._startShape.id);
// this.zr.modShape(this._endShape.id);
// this.zr.refreshNextFrame();
// }
// this.isDragend = true;
},
}
});
});
\ No newline at end of file
src/component/dataZoom/dataZoomAction.js
浏览文件 @ e24dba70
......@@ -9,24 +9,23 @@ define(function(require) {
var helper = require('./helper');
echarts.registerAction('dataZoom', function (event, ecModel) {
var sourceDataZoomModel = event.targetModel;
ecModel.eachComponent('dataZoom', zrUtil.curry(processSingleDataZoom, event, ecModel));
});
var linkSet = helper.findLinkSet(
zrUtil.bind(ecModel.eachComponent, ecModel, 'dataZoom'),
function (model, dimNames) {
return model.get(dimNames.axisIndex);
},
event.dataZoomModel
);
function processSingleDataZoom(event, ecModel, dataZoomModel) {
helper.eachAxisDim(function (dimNames) {
zrUtil.each(
dataZoomModel.get(dimNames.axisIndex),
zrUtil.curry(processSingleAxis, ecModel, dataZoomModel, dimNames)
);
var dataZoomRange = event.dataZoomRange;
zrUtil.each(linkSet.models, function (dataZoomModel) {
dataZoomModel.setRange({
start: dataZoomRange.start,
end: dataZoomRange.end,
start2: dataZoomRange.start2,
end2: dataZoomRange.end2
});
});
}
function processSingleAxis(ecModel, dataZoomModel, dimNames, axisIndex) {
}
function isSharingAxis(dataZoomModel0, dataZoomModel1) {
}
});
});
\ No newline at end of file
src/component/dataZoom/dataZoomProcessor.js
浏览文件 @ e24dba70
......@@ -4,11 +4,13 @@
define(function (require) {
var echarts = require('../../echarts');
var helper = require('./helper');
var zrUtil = require('zrender/core/util');
var linearMap = require('../../util/number').linearMap;
echarts.registerProcessor(function (ecModel) {
ecModel.eachComponent('dataZoom', zrUtil.curry(processSingleDataZoom, ecModel));
ecModel.eachComponent('dataZoom', function (dataZoomModel) {
dataZoomModel.eachTargetAxis(processSingleAxis);
});
});
// FIXME
......@@ -23,66 +25,54 @@ define(function (require) {
// TODO
// undo redo
function processSingleDataZoom(ecModel, dataZoomModel) {
helper.eachAxisDim(function (dimNames) {
zrUtil.each(
dataZoomModel.get(dimNames.axisIndex),
zrUtil.curry(processSingleAxis, ecModel, dataZoomModel, dimNames)
);
});
}
function processSingleAxis(dimNames, axisIndex, dataZoomModel, ecModel) {
function processSingleAxis(ecModel, dataZoomModel, dimNames, axisIndex) {
// TODO
// backup axis data
// Process axis data
var axisModel = ecModel.getComponent(dimNames.axis, axisIndex);
var axisData = axisModel.get('data');
if (axisData) {
var dataLength = axisData.length;
var start = Math.floor(axisModel.get('dataZoomStart') / 100 * dataLength);
var end = Math.ceil(axisModel.get('dataZoomEnd') / 100 * dataLength);
var percentExtent = [0, 100];
var dataZoomStart = axisModel.get('dataZoomStart');
var dataZoomEnd = axisModel.get('dataZoomEnd');
var axisData = axisModel.getData();
if (axisData) {
var axisDataExtent = [0, axisData.length];
var axisStart = Math.floor(linearMap(dataZoomStart, percentExtent, axisDataExtent, true));
var axisEnd = Math.ceil(linearMap(dataZoomEnd, percentExtent, axisDataExtent, true));
// Only category axis has property 'data's.
axisData = axisData.slice(start, end);
// FIXME
// setter?
axisData = axisModel.option.data = axisData.slice(axisStart, axisEnd);
}
var seriesModels = getTargetSeriesModelsByAxis(
ecModel, dataZoomModel, axisIndex, dimNames
);
zrUtil.each(seriesModels, function (seriesModel) {
// FIXME
// data的backup
// Process series data
var seriesModels = dataZoomModel.getTargetSeriesModels(dimNames.dim, axisIndex);
zrUtil.each(seriesModels, function (seriesModel) {
// FIXME
// 如何filter，
// 是根据data自己存的信息（如dimension）来判断（这比较直接，但是现在list里存的信息没清楚），
// 还是根据axis type来判断（比较枚举不太好）
// var axisType = axisModel.get('type');
// FIXME
// 如何filter，
// 是根据data自己存的信息（如dimension）来判断（这比较直接，但是现在list里存的信息没清楚），
// 还是根据axis type来判断（比较枚举不太好）
// var axisType = axisModel.get('type');
// FIXME
// 这里仅仅处理了list类型
var seriesData = seriesModel.getData();
seriesModel.setData(
seriesData['filter' + dimNames.dim.toUpperCase()](function (value) {
return value >= start && value <= end;
})
);
// FIXME
// 这里仅仅处理了list类型
var seriesData = seriesModel.getData();
if (seriesData) {
// FIXME
// 对于数值轴，还要考虑log等情况.
// FIXME
// 对于时间河流图，还要考虑是否须整块移除。
});
}
}
function getTargetSeriesModelsByAxis(ecModel, dataZoomModel, axisIndex, dimNames) {
var seriesModels = [];
ecModel.eachSeries(function (seriesModel) {
if (axisIndex === seriesModel.get(dimNames.axisIndex)) {
seriesModels.push(seriesModel);
var seriesDataExtent = [0, seriesData.count()];
var seriesStart = Math.floor(linearMap(dataZoomStart, percentExtent, seriesDataExtent, true));
var seriesEnd = Math.ceil(linearMap(dataZoomEnd, percentExtent, seriesDataExtent, true));
seriesData.filterSelf(function (entry) {
var value = entry['get' + dimNames.dim.toUpperCase()]();
return value >= seriesStart && value <= seriesEnd;
});
}
// FIXME
// 对于数值轴，还要考虑log等情况.
// FIXME
// 对于时间河流图，还要考虑是否须整块移除。
});
return seriesModels;
}
});
src/component/dataZoom/helper.js
浏览文件 @ e24dba70
......@@ -11,14 +11,14 @@ define(function(require) {
// FIXME
// 公用？
helper.eachAxisDim = function (callback, scope) {
helper.eachAxisDim = function (callback, context) {
zrUtil.each(AXIS_DIMS, function (axisDim) {
var names = {
axisIndex: axisDim + 'AxisIndex',
axis: axisDim + 'Axis',
dim: axisDim
};
callback.call(scope, names);
callback.call(context, names);
});
};
......
src/component/legend.js
浏览文件 @ e24dba70
......@@ -4,6 +4,7 @@
define(function (require) {
require('./legend/LegendModel');
require('./legend/legendAction');
require('./legend/LegendView');
var echarts = require('../echarts');
......
src/component/legend/LegendView.js
浏览文件 @ e24dba70
......@@ -68,9 +68,13 @@ define(function (require) {
group.add(text);
legendSymbol.on('click', function () {
legendModel.toggleSelected(seriesName);
api.update();
});
api.dispatch({
type: 'legendSelected',
from: this.uid,
legendModel: legendModel,
seriesName: seriesName
});
}, this);
}, this);
var groupRect = group.getBoundingRect();
......@@ -80,9 +84,9 @@ define(function (require) {
_createSymbol: function (seriesModel, x, y, width, height, api) {
// Using rect symbol defaultly
var legendSymbolType = seriesModel.getVisual('legendSymbol')
var legendSymbolType = seriesModel && seriesModel.getVisual('legendSymbol')
|| 'roundRect';
var symbolType = seriesModel.getVisual('symbol');
var symbolType = seriesModel && seriesModel.getVisual('symbol');
var legendSymbolShape = symbolCreator.createSymbol(legendSymbolType, x, y, width, height);
......
src/component/legend/legendAction.js 0 → 100644
浏览文件 @ e24dba70
/**
* @file Legend action
*/
define(function(require) {
var echarts = require('../../echarts');
echarts.registerAction('legendSelected', function (event, ecModel) {
event.legendModel.toggleSelected(event.seriesName);
});
});
\ No newline at end of file
src/coord/Axis.js
浏览文件 @ e24dba70
......@@ -84,7 +84,6 @@ define(function (require) {
if (data == null || data === '-') {
return NaN;
}
data = this.scale.normalize(data);
var extent = this.getExtent();
......
src/coord/cartesian/AxisModel.js
浏览文件 @ e24dba70
......@@ -2,6 +2,7 @@ define(function(require) {
'use strict';
var ComponentModel = require('../../model/Component');
var defaultOption = require('../axisDefault');
var zrUtil = require('zrender/core/util');
......@@ -13,7 +14,8 @@ define(function(require) {
zrUtil.merge(axisOption, defaultOption[axisType]);
}
var AxisModel = require('../../model/Component').extend({
var AxisModel = ComponentModel.extend({
type: 'cartesian2dAxis',
/**
......@@ -21,6 +23,32 @@ define(function(require) {
*/
axis: null,
/**
* @override
*/
init: function () {
ComponentModel.prototype.init.call(this);
var data = this.getData();
if (data) {
// FIXME
// clone?
/**
* @type {Array}
* @private
*/
this._dataBeforeProcessing = data.slice();
}
},
/**
* @public
* @return {Array=} data Can be null
*/
getData: function () {
return this.get('data');
},
/**
* @public
* @param {number} start 0-100, null means remain current value.
......@@ -30,6 +58,17 @@ define(function(require) {
var option = this.option;
start != null && (option.dataZoomStart = start);
end != null && (option.dataZoomEnd = end);
},
/**
* @override
*/
restoreData: function () {
// FIXME
// clone?
if (this._dataBeforeProcessing) {
this.option.data = this._dataBeforeProcessing.slice();
}
}
});
......@@ -42,6 +81,8 @@ define(function(require) {
type: 'xAxis',
init: function (axisOption, parentModel, ecModel) {
AxisModel.prototype.init.call(this);
axisOption.type = axisOption.type || 'category';
axisOption.position = axisOption.position || 'bottom';
......@@ -58,6 +99,8 @@ define(function(require) {
type: 'yAxis',
init: function (axisOption, parentModel, ecModel) {
AxisModel.prototype.init.call(this);
axisOption.type = axisOption.type || 'value';
axisOption.position = axisOption.position || 'left';
......
src/coord/cartesian/Grid.js
浏览文件 @ e24dba70
......@@ -26,10 +26,10 @@ define(function(require, factory) {
var axisType = axisModel.get('type');
if (axisType) {
return axisType === 'category'
? new OrdinalScale(axisModel.get('data'))
? new OrdinalScale(axisModel.getData())
: new IntervalScale();
}
};
}
/**
* Check if the axis is used in the specified grid
......@@ -232,7 +232,7 @@ define(function(require, factory) {
this._axesList.push(axisY);
this._axesMap['y' + idx] = axisY;
xAxesMap[idx] = axisY;
yAxesMap[idx] = axisY;
yAxesCount++;
}, this);
......@@ -253,18 +253,6 @@ define(function(require, factory) {
cartesian.addAxis(xAxis);
cartesian.addAxis(yAxis);
});
});
ecModel.eachComponent('xAxis', function (xAxisModel, i) {
ecModel.eachComponent('yAxis', function (yAxisModel, j) {
var key = 'x' + i + 'y' + j;
var cartesian = new Cartesian2D(key);
this._coordsMap[key] = cartesian;
this._coordsList.push(cartesian);
cartesian.addAxis(xAxisModel.axis);
cartesian.addAxis(yAxisModel.axis);
}, this);
}, this);
......@@ -319,7 +307,7 @@ define(function(require, factory) {
else {
data.eachValue(function (value) {
if (value != null) {
axisData[categoryAxis.dim == 'y' ? 'x' : 'y'].push(value);
axisData[categoryAxis.dim === 'y' ? 'x' : 'y'].push(value);
}
});
}
......@@ -371,7 +359,7 @@ define(function(require, factory) {
});
return grids;
}
};
require('../../CoordinateSystem').register('grid', Grid);
......
src/data/DataDiffer.js
浏览文件 @ e24dba70
......@@ -40,12 +40,14 @@ define(function(require) {
var oldDataMap = {};
var newDataMap = {};
var newDataIndexMap = {};
var i;
for (i = 0; i < oldArr.length; i++) {
oldDataMap[oldArr[i].name] = oldArr[i];
}
for (i = 0; i < newArr.length; i++) {
newDataMap[newArr[i].name] = newArr[i];
newDataIndexMap[newArr[i].name] = i;
}
for (i = 0; i < oldArr.length; i++) {
......@@ -61,8 +63,8 @@ define(function(require) {
for (i = 0; i < newArr.length; i++) {
var newData = newArr[i];
if (! oldDataMap[newData.name]) {
this._add && this._add(newData);
if (!oldDataMap[newData.name]) {
this._add && this._add(newData, newDataIndexMap[newData.name]);
}
}
}
......
src/data/List.js
浏览文件 @ e24dba70
......@@ -25,9 +25,11 @@ define(function(require) {
array[i] = eachAxis(item, depth);
}
}
}
};
}
var dimensions = ['x', 'y', 'z', 'value', 'radius', 'angle']
var dimensions = ['x', 'y', 'z', 'value', 'radius', 'angle'];
/**
* @name echarts/data/List~Entry
* @extends {module:echarts/model/Model}
......@@ -78,7 +80,7 @@ define(function(require) {
*/
valueIndex: 1,
init: function (option, parentModel, dataIndex, independentVar, dependentVar) {
init: function (option, parentModel, rawDataIndex, independentVar, dependentVar) {
/**
* @type {string}
......@@ -87,12 +89,27 @@ define(function(require) {
*/
this.name = option.name || '';
/**
* this.option **MUST NOT** be modified in List!
* Different lists might share this option instance.
*
* @readOnly
* @type {*}
*/
this.option = option;
var value = option.value == null ? option : option.value;
if (typeof value === 'number') {
value = [dataIndex, value];
value = [rawDataIndex, value];
/**
* If dataIndex is persistent in entry, it should be udpated when modifying list.
* So use this.dataIndexIndex to mark that.
*
* @readOnly
* @type {number}
*/
this.dataIndexIndex = 0;
}
if (independentVar) {
......@@ -105,6 +122,10 @@ define(function(require) {
}
/**
* All of the content **MUST NOT** be modified,
* (because they are the same instance with option.value)
* except this._value[this.dataIndexIndex].
*
* @type {Array.<number>}
* @memeberOf module:echarts/data/List~Entry
* @private
......@@ -112,10 +133,11 @@ define(function(require) {
this._value = value;
/**
* @private
* Data index before modifying list (filterSelf).
*
* @readOnly
*/
this.dataIndex = dataIndex;
this.rawDataIndex = rawDataIndex;
},
/**
......@@ -129,10 +151,11 @@ define(function(require) {
},
clone: function () {
var entry = new Entry(
this.option, this.parentModel, this.dataIndex
);
var entry = new Entry(this.option, this.parentModel);
entry.name = this.name;
entry.dataIndexIndex = this.dataIndexIndex;
entry._value = entry.dataIndexIndex != null
? this._value.slice() : this._value;
for (var i = 0; i < dimensions.length; i++) {
var key = dimensions[i] + 'Index';
......@@ -150,16 +173,20 @@ define(function(require) {
if (index >= 0) {
return this._value[index];
}
}
};
Entry.prototype['set' + capitalized] = function (val) {
var index = this[indexKey];
if (index >= 0) {
this._value[indexKey] = val;
}
}
};
});
function List() {
/**
* @readOnly
* @type {Array}
*/
this.elements = [];
}
......@@ -169,9 +196,12 @@ define(function(require) {
type: 'list',
count: function () {
return this.elements.length;
},
each: function (cb, context) {
context = context || this;
zrUtil.each(this.elements, cb, context);
zrUtil.each(this.elements, cb, context || this);
},
/**
......@@ -180,16 +210,34 @@ define(function(require) {
*/
map: function (cb, context) {
var ret = [];
context = context || this;
this.each(function (item, idx) {
ret.push(cb && cb.call(context || this, item));
ret.push(cb && cb.call(context, item));
}, context);
return ret;
},
filter: function (cb, context) {
var list = new List();
context = context || this;
list.elements = zrUtil.filter(this.elements, cb, context);
filterSelf: function (cb, context) {
this.elements = zrUtil.filter(this.elements, cb, context || this);
var dataIndexDirty = false;
this.elements = zrUtil.filter(this.elements, function (entry) {
var result = cb.apply(this, arguments);
if (result && entry.dataIndexIndex != null) {
dataIndexDirty = true;
}
return result;
}, context || this);
dataIndexDirty && this.refreshDataIndex();
},
refreshDataIndex: function () {
this.each(function (entry, dataIndex) {
if (entry.dataIndexIndex != null) {
entry._value[entry.dataIndexIndex] = dataIndex;
}
}, this);
},
/**
......@@ -227,8 +275,6 @@ define(function(require) {
for (var i = 0; i < elements.length; i++) {
list.elements.push(elements[i].clone());
}
list.depth = this.depth;
list.properties = this.properties;
return list;
}
};
......@@ -247,18 +293,6 @@ define(function(require) {
}, context);
return ret;
};
List.prototype['filter' + name] = function (cb, context) {
var newList = this.clone();
var elements = []
newList.each(function (item) {
if (cb.call(context || newList, item['get' + name]())) {
elements.push(item);
}
}, context);
newList.elements = elements;
return newList;
};
});
List.fromArray = function (data, seriesModel, ecModel) {
......@@ -295,7 +329,7 @@ define(function(require) {
else if (coordinateSystem === 'polar') {
function axisFinder(axisModel) {
return axisModel.get('polarIndex') === polarIndex;
};
}
var polarIndex = seriesModel.get('polarIndex') || 0;
var angleAxisModel = ecModel.findComponent('angleAxis', axisFinder);
var radiusAxisModel = ecModel.findComponent('radiusAxis', axisFinder);
......
src/echarts.js
浏览文件 @ e24dba70
......@@ -154,22 +154,26 @@ define(function (require) {
this._needsUpdate = true;
},
updateImmediately: function () {
updateImmediately: function (event) {
// console.time('update');
var ecModel = this._model;
ecModel.restoreData();
// 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.
this._processData(ecModel);
this._coordinateSystem.update(ecModel, this._extensionAPI);
this._doVisualCoding(ecModel);
this._doLayout(ecModel);
this._doLayout(ecModel, event);
this._doRender(ecModel);
this._doRender(ecModel, event);
this._needsUpdate = false;
......@@ -190,6 +194,20 @@ define(function (require) {
this.updateImmediately();
},
/**
* @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);
}
},
_prepareCharts: function (ecModel) {
var chartsList = this._chartsList;
......@@ -299,12 +317,12 @@ define(function (require) {
* @param {module:echarts/model/Global} ecModel
* @private
*/
_doLayout: function (ecModel) {
_doLayout: function (ecModel, event) {
zrUtil.each(this._layouts, function (layout) {
layout(ecModel);
layout(ecModel, event);
});
zrUtil.each(layoutFuncs, function (layout) {
layout(ecModel);
layout(ecModel, event);
});
},
......@@ -323,23 +341,25 @@ define(function (require) {
/**
* Render each chart and component
*/
_doRender: function (ecModel) {
_doRender: function (ecModel, event) {
var api = this._extensionAPI;
// Render all components
zrUtil.each(this._componentsList, function (component) {
component.render(component.__model, ecModel, api);
component.render(component.__model, ecModel, api, event);
}, this);
// Remove groups of charts
zrUtil.each(this._chartsList, function (chart) {
chart.__keepAlive = false;
}, this);
// Render all charts
ecModel.eachSeries(function (seriesModel, idx) {
var id = getSeriesId(seriesModel.option, idx);
var chart = this._chartsMap[id];
chart.__keepAlive = true;
chart.render(seriesModel, ecModel, api);
chart.render(seriesModel, ecModel, api, event);
}, this);
// Remove groups of charts
zrUtil.each(this._chartsList, function (chart) {
if (!chart.__keepAlive) {
......@@ -363,6 +383,8 @@ define(function (require) {
var dataProcessorFuncs = [];
var actions = [];
var layoutClasses = [];
var layoutFuncs = [];
......@@ -387,6 +409,15 @@ define(function (require) {
}
},
/**
* @param {Function}
*/
registerAction: function (actionName, action) {
if (!actions[actionName]) {
actions[actionName] = action;
}
},
/**
* @param {string} type
* @param {*} CoordinateSystem
......@@ -429,6 +460,13 @@ define(function (require) {
return ComponentModel.extend(opts);
},
/**
* @param {Object} opts
*/
extendSeriesModel: function (opts) {
return SeriesModel.extend(opts);
},
/**
* @param {Object} opts
*/
......
src/scale/Interval.js
浏览文件 @ e24dba70
......@@ -77,6 +77,7 @@ define(function (require) {
max = Math.max(data[i], max);
min = Math.min(data[i], min);
}
this.setExtent(min, max);
},
......
src/util/graphic.js
浏览文件 @ e24dba70
......@@ -4,7 +4,7 @@ define(function(require) {
var pathTool = require('zrender/tool/path');
var matrix = require('zrender/core/matrix');
var round = Math.round;
var Path = require('zrender/graphic/Path');
var graphic = {
......@@ -77,27 +77,81 @@ define(function(require) {
},
/**
* @param {Array.<number>} p1
* @param {Array.<number>} p2
* @param {number} lineWidth
* Sub pixel optimize line for canvas
*
* @param {Object} param
* @param {Object} [param.shape]
* @param {number} [param.shape.x1]
* @param {number} [param.shape.y1]
* @param {number} [param.shape.x2]
* @param {number} [param.shape.y2]
* @param {Object} [param.style]
* @param {number} [param.style.lineWidth]
* @return {Object} Modified param
*/
subPixelOptimizeLine: function (p1, p2, lineWidth) {
var round = Math.round;
// Sub pixel optimize
var offset = lineWidth % 2 / 2;
var x1 = round(p1[0]);
var y1 = round(p1[1]);
var x2 = round(p2[0]);
var y2 = round(p2[1]);
if (x1 === x2) {
x1 += offset;
x2 += offset;
subPixelOptimizeLine: function (param) {
var subPixelOptimize = graphic.subPixelOptimize;
var shape = param.shape;
var lineWidth = param.style.lineWidth;
if (round(shape.x1 * 2) === round(shape.x2 * 2)) {
shape.x1 = shape.x2 = subPixelOptimize(shape.x1, lineWidth, true);
}
if (y1 === y2) {
y1 += offset;
y2 += offset;
if (round(shape.y1 * 2) === round(shape.y2 * 2)) {
shape.y1 = shape.y2 = subPixelOptimize(shape.y1, lineWidth, true);
}
return param;
},
/**
* Sub pixel optimize rect for canvas
*
* @param {Object} param
* @param {Object} [param.shape]
* @param {number} [param.shape.x]
* @param {number} [param.shape.y]
* @param {number} [param.shape.width]
* @param {number} [param.shape.height]
* @param {Object} [param.style]
* @param {number} [param.style.lineWidth]
* @return {Object} Modified param
*/
subPixelOptimizeRect: function (param) {
var subPixelOptimize = graphic.subPixelOptimize;
var shape = param.shape;
var lineWidth = param.style.lineWidth;
var originX = shape.x;
var originY = shape.y;
var originWidth = shape.width;
var originHeight = shape.height;
shape.x = subPixelOptimize(shape.x, lineWidth, true);
shape.y = subPixelOptimize(shape.y, lineWidth, true);
shape.width = Math.max(
subPixelOptimize(originX + originWidth, lineWidth, false) - shape.x,
originWidth === 0 ? 0 : 1
);
shape.height = Math.max(
subPixelOptimize(originY + originHeight, lineWidth, false) - shape.y,
originHeight === 0 ? 0 : 1
);
return param;
},
/**
* Sub pixel optimize for canvas
*
* @param {number} position Coordinate, such as x, y
* @param {number} lineWidth Should be nonnegative integer.
* @param {boolean=} positiveOrNegative Default false (negative).
* @return {number} Optimized position.
*/
subPixelOptimize: function (position, lineWidth, positiveOrNegative) {
// Assure that (position + lineWidth / 2) is near integer edge,
// otherwise line will be fuzzy in canvas.
var doubledPosition = round(position * 2);
return (doubledPosition + round(lineWidth)) % 2 === 0
? doubledPosition / 2
: (doubledPosition + (positiveOrNegative ? 1 : -1)) / 2;
}
};
......
test/dataZoom.html 0 → 100644
浏览文件 @ e24dba70
<html>
<head>
<meta charset="utf-8">
<script src="esl.js"></script>
<script src="config.js"></script>
</head>
<body>
<style>
html, body, #main {
width: 100%;
height: 100%;
}
</style>
<div id="main"></div>
<script>
require([
'echarts',
'echarts/chart/line',
'echarts/component/legend',
'echarts/component/grid',
'echarts/component/axis',
'echarts/component/dataZoom'
], function (echarts) {
var chart = echarts.init(document.getElementById('main'), null, {
renderer: 'canvas'
});
var xAxisData = [];
var data1 = [];
var data2 = [];
var data3 = [];
for (var i = 0; i < 20; i++) {
xAxisData.push('类目' + i);
data1.push(Math.random() * 5);
data2.push(Math.random());
data3.push(Math.random());
}
chart.setOption({
legend: {
data: ['line', 'line2', 'line3']
},
xAxis: {
// data: ['类目1', '类目2', '类目3', '类目4', '类目5',]
data: xAxisData
},
yAxis: {
// scale: true
},
series: [
{
name: 'line',
type: 'line',
data: data1
},
// {
// name: 'line2',
// type: 'line',
// data: data2
// },
// {
// name: 'line3',
// type: 'line',
// data: data3
// }
],
dataZoom: {
show: true
}
});
})
</script>
</body>
</html>
\ No newline at end of file
test/ut/all.js
浏览文件 @ e24dba70
document.write('<script src="ut/core/utHelper.js"><\/script>');
// Specs ...
document.write('<script src="ut/spec/util/graphic.js"><\/script>');
document.write('<script src="ut/spec/model/Component.js"><\/script>');
document.write('<script src="ut/spec/dataZoom/helper.js"><\/script>');
test/ut/spec/util/graphic.js 0 → 100755
浏览文件 @ e24dba70
describe('util/graphic', function() {
var utHelper = window.utHelper;
var graphic;
beforeAll(function (done) { // jshint ignore:line
utHelper.resetPackageLoader(function () {
window.require(['echarts/util/graphic'], function (g) {
graphic = g;
done();
});
});
});
describe('subPixelOptimize', function () {
it('subPixelOptimize_base', function (done) {
expect(graphic.subPixelOptimize(5, 1)).toEqual(4.5);
expect(graphic.subPixelOptimize(5, 2)).toEqual(5);
expect(graphic.subPixelOptimize(5, 43)).toEqual(4.5);
expect(graphic.subPixelOptimize(7.5, 1)).toEqual(7.5);
expect(graphic.subPixelOptimize(7.5, 2)).toEqual(7);
expect(graphic.subPixelOptimize(14, 1, true)).toEqual(14.5);
expect(graphic.subPixelOptimize(14, 2, true)).toEqual(14);
expect(graphic.subPixelOptimize(-11, 1)).toEqual(-11.5);
expect(graphic.subPixelOptimize(-11, 2)).toEqual(-11);
expect(graphic.subPixelOptimize(0, 2)).toEqual(0);
expect(graphic.subPixelOptimize(0, 1)).toEqual(-0.5);
expect(graphic.subPixelOptimize(5, 0)).toEqual(5);
done();
});
it('subPixelOptimize_line', function (done) {
function doSubPixelOptimizeLine(x, y, width, height, lineWidth) {
return graphic.subPixelOptimizeLine(makeParam(x, y, width, height, lineWidth));
}
function makeParam(x1, y1, x2, y2, lineWidth) {
return {
shape: {x1: x1, y1: y1, x2: x2, y2: y2},
style: {lineWidth: lineWidth}
};
}
expect(doSubPixelOptimizeLine(5, 11, 3, 7, 1)).toEqual(makeParam(5, 11, 3, 7, 1));
expect(doSubPixelOptimizeLine(5, 11, 5, 7, 1)).toEqual(makeParam(5.5, 11, 5.5, 7, 1));
expect(doSubPixelOptimizeLine(5, 11, 5, 7, 2)).toEqual(makeParam(5, 11, 5, 7, 2));
expect(doSubPixelOptimizeLine(5, 11, 15, 11, 1)).toEqual(makeParam(5, 11.5, 15, 11.5, 1));
expect(doSubPixelOptimizeLine(5, 11, 15, 11, 2)).toEqual(makeParam(5, 11, 15, 11, 2));
expect(doSubPixelOptimizeLine(5, 11, 15, 11, 3)).toEqual(makeParam(5, 11.5, 15, 11.5, 3));
expect(doSubPixelOptimizeLine(5, 11, 15, 11.5, 3)).toEqual(makeParam(5, 11, 15, 11.5, 3));
expect(doSubPixelOptimizeLine(5, 11.5, 15, 11.5, 3)).toEqual(makeParam(5, 11.5, 15, 11.5, 3));
expect(doSubPixelOptimizeLine(5, 11.5, 15, 11.5, 4)).toEqual(makeParam(5, 12, 15, 12, 4));
done();
});
it('subPixelOptimize_rect', function (done) {
function doSubPixelOptimizeRect(x, y, width, height, lineWidth) {
return graphic.subPixelOptimizeRect(makeParam(x, y, width, height, lineWidth));
}
function makeParam(x, y, width, height, lineWidth) {
return {
shape: {x: x, y: y, width: width, height: height},
style: {lineWidth: lineWidth}
};
}
expect(doSubPixelOptimizeRect(5, 11, 3, 7, 1)).toEqual(makeParam(5.5, 11.5, 2, 6, 1));
expect(doSubPixelOptimizeRect(5, 11, 3, 7, 2)).toEqual(makeParam(5, 11, 3, 7, 2));
expect(doSubPixelOptimizeRect(5, 11, 3, 7, 3)).toEqual(makeParam(5.5, 11.5, 2, 6, 3));
// Boundary value tests
expect(doSubPixelOptimizeRect(5, 11, 1, 7, 1)).toEqual(makeParam(5.5, 11.5, 1, 6, 1));
expect(doSubPixelOptimizeRect(5, 11, 1, 0, 1)).toEqual(makeParam(5.5, 11.5, 1, 0, 1));
done();
});
});
});
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或