Skip to content

I
incubator-echarts

x649585723 / incubator-echarts
与 Fork 源项目一致

从无法访问的项目Fork

通知 1
Star 0
Fork 0
I
incubator-echarts

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

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

Merge branch 'master' of https://github.com/pissang/echarts-next

上级 198a7877 5ab035ea
展开全部 隐藏空白更改
内联 并排
Showing with 1023 addition and 499 deletion
build/config.js
浏览文件 @ 8fae2c46
......@@ -20,9 +20,13 @@
'echarts/chart/bar',
'echarts/component/grid',
'echarts/chart/pie',
'echarts/chart/scatter',
'echarts/component/tooltip',
'echarts/component/polar',
'echarts/chart/radar',
'echarts/component/legend',
'echarts/chart/scatter',
'echarts/chart/map',
'echarts/chart/treemap',
'echarts/chart/graph',
......@@ -31,13 +35,11 @@
'echarts/chart/parallel',
'echarts/component/geo',
'echarts/component/polar',
'echarts/component/parallel',
'echarts/component/title',
'echarts/component/dataZoom',
'echarts/component/tooltip',
'echarts/component/dataRange',
'echarts/component/markPoint',
......
src/ExtensionAPI.js
浏览文件 @ 8fae2c46
......@@ -12,31 +12,6 @@ define(function(require) {
zrUtil.each(echartsAPIList, function (name) {
this[name] = zrUtil.bind(chartInstance[name], chartInstance);
}, this);
function animateOrSetGraphicEl(isUpdate, el, props, cb) {
var ecModel = chartInstance.getModel();
var duration = ecModel.getShallow('animationDuration' + (isUpdate ? 'Update' : ''));
var animationEasing = ecModel.getShallow('animationEasing' + (isUpdate ? 'Update' : ''));
ecModel.getShallow('animation')
? el.animateTo(props, duration, animationEasing, cb)
: (el.attr(props), cb && cb());
}
/**
* Update element property
* @param {module:zrender/Element} el
* @param {Object} props
* @param {Function} [cb]
*/
this.updateGraphicEl = zrUtil.curry(animateOrSetGraphicEl, true);
/**
* Init element property
* @param {module:zrender/Element} el
* @param {Object} props
* @param {Function} [cb]
*/
this.initGraphicEl = zrUtil.curry(animateOrSetGraphicEl, false);
}
return ExtensionAPI;
......
src/chart/bar/BarView.js
浏览文件 @ 8fae2c46
......@@ -57,9 +57,9 @@ define(function (require) {
var animateTarget = {};
rectShape[animateProperty] = 0;
animateTarget[animateProperty] = layout[animateProperty];
api[isUpdate? 'updateGraphicEl' : 'initGraphicEl'](rect, {
graphic[isUpdate? 'updateProps' : 'initProps'](rect, {
shape: animateTarget
});
}, seriesModel);
}
return rect;
}
......@@ -92,9 +92,9 @@ define(function (require) {
var lineWidth = data.getItemModel(newIndex).get(barBorderWidthQuery) || 0;
fixLayoutWithLineWidth(layout, lineWidth);
api.updateGraphicEl(rect, {
graphic.updateProps(rect, {
shape: layout
});
}, seriesModel);
data.setItemGraphicEl(newIndex, rect);
......@@ -106,11 +106,11 @@ define(function (require) {
if (rect) {
// Not show text when animating
rect.style.text = '';
api.updateGraphicEl(rect, {
graphic.updateProps(rect, {
shape: {
width: 0
}
}, function () {
}, seriesModel, function () {
group.remove(rect);
});
}
......@@ -182,11 +182,11 @@ define(function (require) {
this._data.eachItemGraphicEl(function (el) {
// Not show text when animating
el.style.text = '';
api.updateGraphicEl(el, {
graphic.updateProps(el, {
shape: {
width: 0
}
}, function () {
}, ecModel, function () {
group.remove(el);
});
});
......
src/chart/funnel/FunnelView.js
浏览文件 @ 8fae2c46
......@@ -92,26 +92,26 @@ define(function (require) {
var layout = data.getItemLayout(newIdx);
var labelLayout = layout.label;
api.updateGraphicEl(poly, {
graphic.updateProps(poly, {
shape: {
points: layout.points
}
});
}, seriesModel);
var labelLine = poly.__labelLine;
var labelText = poly.__labelText;
api.updateGraphicEl(labelLine, {
graphic.updateProps(labelLine, {
shape: {
points: labelLayout.linePoints
}
});
api.updateGraphicEl(labelText, {
}, seriesModel);
graphic.updateProps(labelText, {
style: {
x: labelLayout.x,
y: labelLayout.y
}
});
}, seriesModel);
// Set none animating style
labelText.setStyle({
textAlign: labelLayout.textAlign,
......
src/chart/gauge/GaugeView.js
浏览文件 @ 8fae2c46
......@@ -278,11 +278,11 @@ define(function (require) {
}
});
api.updateGraphicEl(pointer, {
graphic.updateProps(pointer, {
shape: {
angle: linearMap(data.get('value', idx), valueExtent, angleExtent)
}
});
}, seriesModel);
group.add(pointer);
data.setItemGraphicEl(idx, pointer);
......@@ -290,11 +290,11 @@ define(function (require) {
.update(function (newIdx, oldIdx) {
var pointer = oldData.getItemGraphicEl(oldIdx);
api.updateGraphicEl(pointer, {
graphic.updateProps(pointer, {
shape: {
angle: linearMap(data.get('value', newIdx), valueExtent, angleExtent)
}
});
}, seriesModel);
group.add(pointer);
data.setItemGraphicEl(newIdx, pointer);
......
src/chart/graph/GraphView.js
浏览文件 @ 8fae2c46
......@@ -37,9 +37,9 @@ define(function (require) {
var symbolDraw = this._symbolDraw;
var lineDraw = this._lineDraw;
symbolDraw.updateData(data, api);
symbolDraw.updateData(data);
lineDraw.updateData(data.graph.edgeData, api);
lineDraw.updateData(data.graph.edgeData, null, null);
// Save the original lineWidth
data.graph.eachEdge(function (edge) {
......@@ -108,7 +108,8 @@ define(function (require) {
});
data.graph.eachEdge(function (edge) {
edge.getGraphicEl().setStyle(
var lineGroup = edge.getGraphicEl();
lineGroup.childOfName('line').setStyle(
'lineWidth',
edge.__lineWidth * edgeScale / groupScale
);
......
src/chart/graph/circularLayout.js
浏览文件 @ 8fae2c46
......@@ -41,17 +41,7 @@ define(function (require) {
if (curveness > 0) {
cp1 = [cx, cy];
}
var shape = {
x1: p1[0],
y1: p1[1],
x2: p2[0],
y2: p2[1]
};
if (cp1) {
shape.cpx1 = cp1[0];
shape.cpy1 = cp1[1];
}
edge.setLayout(shape);
edge.setLayout([p1, p2, cp1]);
});
}
});
......
src/chart/graph/simpleLayout.js
浏览文件 @ 8fae2c46
......@@ -28,17 +28,7 @@ define(function (require) {
(p1[1] + p2[1]) / 2 - inv * (p2[0] - p1[0]) * curveness
];
}
var shape = {
x1: p1[0],
y1: p1[1],
x2: p2[0],
y2: p2[1]
};
if (cp1) {
shape.cpx1 = cp1[0];
shape.cpy1 = cp1[1];
}
edge.setLayout(shape);
edge.setLayout([p1, p2, cp1]);
});
}
......
src/chart/helper/LargeSymbolDraw.js
浏览文件 @ 8fae2c46
......@@ -2,6 +2,7 @@ define(function (require) {
var graphic = require('../../util/graphic');
var symbolUtil = require('../../util/symbol');
var zrUtil = require('zrender/core/util');
var LargeSymbolPath = graphic.extendShape({
shape: {
......@@ -20,18 +21,18 @@ define(function (require) {
for (var i = 0; i < points.length; i++) {
var pt = points[i];
var size = sizes[i];
if (size < 4) {
if (size[0] < 4) {
// Optimize for small symbol
path.rect(
pt[0] - size / 2, pt[1] - size / 2,
size, size
pt[0] - size[0] / 2, pt[1] - size[1] / 2,
size[0], size[1]
);
}
else {
symbolProxyShape.x = pt[0] - size / 2;
symbolProxyShape.y = pt[1] - size / 2;
symbolProxyShape.width = size;
symbolProxyShape.height = size;
symbolProxyShape.x = pt[0] - size[0] / 2;
symbolProxyShape.y = pt[1] - size[1] / 2;
symbolProxyShape.width = size[0];
symbolProxyShape.height = size[1];
symbolProxy.buildPath(path, symbolProxyShape);
}
......@@ -52,9 +53,8 @@ define(function (require) {
/**
* Update symbols draw by new data
* @param {module:echarts/data/List} data
* @param {module:echarts/ExtensionAPI} api
*/
largeSymbolProto.updateData = function (data, api) {
largeSymbolProto.updateData = function (data) {
var symbolEl = this._symbolEl;
var seriesModel = data.hostModel;
......@@ -63,7 +63,11 @@ define(function (require) {
points: data.mapArray(data.getItemLayout),
sizes: data.mapArray(
function (idx) {
return data.getItemVisual(idx, 'symbolSize');
var size = data.getItemVisual(idx, 'symbolSize');
if (!zrUtil.isArray(size)) {
size = [size, size];
}
return size;
}
)
});
......
src/chart/helper/LineDraw.js
浏览文件 @ 8fae2c46
/**
* @module echarts/component/marker/LineDraw
*/
define(function (require) {
var graphic = require('../../util/graphic');
var numberUtil = require('../../util/number');
var zrUtil = require('zrender/core/util');
var symbolUtil = require('../../util/symbol');
var vector = require('zrender/core/vector');
function tangentRotation(p1, p2) {
return -Math.PI / 2 - Math.atan2(
p2[1] - p1[1], p2[0] - p1[0]
);
}
/**
* @inner
*/
function createSymbol(data, idx) {
var color = data.getItemVisual(idx, 'color');
var symbolType = data.getItemVisual(idx, 'symbol');
var symbolSize = data.getItemVisual(idx, 'symbolSize');
if (symbolType === 'none') {
return;
}
if (!zrUtil.isArray(symbolSize)) {
symbolSize = [symbolSize, symbolSize];
}
var symbolPath = symbolUtil.createSymbol(
symbolType, -symbolSize[0] / 2, -symbolSize[1] / 2,
symbolSize[0], symbolSize[1], color
);
return symbolPath;
}
function createLine(points) {
var line = new graphic[points[2] ? 'BezierCurve' : 'Line']({
name: 'line',
shape: {
x1: points[0][0],
y1: points[0][1],
x2: points[1][0],
y2: points[1][1]
}
});
if (points[2]) {
line.setShape({
cpx1: points[2][0],
cpy1: points[2][1]
});
}
return line;
}
function isSymbolArrow(symbol) {
return symbol.type === 'symbol' && symbol.shape.symbolType === 'arrow';
}
function updateSymbolBeforeLineUpdate () {
var lineGroup = this;
var line = lineGroup.childOfName('line');
var symbolFrom = lineGroup.childOfName('fromSymbol');
var symbolTo = lineGroup.childOfName('toSymbol');
var label = lineGroup.childOfName('label');
var fromPos = line.pointAt(0);
var toPos = line.pointAt(line.shape.percent);
var d = vector.sub([], toPos, fromPos);
vector.normalize(d, d);
if (symbolFrom) {
symbolFrom.attr('position', fromPos);
// Rotate the arrow
// FIXME Hard coded ?
if (isSymbolArrow(symbolTo)) {
symbolTo.attr('rotation', tangentRotation(fromPos, toPos));
}
}
if (symbolTo) {
symbolTo.attr('position', toPos);
if (isSymbolArrow(symbolFrom)) {
symbolFrom.attr('rotation', tangentRotation(toPos, fromPos));
}
}
label.attr('position', toPos);
var textPosition;
var textAlign;
var textBaseline;
// End
if (label.__position === 'end') {
textPosition = [d[0] * 5 + toPos[0], d[1] * 5 + toPos[1]];
textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
textBaseline = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
}
// Start
else {
textPosition = [-d[0] * 5 + fromPos[0], -d[1] * 5 + fromPos[1]];
textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
textBaseline = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
}
label.attr({
style: {
textBaseline: textBaseline,
textAlign: textAlign
},
position: textPosition
});
}
/**
* @alias module:echarts/component/marker/LineDraw
* @constructor
*/
function LineDraw() {
this.group = new graphic.Group();
}
......@@ -9,78 +124,152 @@ define(function (require) {
var lineDrawProto = LineDraw.prototype;
/**
* @param {module:echarts/data/List} data
* @param {module:echarts/data/List} lineData
* @param {module:echarts/data/List} [fromData]
* @param {module:echarts/data/List} [toData]
* @param {module:echarts/ExtensionAPI} api
* @param {Function} [isIgnore]
*/
lineDrawProto.updateData = function (data, api, isIgnore) {
lineDrawProto.updateData = function (lineData, fromData, toData, api) {
var oldFromData = this._fromData;
var oldToData = this._toData;
var oldLineData = this._lineData;
var group = this.group;
var oldData = this._data;
// var seriesModel = data.hostModel;
var seriesModel = lineData.hostModel;
data.diff(oldData)
lineData.diff(oldLineData)
.add(function (idx) {
var shape = data.getItemLayout(idx);
var line = new graphic[shape.cpx1 != null ? 'BezierCurve' : 'Line']({
shape: shape
var linePoints = lineData.getItemLayout(idx);
var itemModel = lineData.getItemModel(idx);
var labelModel = itemModel.getModel('label.normal');
var textStyleModel = labelModel.getModel('textStyle');
var lineGroup = new graphic.Group();
var line = createLine(linePoints);
line.shape.percent = 0;
graphic.initProps(line, {
shape: {
percent: 1
}
}, seriesModel);
lineGroup.add(line);
var label = new graphic.Text({
name: 'label',
style: {
text: seriesModel.getFormattedLabel(idx, 'normal')
|| numberUtil.round(seriesModel.getData().getRawValue(idx)),
textFont: textStyleModel.getFont(),
fill: textStyleModel.get('color') || lineData.getItemVisual(idx, 'color')
}
});
lineGroup.add(label);
label.__position = labelModel.get('position');
if (fromData) {
var symbolFrom = createSymbol(fromData, idx);
symbolFrom.name = 'fromSymbol';
// symbols must added after line to make sure
// it will be updated after line#update.
// Or symbol position and rotation update in line#beforeUpdate will be one frame slow
lineGroup.add(symbolFrom);
}
if (toData) {
var symbolTo = createSymbol(toData, idx);
symbolTo.name = 'toSymbol';
lineGroup.add(symbolTo);
}
data.setItemGraphicEl(idx, line);
group.add(line);
// Update symbol position and rotation
lineGroup.beforeUpdate = updateSymbolBeforeLineUpdate;
lineData.setItemGraphicEl(idx, lineGroup);
group.add(lineGroup);
})
.update(function (newIdx, oldIdx) {
var line = oldData.getItemGraphicEl(oldIdx);
var shape = data.getItemLayout(newIdx);
if (shape.cpx1 != null && line.type === 'line') {
var oldShape = line.shape;
line = new graphic.BezierCurve({
shape: oldShape
});
line.setShape({
cpx1: (oldShape.x1 + oldShape.x2) / 2,
cpy1: (oldShape.y1 + oldShape.y2) / 2
});
var lineGroup = oldLineData.getItemGraphicEl(oldIdx);
var line = lineGroup.childOfName('line');
var linePoints = lineData.getItemLayout(newIdx);
var p1 = linePoints[0];
var p2 = linePoints[1];
var cp1 = linePoints[2];
var target = {
shape: {
x1: p1[0],
y1: p1[1],
x2: p2[0],
y2: p2[1]
}
};
if (cp1) {
target.shape.cpx1 = cp1[0];
target.shape.cpy1 = cp1[1];
}
api.updateGraphicEl(line, {
shape: shape
});
data.setItemGraphicEl(newIdx, line);
group.add(line);
graphic.updateProps(line, target, seriesModel);
// Symbol changed
if (fromData) {
var fromSymbolType = fromData.getItemVisual(newIdx, 'symbol');
if (!oldFromData || fromSymbolType !== oldFromData.getItemVisual(oldIdx, 'symbol')) {
var symbolFrom = createSymbol(fromData, newIdx);
symbolFrom.name = 'fromSymbol';
lineGroup.remove(line.childOfName('fromSymbol'));
lineGroup.add(symbolFrom);
}
}
if (toData) {
var toSymbolType = toData.getItemVisual(newIdx, 'symbol');
// Symbol changed
if (!oldToData || toSymbolType !== oldToData.getItemVisual(oldIdx, 'symbol')) {
var symbolTo = createSymbol(toData, newIdx);
symbolTo.name = 'toSymbol';
lineGroup.remove(line.childOfName('toSymbol'));
lineGroup.add(symbolTo);
}
}
lineData.setItemGraphicEl(newIdx, lineGroup);
group.add(lineGroup);
})
.remove(function (idx) {
group.remove(oldData.getItemGraphicEl(idx));
group.remove(oldLineData.getItemGraphicEl(idx));
})
.execute();
this._data = data;
lineData.eachItemGraphicEl(function (lineGroup, idx) {
var line = lineGroup.childOfName('line');
var itemModel = lineData.getItemModel(idx);
this.updateVisual();
};
line.setStyle(zrUtil.defaults(
{
stroke: lineData.getItemVisual(idx, 'color')
},
itemModel.getModel('lineStyle.normal').getLineStyle()
));
lineDrawProto.updateVisual = function () {
var data = this._data;
data.eachItemGraphicEl(function (el, idx) {
var itemModel = data.getItemModel(idx);
el.setStyle(itemModel.getModel('lineStyle.normal').getLineStyle());
graphic.setHoverStyle(
line,
itemModel.getModel('lineStyle.emphasis').getLineStyle()
);
});
this._lineData = lineData;
this._fromData = fromData;
this._toData = toData;
};
lineDrawProto.updateLayout = function () {
var data = this._data;
data.eachItemGraphicEl(function (el, idx) {
var points = data.getItemLayout(idx);
data.setShape({
x1: points[0][0],
y1: points[0][1],
x2: points[1][0],
y2: points[1][1]
});
});
};
lineDrawProto.remove = function () {
this.group.removeAll();
};
return LineDraw;
......
src/chart/helper/Symbol.js
浏览文件 @ 8fae2c46
......@@ -15,17 +15,18 @@ define(function (require) {
* @constructor
* @extends {module:zrender/graphic/Group}
*/
function Symbol(data, idx, api) {
function Symbol(data, idx) {
graphic.Group.call(this);
this.updateData(data, idx, api);
this.updateData(data, idx);
}
var symbolProto = Symbol.prototype;
symbolProto._createSymbol = function (symbolType, data, idx, api) {
symbolProto._createSymbol = function (symbolType, data, idx) {
this.removeAll();
var seriesModel = data.hostModel;
var color = data.getItemVisual(idx, 'color');
var symbolPath = symbolUtil.createSymbol(
......@@ -40,9 +41,9 @@ define(function (require) {
var size = normalizeSymbolSize(data.getItemVisual(idx, 'symbolSize'));
api.initGraphicEl(symbolPath, {
graphic.initProps(symbolPath, {
scale: size
});
}, seriesModel);
this._symbolType = symbolType;
......@@ -76,27 +77,31 @@ define(function (require) {
* Update symbol properties
* @param {module:echarts/data/List} data
* @param {number} idx
* @param {module:echarts/ExtensionAPI} api
*/
symbolProto.updateData = function (data, idx, api) {
symbolProto.updateData = function (data, idx) {
var symbolType = data.getItemVisual(idx, 'symbol') || 'circle';
var seriesModel = data.hostModel;
if (symbolType !== this._symbolType) {
this._createSymbol(symbolType, data, idx, api);
this._createSymbol(symbolType, data, idx);
}
else {
var symbolPath = this.childAt(0);
var size = normalizeSymbolSize(data.getItemVisual(idx, 'symbolSize'));
api.updateGraphicEl(symbolPath, {
graphic.updateProps(symbolPath, {
scale: size
});
}, seriesModel);
}
this._updateCommon(data, idx);
this._seriesModel = seriesModel;
};
// Update common properties
var normalStyleAccessPath = ['itemStyle', 'normal'];
var emphasisStyleAccessPath = ['itemStyle', 'emphasis'];
var normalLabelAccessPath = ['label', 'normal'];
var emphasisLabelAccessPath = ['label', 'emphasis'];
symbolProto._updateCommon = function (data, idx) {
var symbolPath = this.childAt(0);
......@@ -118,8 +123,8 @@ define(function (require) {
normalItemStyleModel.getItemStyle(['color'])
);
var labelModel = itemModel.getModel('label.normal');
var hoverLabelModel = itemModel.getModel('label.emphasis');
var labelModel = itemModel.getModel(normalLabelAccessPath);
var hoverLabelModel = itemModel.getModel(emphasisLabelAccessPath);
var lastDim = data.dimensions[data.dimensions.length - 1];
var labelText = seriesModel.getFormattedLabel(idx, 'normal')
|| data.get(lastDim, idx);
......@@ -144,21 +149,21 @@ define(function (require) {
var size = normalizeSymbolSize(data.getItemVisual(idx, 'symbolSize'));
function onEmphasis() {
var ratio = size[1] / size[0];
this.animateTo({
scale: [
Math.max(size[0] * 1.1, size[0] + 6),
Math.max(size[1] * 1.1, size[1] + 6 * ratio)
]
}, 400, 'elasticOut');
}
function onNormal() {
this.animateTo({
scale: size
}, 400, 'elasticOut');
}
if (itemModel.getShallow('hoverAnimation')) {
var onEmphasis = function() {
var ratio = size[1] / size[0];
this.animateTo({
scale: [
Math.max(size[0] * 1.1, size[0] + 6),
Math.max(size[1] * 1.1, size[1] + 6 * ratio)
]
}, 400, 'elasticOut');
};
var onNormal = function() {
this.animateTo({
scale: size
}, 400, 'elasticOut');
};
symbolPath.on('mouseover', onEmphasis)
.on('mouseout', onNormal)
.on('emphasis', onEmphasis)
......@@ -166,13 +171,13 @@ define(function (require) {
}
};
symbolProto.fadeOut = function (cb, api) {
symbolProto.fadeOut = function (cb) {
var symbolPath = this.childAt(0);
// Not show text when animating
symbolPath.style.text = '';
api.updateGraphicEl(symbolPath, {
graphic.updateProps(symbolPath, {
scale: [0, 0]
}, cb);
}, this._seriesModel, cb);
};
zrUtil.inherits(Symbol, graphic.Group);
......
src/chart/helper/SymbolDraw.js
浏览文件 @ 8fae2c46
......@@ -8,9 +8,13 @@ define(function (require) {
/**
* @constructor
* @alias module:echarts/chart/helper/SymbolDraw
* @param {module:zrender/graphic/Group} [symbolCtor]
*/
function SymbolDraw() {
function SymbolDraw(symbolCtor) {
this.group = new graphic.Group();
this._symbolCtor = symbolCtor || Symbol;
}
var symbolDrawProto = SymbolDraw.prototype;
......@@ -18,11 +22,11 @@ define(function (require) {
/**
* Update symbols draw by new data
* @param {module:echarts/data/List} data
* @param {module:echarts/ExtensionAPI} api
* @param {Array.<boolean>} [isIgnore]
*/
symbolDrawProto.updateData = function (data, api, isIgnore) {
symbolDrawProto.updateData = function (data, isIgnore) {
var group = this.group;
var seriesModel = data.hostModel;
var oldData = this._data;
data.diff(oldData)
......@@ -31,7 +35,7 @@ define(function (require) {
data.hasValue(newIdx) && !(isIgnore && isIgnore(newIdx))
&& data.getItemVisual(newIdx, 'symbol') !== 'none'
) {
var symbolEl = new Symbol(data, newIdx, api);
var symbolEl = new Symbol(data, newIdx);
symbolEl.attr('position', data.getItemLayout(newIdx));
data.setItemGraphicEl(newIdx, symbolEl);
group.add(symbolEl);
......@@ -48,14 +52,14 @@ define(function (require) {
}
var point = data.getItemLayout(newIdx);
if (!symbolEl) {
symbolEl = new Symbol(data, newIdx, api);
symbolEl = new Symbol(data, newIdx);
symbolEl.attr('position', point);
}
else {
symbolEl.updateData(data, newIdx, api);
api.updateGraphicEl(symbolEl, {
symbolEl.updateData(data, newIdx);
graphic.updateProps(symbolEl, {
position: point
});
}, seriesModel);
}
// Add back
......@@ -67,7 +71,7 @@ define(function (require) {
var el = oldData.getItemGraphicEl(oldIdx);
el && el.fadeOut(function () {
group.remove(el);
}, api);
});
})
.execute();
......@@ -84,7 +88,7 @@ define(function (require) {
}
};
symbolDrawProto.remove = function (api, enableAnimation) {
symbolDrawProto.remove = function (enableAnimation) {
var group = this.group;
var data = this._data;
if (data) {
......@@ -92,7 +96,7 @@ define(function (require) {
data.eachItemGraphicEl(function (el) {
el.fadeOut(function () {
group.remove(el);
}, api);
});
});
}
else {
......
src/chart/line/LineSeries.js
浏览文件 @ 8fae2c46
......@@ -64,11 +64,13 @@ define(function(require) {
// 拐点图形类型
symbol: 'emptyCircle',
// 拐点图形大小
symbolSize: 4
symbolSize: 4,
// 拐点图形旋转控制
// symbolRotate: null,
// 标志图形默认只有主轴显示（随主轴标签间隔隐藏策略）
// showAllSymbol: false
animationEasing: 'linear'
}
});
});
\ No newline at end of file
src/chart/line/LineView.js
浏览文件 @ 8fae2c46
......@@ -135,7 +135,7 @@ define(function(require) {
!(polyline
&& prevCoordSys.type === coordSys.type)
) {
symbolDraw.updateData(data, api, isSymbolIgnore);
symbolDraw.updateData(data, isSymbolIgnore);
polyline = this._newPolyline(group, points, coordSys, hasAnimation);
if (isAreaChart) {
polygon = this._newPolygon(
......@@ -145,19 +145,19 @@ define(function(require) {
);
}
lineGroup.setClipPath(
this._createClipShape(coordSys, true, api)
this._createClipShape(coordSys, true, seriesModel)
);
}
else {
// Update clipPath
if (hasAnimation) {
lineGroup.setClipPath(
this._createClipShape(coordSys, false, api)
this._createClipShape(coordSys, false, seriesModel)
);
}
// Always update, or it is wrong in the case turning on legend because points is not changed
symbolDraw.updateData(data, api, isSymbolIgnore);
symbolDraw.updateData(data, isSymbolIgnore);
// Stop symbol animation and sync with line points
// FIXME performance?
......@@ -360,6 +360,7 @@ define(function(require) {
_updateAnimation: function (data, stackedOnPoints, coordSys, api) {
var polyline = this._polyline;
var polygon = this._polygon;
var seriesModel = data.hostModel;
var diff = lineAnimationDiff(
this._data, data,
......@@ -368,23 +369,23 @@ define(function(require) {
);
polyline.shape.points = diff.current;
api.updateGraphicEl(polyline, {
graphic.updateProps(polyline, {
shape: {
points: diff.next
}
});
}, seriesModel);
if (polygon) {
polygon.setShape({
points: diff.current,
stackedOnPoints: diff.stackedOnCurrent
});
api.updateGraphicEl(polygon, {
graphic.updateProps(polygon, {
shape: {
points: diff.next,
stackedOnPoints: diff.stackedOnNext
}
});
}, seriesModel);
}
var updatedDataInfo = [];
......@@ -413,13 +414,13 @@ define(function(require) {
}
},
_createClipShape: function (coordSys, hasAnimation, api) {
_createClipShape: function (coordSys, hasAnimation, seriesModel) {
return coordSys.type === 'polar'
? this._createPolarClipShape(coordSys, hasAnimation, api)
: this._createGridClipShape(coordSys, hasAnimation, api);
? this._createPolarClipShape(coordSys, hasAnimation, seriesModel)
: this._createGridClipShape(coordSys, hasAnimation, seriesModel);
},
_createGridClipShape: function (cartesian, hasAnimation, api) {
_createGridClipShape: function (cartesian, hasAnimation, seriesModel) {
var xExtent = getAxisExtentWithGap(cartesian.getAxis('x'));
var yExtent = getAxisExtentWithGap(cartesian.getAxis('y'));
......@@ -434,18 +435,18 @@ define(function(require) {
if (hasAnimation) {
clipPath.shape[cartesian.getBaseAxis().isHorizontal() ? 'width' : 'height'] = 0;
api.initGraphicEl(clipPath, {
graphic.initProps(clipPath, {
shape: {
width: xExtent[1] - xExtent[0],
height: yExtent[1] - yExtent[0]
}
});
}, seriesModel);
}
return clipPath;
},
_createPolarClipShape: function (polar, hasAnimation, api) {
_createPolarClipShape: function (polar, hasAnimation, seriesModel) {
var angleAxis = polar.getAngleAxis();
var radiusAxis = polar.getRadiusAxis();
......@@ -468,20 +469,20 @@ define(function(require) {
if (hasAnimation) {
clipPath.shape.endAngle = -angleExtent[0] * RADIAN;
api.initGraphicEl(clipPath, {
graphic.initGraphicEl(clipPath, {
shape: {
endAngle: -angleExtent[1] * RADIAN
}
});
}, seriesModel);
}
return clipPath;
},
remove: function (ecModel, api) {
remove: function (ecModel) {
var group = this.group;
group.remove(this._lineGroup);
this._symbolDraw.remove(api, true);
this._symbolDraw.remove(true);
}
});
});
\ No newline at end of file
src/chart/map/mapVisual.js
浏览文件 @ 8fae2c46
......@@ -13,5 +13,5 @@ define(function (require) {
'color': color
});
});
}
};
});
\ No newline at end of file
src/chart/pie/PieSeries.js
浏览文件 @ 8fae2c46
......@@ -47,7 +47,7 @@ define(function(require) {
var data = this._data;
var params = seriesModelProto.getDataParams.call(this, dataIndex);
// FIXME toFixed?
params.percent = (data.get('value', dataIndex) / data.getSum('value') * 100).toFixed(2);
params.percent = +(data.get('value', dataIndex) / data.getSum('value') * 100).toFixed(2);
params.$vars.push('percent');
return params;
......@@ -129,7 +129,9 @@ define(function(require) {
borderColor: 'rgba(0,0,0,0)',
borderWidth: 1
}
}
},
animationEasing: 'cubicOut'
}
});
......
src/chart/pie/PieView.js
浏览文件 @ 8fae2c46
......@@ -64,7 +64,7 @@ define(function (require) {
* @constructor
* @extends {module:zrender/graphic/Group}
*/
function PiePiece(data, idx, api) {
function PiePiece(data, idx) {
graphic.Group.call(this);
......@@ -75,7 +75,7 @@ define(function (require) {
this.add(polyline);
this.add(text);
this.updateData(data, idx, api, true);
this.updateData(data, idx, true);
function onEmphasis() {
polyline.ignore = polyline.hoverIgnore;
......@@ -106,7 +106,7 @@ define(function (require) {
};
}
piePieceProto.updateData = function (data, idx, api, firstCreate) {
piePieceProto.updateData = function (data, idx, firstCreate) {
var sector = this.childAt(0);
var labelLine = this.childAt(1);
......@@ -120,33 +120,33 @@ define(function (require) {
if (firstCreate) {
sector.setShape(sectorShape);
sector.shape.endAngle = layout.startAngle;
api.updateGraphicEl(sector, {
graphic.updateProps(sector, {
shape: {
endAngle: layout.endAngle
}
});
}, seriesModel);
}
else {
api.updateGraphicEl(sector, {
graphic.updateProps(sector, {
shape: sectorShape
});
}
var labelLayout = layout.label;
api.updateGraphicEl(labelLine, {
graphic.updateProps(labelLine, {
shape: {
points: labelLayout.linePoints || [
[labelLayout.x, labelLayout.y], [labelLayout.x, labelLayout.y], [labelLayout.x, labelLayout.y]
]
}
});
api.updateGraphicEl(labelText, {
}, seriesModel);
graphic.updateProps(labelText, {
style: {
x: labelLayout.x,
y: labelLayout.y
}
});
}, seriesModel);
labelText.attr({
style: {
textAlign: labelLayout.textAlign,
......@@ -276,7 +276,7 @@ define(function (require) {
data.diff(oldData)
.add(function (idx) {
var piePiece = new PiePiece(data, idx, api);
var piePiece = new PiePiece(data, idx);
if (isFirstRender) {
piePiece.eachChild(function (child) {
child.stopAnimation(true);
......@@ -292,7 +292,7 @@ define(function (require) {
.update(function (newIdx, oldIdx) {
var piePiece = oldData.getItemGraphicEl(oldIdx);
piePiece.updateData(data, newIdx, api);
piePiece.updateData(data, newIdx);
selectedMode
? piePiece.on('click', onSectorClick)
......@@ -312,7 +312,7 @@ define(function (require) {
var removeClipPath = zrUtil.bind(group.removeClipPath, group);
group.setClipPath(this._createClipPath(
shape.cx, shape.cy, r, shape.startAngle, shape.clockwise, removeClipPath, api
shape.cx, shape.cy, r, shape.startAngle, shape.clockwise, removeClipPath, seriesModel
));
}
......@@ -320,7 +320,7 @@ define(function (require) {
},
_createClipPath: function (
cx, cy, r, startAngle, clockwise, cb, api
cx, cy, r, startAngle, clockwise, cb, seriesModel
) {
var clipPath = new graphic.Sector({
shape: {
......@@ -334,11 +334,11 @@ define(function (require) {
}
});
api.initGraphicEl(clipPath, {
graphic.initProps(clipPath, {
shape: {
endAngle: startAngle + (clockwise ? 1 : -1) * Math.PI * 2
}
}, cb);
}, seriesModel, cb);
return clipPath;
}
......
src/chart/radar/RadarView.js
浏览文件 @ 8fae2c46
......@@ -51,15 +51,15 @@ define(function (require) {
if (polylineShape.points.length !== points.length) {
polygonShape.points = getInitialPoints();
polylineShape.points = getInitialPoints();
api.initGraphicEl(polyline, target);
api.initGraphicEl(polygon, target);
graphic.initProps(polyline, target, seriesModel);
graphic.initProps(polygon, target, seriesModel);
}
else {
api.updateGraphicEl(polyline, target);
api.updateGraphicEl(polygon, target);
graphic.updateProps(polyline, target, seriesModel);
graphic.updateProps(polygon, target, seriesModel);
}
this._symbolDraw.updateData(data, api);
this._symbolDraw.updateData(data);
polyline.setStyle(
zrUtil.extend(
......
src/chart/scatter/ScatterSeries.js
浏览文件 @ 8fae2c46
......@@ -45,6 +45,7 @@ define(function (require) {
// label: {
// normal: {
// show: false
// distance: 5,
// formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
// position: 默认自适应，水平布局为'top'，垂直布局为'right'，可选为
// 'inside'|'left'|'right'|'top'|'bottom'
......
src/chart/scatter/ScatterView.js
浏览文件 @ 8fae2c46
......@@ -22,7 +22,7 @@ define(function (require) {
? largeSymbolDraw : normalSymbolDraw;
this._symbolDraw = symbolDraw;
symbolDraw.updateData(data, api);
symbolDraw.updateData(data);
group.add(symbolDraw.group);
group.remove(
......
src/component/helper/MapDraw.js
浏览文件 @ 8fae2c46
......@@ -175,13 +175,14 @@ define(function (require) {
) {
var text = new graphic.Text({
style: {
text: region.name,
text: showLabel ? region.name : '',
fill: textStyleModel.get('color'),
textFont: textStyleModel.getFont(),
textAlign: 'center',
textBaseline: 'middle'
},
hoverStyle: {
text: hoverShowLabel ? region.name : '',
fill: hoverTextStyleModel.get('color'),
textFont: hoverTextStyleModel.getFont()
},
......@@ -190,17 +191,6 @@ define(function (require) {
z2: 10,
silent: true
});
var emphasisLabel = function() {
text.attr('ignore', !hoverShowLabel);
};
var normalLabel = function() {
text.attr('ignore', !showLabel);
};
regionGroup.on('mouseover', emphasisLabel)
.on('mouseout', normalLabel)
.on('emphasis', emphasisLabel)
.on('normal', normalLabel);
text.ignore = !showLabel;
regionGroup.add(text);
}
......
src/component/marker/MarkLineView.js
浏览文件 @ 8fae2c46
......@@ -10,7 +10,7 @@ define(function (require) {
var markerHelper = require('./markerHelper');
var SeriesMarkLine = require('./SeriesMarkLine');
var LineDraw = require('../../chart/helper/LineDraw');
var markLineTransform = function (data, coordSys, baseAxis, valueAxis, item) {
// Special type markLine like 'min', 'max', 'average'
......@@ -31,7 +31,7 @@ define(function (require) {
var extent = data.getDataExtent(valueAxis.dim, true);
delete mlFrom.type; // Remove type
mlFrom.type = null;
// FIXME Polar should use circle
mlFrom[baseAxisKey] = baseScaleExtent[0];
......@@ -47,15 +47,20 @@ define(function (require) {
mlFrom[valueAxisKey] = mlTo[valueAxisKey] = value;
item = [mlFrom, mlTo, { // Extra option for tooltip and label
__rawValue: value,
name: item.name
__rawValue: value
}];
}
return [
item = [
markerHelper.dataTransform(data, coordSys, item[0]),
markerHelper.dataTransform(data, coordSys, item[1]),
item[2]
{}
];
// Merge from option and to option into line option
zrUtil.merge(item[2], item[0]);
zrUtil.merge(item[2], item[1]);
return item;
};
function markLineFilter(coordSys, dimensionInverse, item) {
......@@ -102,9 +107,9 @@ define(function (require) {
},
render: function (markLineModel, ecModel, api) {
var seriesMarkLineMap = this._markLineMap;
for (var name in seriesMarkLineMap) {
seriesMarkLineMap[name].__keep = false;
var lineDrawMap = this._markLineMap;
for (var name in lineDrawMap) {
lineDrawMap[name].__keep = false;
}
ecModel.eachSeries(function (seriesModel) {
......@@ -112,9 +117,9 @@ define(function (require) {
mlModel && this._renderSeriesML(seriesModel, mlModel, ecModel, api);
}, this);
for (var name in seriesMarkLineMap) {
if (!seriesMarkLineMap[name].__keep) {
this.group.remove(seriesMarkLineMap[name].group);
for (var name in lineDrawMap) {
if (!lineDrawMap[name].__keep) {
this.group.remove(lineDrawMap[name].group);
}
}
},
......@@ -124,18 +129,19 @@ define(function (require) {
var seriesName = seriesModel.name;
var seriesData = seriesModel.getData();
var seriesMarkLineMap = this._markLineMap;
var seriesMarkLine = seriesMarkLineMap[seriesName];
if (!seriesMarkLine) {
seriesMarkLine = seriesMarkLineMap[seriesName] = new SeriesMarkLine();
var lineDrawMap = this._markLineMap;
var lineDraw = lineDrawMap[seriesName];
if (!lineDraw) {
lineDraw = lineDrawMap[seriesName] = new LineDraw();
}
this.group.add(seriesMarkLine.group);
this.group.add(lineDraw.group);
var mlData = createList(coordSys, seriesData, mlModel);
var dims = coordSys.dimensions;
var fromData = mlData.from;
var toData = mlData.to;
var lineData = mlData.line;
// Line data for tooltip and formatter
var lineData = mlData.line;
......@@ -155,19 +161,32 @@ define(function (require) {
symbolSize = [symbolSize, symbolSize];
}
// Update visual and layout of from symbol and to symbol
mlData.from.each(function (idx) {
updateDataVisualAndLayout(fromData, idx, true);
updateDataVisualAndLayout(toData, idx);
});
seriesMarkLine.update(
fromData, toData, mlModel, api, ecModel.get('animation')
);
// Update visual and layout of line
lineData.each(function (idx) {
var lineColor = lineData.getItemModel(idx).get('lineStyle.normal.color');
lineData.setItemVisual(idx, {
color: lineColor || fromData.getItemVisual(idx, 'color')
});
lineData.setItemLayout(idx, [
fromData.getItemLayout(idx),
toData.getItemLayout(idx)
]);
});
lineDraw.updateData(lineData, fromData, toData, api);
// Set host model for tooltip
// FIXME
mlData.from.eachItemGraphicEl(function (el, idx) {
el.hostModel = mlModel;
mlData.line.eachItemGraphicEl(function (el, idx) {
el.eachChild(function (child) {
child.hostModel = mlModel;
});
});
function updateDataVisualAndLayout(data, idx, isFrom) {
......@@ -197,7 +216,7 @@ define(function (require) {
});
}
seriesMarkLine.__keep = true;
lineDraw.__keep = true;
}
});
......
src/component/marker/MarkPointView.js
浏览文件 @ 8fae2c46
......@@ -114,7 +114,7 @@ define(function (require) {
});
// TODO Text are wrong
symbolDraw.updateData(mpData, api);
symbolDraw.updateData(mpData);
this.group.add(symbolDraw.group);
// Set host model for tooltip
......
src/component/marker/SeriesMarkLine.js 已删除 100644 → 0
浏览文件 @ 198a7877
/**
* @module echarts/component/marker/SeriesMarkLine
*/
define(function (require) {
var graphic = require('../../util/graphic');
var numberUtil = require('../../util/number');
var zrUtil = require('zrender/core/util');
var symbolUtil = require('../../util/symbol');
var vector = require('zrender/core/vector');
function tangentRotation(p1, p2) {
return -Math.PI / 2 - Math.atan2(
p2[1] - p1[1], p2[0] - p1[0]
);
}
/**
* @inner
*/
function createSymbol(data, idx) {
var color = data.getItemVisual(idx, 'color');
var symbolType = data.getItemVisual(idx, 'symbol');
var symbolSize = data.getItemVisual(idx, 'symbolSize');
if (symbolType === 'none') {
return;
}
if (!zrUtil.isArray(symbolSize)) {
symbolSize = [symbolSize, symbolSize];
}
var symbolPath = symbolUtil.createSymbol(
symbolType, -symbolSize[0] / 2, -symbolSize[1] / 2,
symbolSize[0], symbolSize[1], color
);
return symbolPath;
}
function isSymbolArrow(symbol) {
return symbol.type === 'symbol' && symbol.shape.symbolType === 'arrow';
}
function updateSymbolBeforeLineUpdate () {
var line = this;
var symbolFrom = line.__symbolFrom;
var symbolTo = line.__symbolTo;
var label = line.__label;
var lineShape = line.shape;
var fromPos = [lineShape.x1, lineShape.y1];
var toPos = [lineShape.x2, lineShape.y2];
var d = vector.sub([], toPos, fromPos);
vector.normalize(d, d);
symbolFrom.attr('position', fromPos);
symbolTo.attr('position', toPos);
// Rotate the arrow
// FIXME Hard coded ?
if (isSymbolArrow(symbolTo)) {
symbolTo.attr('rotation', tangentRotation(fromPos, toPos));
}
if (isSymbolArrow(symbolFrom)) {
symbolFrom.attr('rotation', tangentRotation(toPos, fromPos));
}
label.attr('position', toPos);
var textPosition;
var textAlign;
var textBaseline;
// End
if (line.__labelPosition === 'end') {
textPosition = [d[0] * 5 + toPos[0], d[1] * 5 + toPos[1]];
textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
textBaseline = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
}
// Start
else {
textPosition = [-d[0] * 5 + fromPos[0], -d[1] * 5 + fromPos[1]];
textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
textBaseline = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
}
label.attr({
style: {
textBaseline: textBaseline,
textAlign: textAlign
},
position: textPosition
});
}
/**
* @alias module:echarts/component/marker/SeriesMarkLine
* @constructor
*/
function SeriesMarkLine() {
this.group = new graphic.Group();
}
var seriesMarkLineProto = SeriesMarkLine.prototype;
/**
* @param {module:echarts/data/List} fromData
* @param {module:echarts/data/List} toData
*/
seriesMarkLineProto.update = function (
fromData, toData, mlModel, api, enableAnimation
) {
var oldFromData = this._fromData;
var oldToData = this._toData;
var group = this.group;
fromData.diff(oldFromData)
.add(function (idx) {
var p1 = fromData.getItemLayout(idx);
var p2 = toData.getItemLayout(idx);
var itemModel = fromData.getItemModel(idx);
var labelModel = itemModel.getModel('label.normal');
var textStyleModel = labelModel.getModel('textStyle');
var line = new graphic.Line({
shape: {
x1: p1[0],
y1: p1[1],
x2: p2[0],
y2: p2[1]
}
});
if (enableAnimation) {
line.shape.x2 = p1[0];
line.shape.y2 = p1[1];
line.animateTo({
shape: {
x2: p2[0],
y2: p2[1]
}
}, 1000);
}
var symbolFrom = createSymbol(fromData, idx);
var symbolTo = createSymbol(toData, idx);
var label = new graphic.Text({
style: {
text: mlModel.getFormattedLabel(idx, 'normal')
|| numberUtil.round(mlModel.getData().getRawValue(idx)),
textFont: textStyleModel.getFont(),
fill: textStyleModel.get('color') || fromData.getItemVisual(idx, 'color')
}
});
group.add(line);
// symbols must added after line to make sure
// it will be updated after line#update.
// Or symbol position and rotation update in line#beforeUpdate will be one frame slow
group.add(symbolFrom);
group.add(symbolTo);
group.add(label);
line.__symbolFrom = symbolFrom;
line.__symbolTo = symbolTo;
line.__label = label;
line.__labelPosition = labelModel.get('position');
// Update symbol position and rotation
line.beforeUpdate = updateSymbolBeforeLineUpdate;
fromData.setItemGraphicEl(idx, line);
})
.update(function (newIdx, oldIdx) {
var line = oldFromData.getItemGraphicEl(oldIdx);
var p1 = fromData.getItemLayout(newIdx);
var p2 = toData.getItemLayout(newIdx);
var fromSymbolType = fromData.getItemVisual(newIdx, 'symbol');
var toSymbolType = toData.getItemVisual(newIdx, 'symbol');
api.updateGraphicEl(line, {
shape: {
x1: p1[0],
y1: p1[1],
x2: p2[0],
y2: p2[1]
}
});
// Symbol changed
if (fromSymbolType !== oldFromData.getItemVisual(oldIdx, 'symbol')) {
line.__symbolFrom = createSymbol(fromData, newIdx, p2, p1);
}
// Symbol changed
if (toSymbolType !== oldToData.getItemVisual(oldIdx, 'symbol')) {
line.__symbolTo = createSymbol(toData, newIdx, p1, p2);
}
fromData.setItemGraphicEl(newIdx, line);
group.add(line);
})
.remove(function (idx) {
var line = oldFromData.getItemGraphicEl(idx);
group.remove(line);
})
.execute();
fromData.eachItemGraphicEl(function (line, idx) {
var itemModel = fromData.getItemModel(idx);
line.setStyle(zrUtil.defaults(
{
stroke: fromData.getItemVisual(idx, 'color')
},
itemModel.getModel('lineStyle.normal').getLineStyle()
));
graphic.setHoverStyle(
line,
itemModel.getModel('lineStyle.emphasis').getLineStyle()
);
});
this._fromData = fromData;
this._toData = toData;
};
return SeriesMarkLine;
});
\ No newline at end of file
src/component/tooltip.js
浏览文件 @ 8fae2c46
......@@ -118,11 +118,6 @@ define(function (require) {
_axisPointers: {},
init: function (ecModel, api) {
var zr = api.getZr();
zr.on('mousemove', this._mouseMove, this);
zr.on('mouseout', this._hide, this);
var tooltipContent = new TooltipContent(api.getDom(), api);
this._tooltipContent = tooltipContent;
},
......@@ -170,6 +165,8 @@ define(function (require) {
tooltipContent.update();
tooltipContent.enterable = tooltipModel.get('enterbale');
this._alwaysShowContent = tooltipModel.get('alwaysShowContent');
/**
* @type {Object.<string, Array>}
*/
......@@ -181,6 +178,19 @@ define(function (require) {
if (crossText) {
this.group.add(crossText);
}
var zr = this._api.getZr();
var tryShow = this._tryShow;
zr.off('click', tryShow);
zr.off('mousemove', tryShow);
zr.off('mouseout', this._hide);
if (tooltipModel.get('triggerOn') === 'click') {
zr.on('click', tryShow, this);
}
else {
zr.on('mousemove', tryShow, this);
zr.on('mouseout', this._hide, this);
}
},
_prepareAxisTriggerData: function (tooltipModel, ecModel) {
......@@ -234,7 +244,7 @@ define(function (require) {
* @param {Object} e
* @private
*/
_mouseMove: function (e) {
_tryShow: function (e) {
var el = e.target;
var tooltipModel = this._tooltipModel;
var globalTrigger = tooltipModel.get('trigger');
......@@ -889,12 +899,15 @@ define(function (require) {
_hide: function () {
this._hideAxisPointer();
this._tooltipContent.hideLater(this._tooltipModel.get('hideDelay'));
if (!this._alwaysShowContent) {
this._tooltipContent.hideLater(this._tooltipModel.get('hideDelay'));
}
},
dispose: function (api) {
var zr = api.getZr();
zr.off('mousemove', this._mouseMove);
zr.off('click', this._tryShow);
zr.off('mousemove', this._tryShow);
zr.off('mouseout', this._hide);
}
});
......
src/component/tooltip/TooltipContent.js
浏览文件 @ 8fae2c46
......@@ -201,8 +201,8 @@ define(function (require) {
hideLater: function (time) {
if (this._show && !(this._inContent && this.enterable)) {
if (time) {
// Set show false to avoid invoke hideLater mutiple times
this._hideDelay = time;
// Set show false to avoid invoke hideLater mutiple times
this._show = false;
this._hideTimeout = setTimeout(zrUtil.bind(this.hide, this), time);
}
......
src/component/tooltip/TooltipModel.js
浏览文件 @ 8fae2c46
......@@ -19,9 +19,11 @@ define(function (require) {
// 触发类型，默认数据触发，见下图，可选为：'item' ¦ 'axis'
trigger: 'item',
// If the tooltip follow the mouse position
// TODO
// followMouse: true,
// 触发条件，支持 'click' | 'mousemove'
triggerOn: 'mousemove',
// 是否永远显示 content
// alwaysShowContent: false,
// 位置 {Array} | {Function}
// position: null
......
src/coord/axisDefault.js
浏览文件 @ 8fae2c46
......@@ -23,7 +23,7 @@ define(function (require) {
onZero: true,
// 属性lineStyle控制线条样式
lineStyle: {
color: '#000',
color: '#333',
width: 1,
type: 'solid'
}
......
src/model/Series.js
浏览文件 @ 8fae2c46
......@@ -70,7 +70,9 @@ define(function(require) {
zrUtil.merge(option, this.getDefaultOption());
// Default label emphasis `position` and `show`
modelUtil.defaultEmphasis(option.label);
modelUtil.defaultEmphasis(
option.label, ['position', 'show', 'textStyle', 'distance', 'formatter']
);
},
mergeOption: function (newSeriesOption, ecModel) {
......
src/model/globalDefault.js
浏览文件 @ 8fae2c46
......@@ -43,7 +43,7 @@ define(function () {
animationThreshold: 2000, // 动画元素阀值，产生的图形原素超过2000不出动画
animationDuration: 1000, // 过渡动画参数：进入
animationDurationUpdate: 300, // 过渡动画参数：更新
animationEasing: 'cubicOut', //BounceOut
animationEasing: 'exponentialOut', //BounceOut
animationEasingUpdate: 'cubicOut'
};
});
\ No newline at end of file
src/util/graphic.js
浏览文件 @ 8fae2c46
......@@ -307,16 +307,46 @@ define(function(require) {
* @param {string} color
*/
graphic.setText = function (textStyle, labelModel, color) {
var labelPosition = labelModel.get('position') || 'inside';
var labelPosition = labelModel.getShallow('position') || 'inside';
var labelColor = labelPosition.indexOf('inside') >= 0 ? 'white' : color;
var textStyleModel = labelModel.getModel('textStyle');
zrUtil.extend(textStyle, {
textDistance: labelModel.getShallow('distance') || 5,
textFont: textStyleModel.getFont(),
textPosition: labelPosition,
textFill: textStyleModel.get('color') || labelColor
});
};
function animateOrSetProps(isUpdate, el, props, seriesModel, cb) {
var postfix = isUpdate ? 'Update' : '';
var duration = seriesModel
&& seriesModel.getShallow('animationDuration' + postfix);
var animationEasing = seriesModel
&& seriesModel.getShallow('animationEasing' + postfix);
seriesModel && seriesModel.getShallow('animation')
? el.animateTo(props, duration, animationEasing, cb)
: (el.attr(props), cb && cb());
}
/**
* Update graphic element properties with or without animation according to the configuration in series
* @param {module:zrender/Element} el
* @param {Object} props
* @param {module:echarts/model/Series} [seriesModel]
* @param {Function} cb
*/
graphic.updateProps = zrUtil.curry(animateOrSetProps, true);
/**
* Init graphic element properties with or without animation according to the configuration in series
* @param {module:zrender/Element} el
* @param {Object} props
* @param {module:echarts/model/Series} [seriesModel]
* @param {Function} cb
*/
graphic.initProps = zrUtil.curry(animateOrSetProps, false);
/**
* Get transform matrix of target (param target),
* in coordinate of its ancestor (param ancestor)
......
src/util/model.js
浏览文件 @ 8fae2c46
......@@ -155,17 +155,19 @@ define(function(require) {
* }
* }
* @param {Object} opt
* @param {Array.<string>} [subOpts=['position', 'show']]
* @param {Array.<string>} subOpts
*/
modelUtil.defaultEmphasis = function (opt, subOpts) {
if (opt) {
var emphasisOpt = opt.emphasis = opt.emphasis || {};
var normalOpt = opt.normal = opt.normal || {};
subOpts = subOpts || ['position', 'show', 'textStyle'];
// Default emphasis option from normal
zrUtil.each(subOpts, function (subOptName) {
emphasisOpt[subOptName] = zrUtil.retrieve(emphasisOpt[subOptName], normalOpt[subOptName]);
var val = zrUtil.retrieve(emphasisOpt[subOptName], normalOpt[subOptName]);
if (val != null) {
emphasisOpt[subOptName] = val;
}
});
}
};
......
test/worldPopulationBubble.html 0 → 100644
浏览文件 @ 8fae2c46
此差异已折叠。
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或