You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2020/05/26 07:16:26 UTC
[incubator-echarts] 01/02: fix: fix hover scale in graph and tree
This is an automated email from the ASF dual-hosted git repository.
shenyi pushed a commit to branch label-enhancement
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit 601259d75d48eaa7e8c2164f7d1207c86116dac8
Author: pissang <bm...@gmail.com>
AuthorDate: Tue May 26 15:15:42 2020 +0800
fix: fix hover scale in graph and tree
---
src/chart/graph/GraphView.ts | 4 ++--
src/chart/helper/Symbol.ts | 29 +++++++++++++++++++----------
src/chart/tree/TreeView.ts | 4 ++--
3 files changed, 23 insertions(+), 14 deletions(-)
diff --git a/src/chart/graph/GraphView.ts b/src/chart/graph/GraphView.ts
index e9e2559..f1dd3b1 100644
--- a/src/chart/graph/GraphView.ts
+++ b/src/chart/graph/GraphView.ts
@@ -448,8 +448,8 @@ class GraphView extends ChartView {
const nodeScale = getNodeGlobalScale(seriesModel);
- data.eachItemGraphicEl(function (el, idx) {
- el.scaleX = el.scaleY = nodeScale;
+ data.eachItemGraphicEl(function (el: Symbol, idx) {
+ el.setSymbolScale(nodeScale);
});
}
diff --git a/src/chart/helper/Symbol.ts b/src/chart/helper/Symbol.ts
index 7bb3cd5..b67240a 100644
--- a/src/chart/helper/Symbol.ts
+++ b/src/chart/helper/Symbol.ts
@@ -46,8 +46,8 @@ class Symbol extends graphic.Group {
/**
* Original scale
*/
- private _scaleX: number;
- private _scaleY: number;
+ private _sizeX: number;
+ private _sizeY: number;
private _z2: number;
@@ -174,8 +174,8 @@ class Symbol extends graphic.Group {
const fadeIn = true;
const target: PathProps = {
- scaleX: this._scaleX,
- scaleY: this._scaleY
+ scaleX: this._sizeX,
+ scaleY: this._sizeY
};
fadeIn && (target.style = {
opacity: symbolPath.style.opacity
@@ -276,16 +276,14 @@ class Symbol extends graphic.Group {
return useNameLabel ? data.getName(idx) : getDefaultLabel(data, idx);
}
- this._scaleX = symbolSize[0] / 2;
- this._scaleY = symbolSize[1] / 2;
+ this._sizeX = symbolSize[0] / 2;
+ this._sizeY = symbolSize[1] / 2;
symbolPath.ensureState('emphasis').style = hoverItemStyle;
if (hoverAnimation && seriesModel.isAnimationEnabled()) {
- const scaleEmphasisState = this.ensureState('emphasis');
- const scale = Math.max(1.1, 3 / this._scaleY + 1);
- scaleEmphasisState.scaleX = scale;
- scaleEmphasisState.scaleY = scale;
+ this.ensureState('emphasis');
+ this.setSymbolScale(1);
}
else {
this.states.emphasis = null;
@@ -294,6 +292,17 @@ class Symbol extends graphic.Group {
graphic.enableHoverEmphasis(this);
}
+ setSymbolScale(scale: number) {
+ const emphasisState = this.states.emphasis;
+ if (emphasisState) {
+ const hoverScale = Math.max(scale * 1.1, 3 / this._sizeY + scale);
+ emphasisState.scaleX = hoverScale;
+ emphasisState.scaleY = hoverScale;
+ }
+
+ this.scaleX = this.scaleY = scale;
+ }
+
fadeOut(cb: () => void, opt?: {
keepLabel: boolean
}) {
diff --git a/src/chart/tree/TreeView.ts b/src/chart/tree/TreeView.ts
index dc01b8b..0910809 100644
--- a/src/chart/tree/TreeView.ts
+++ b/src/chart/tree/TreeView.ts
@@ -358,8 +358,8 @@ class TreeView extends ChartView {
const nodeScale = this._getNodeGlobalScale(seriesModel);
- data.eachItemGraphicEl(function (el, idx) {
- el.scaleX = el.scaleY = nodeScale;
+ data.eachItemGraphicEl(function (el: SymbolClz, idx) {
+ el.setSymbolScale(nodeScale);
});
}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org