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/19 06:21:27 UTC
[incubator-echarts] 01/02: fix: use highlighted and selected flag
to determine if apply state.
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 6b86fff73f57f0e177b90ab749b0d1569883f0c8
Author: pissang <bm...@gmail.com>
AuthorDate: Tue May 19 14:19:32 2020 +0800
fix: use highlighted and selected flag to determine if apply state.
---
src/chart/pie/PieView.ts | 19 ++++++++++---------
src/echarts.ts | 15 ++++++++++++++-
src/util/graphic.ts | 9 ++++-----
src/util/types.ts | 3 +++
4 files changed, 31 insertions(+), 15 deletions(-)
diff --git a/src/chart/pie/PieView.ts b/src/chart/pie/PieView.ts
index f194434..0f2865a 100644
--- a/src/chart/pie/PieView.ts
+++ b/src/chart/pie/PieView.ts
@@ -24,7 +24,7 @@ import * as graphic from '../../util/graphic';
import ChartView from '../../view/Chart';
import GlobalModel from '../../model/Global';
import ExtensionAPI from '../../ExtensionAPI';
-import { Payload, ColorString } from '../../util/types';
+import { Payload, ColorString, ECElement } from '../../util/types';
import List from '../../data/List';
import PieSeriesModel, {PieDataItemOption} from './PieSeries';
@@ -45,11 +45,6 @@ function updateDataSelected(
name: name,
seriesId: seriesModel.id
});
-
- data.each(function (idx) {
- const el = data.getItemGraphicEl(idx);
- el.toggleState('select', seriesModel.isSelected(data.getName(idx)));
- });
}
/**
@@ -166,8 +161,8 @@ class PiePiece extends graphic.Sector {
graphic.enableHoverEmphasis(this);
- // Switch after `select` state updated.
- sector.toggleState('select', seriesModel.isSelected(data.getName(idx)));
+ // State will be set after all rendered in the pipeline.
+ (sector as ECElement).selected = seriesModel.isSelected(data.getName(idx));
}
private _updateLabel(data: List, idx: number, withAnimation: boolean): void {
@@ -296,11 +291,17 @@ class PieView extends ChartView {
}
render(seriesModel: PieSeriesModel, ecModel: GlobalModel, api: ExtensionAPI, payload: Payload): void {
+ const data = seriesModel.getData();
if (payload && (payload.from === this.uid)) {
+ // update selected status
+ data.each(function (idx) {
+ const el = data.getItemGraphicEl(idx);
+ (el as ECElement).selected = seriesModel.isSelected(data.getName(idx));
+ });
+
return;
}
- const data = seriesModel.getData();
const oldData = this._data;
const group = this.group;
diff --git a/src/echarts.ts b/src/echarts.ts
index c590c58..7420e3a 100644
--- a/src/echarts.ts
+++ b/src/echarts.ts
@@ -1779,6 +1779,7 @@ class ECharts extends Eventful {
interface DisplayableWithStatesHistory extends Displayable {
__prevStates: string[]
};
+ // Clear states without animation.
// TODO States on component.
function clearStates(seriesModel: SeriesModel, view: ChartView): void {
view.group.traverse(function (el: Displayable) {
@@ -1787,7 +1788,6 @@ class ECharts extends Eventful {
(el as DisplayableWithStatesHistory).__prevStates = el.currentStates;
const textContent = el.getTextContent();
const textGuide = el.getTextGuideLine();
- // Not use animation when clearStates and restore states in `updateStates`
if (el.stateTransition) {
el.stateTransition = null;
}
@@ -1809,6 +1809,7 @@ class ECharts extends Eventful {
// Only updated on changed element. In case element is incremental and don't wan't to rerender.
if (el.__dirty && el.states && el.states.emphasis) {
const prevStates = (el as DisplayableWithStatesHistory).__prevStates;
+ // Restore states without animation
if (prevStates) {
el.useStates(prevStates);
}
@@ -1825,6 +1826,18 @@ class ECharts extends Eventful {
graphic.setStateTransition(textGuide, stateAnimationModel);
}
}
+
+ // The use higlighted and selected flag to toggle states.
+ const states = [];
+ if ((el as ECElement).selected) {
+ states.push('select');
+ }
+ if ((el as ECElement).highlighted) {
+ states.push('emphasis');
+ }
+ el.useStates(states);
+ // el.toggleState('select', (el as ECElement).selected);
+ // el.toggleState('emphasis', (el as ECElement).highlighted);
}
});
};
diff --git a/src/util/graphic.ts b/src/util/graphic.ts
index 4126085..308c6e2 100644
--- a/src/util/graphic.ts
+++ b/src/util/graphic.ts
@@ -106,7 +106,6 @@ type ExtendShapeReturn = ReturnType<typeof Path.extend>;
type ExtendedProps = {
- __highlighted?: boolean | 'layer' | 'plain'
__highByOuter: number
__highDownSilentOnTouch: boolean
@@ -371,7 +370,7 @@ function liftColor(color: string): string {
function singleEnterEmphasis(el: Element) {
- (el as ExtendedElement).__highlighted = true;
+ (el as ECElement).highlighted = true;
// el may be an array.
if (!el.states.emphasis) {
@@ -385,7 +384,7 @@ function singleEnterEmphasis(el: Element) {
function singleLeaveEmphasis(el: Element) {
el.removeState('emphasis');
- (el as ExtendedElement).__highlighted = false;
+ (el as ECElement).highlighted = false;
}
function updateElementState<T>(
@@ -398,9 +397,9 @@ function updateElementState<T>(
let toState: DisplayState = NORMAL;
let trigger;
// See the rule of `onStateChange` on `graphic.setAsHighDownDispatcher`.
- el.__highlighted && (fromState = EMPHASIS, trigger = true);
+ (el as ECElement).highlighted && (fromState = EMPHASIS, trigger = true);
updater(el, commonParam);
- el.__highlighted && (toState = EMPHASIS, trigger = true);
+ (el as ECElement).highlighted && (toState = EMPHASIS, trigger = true);
trigger && el.__onStateChange && el.__onStateChange(fromState, toState);
}
diff --git a/src/util/types.ts b/src/util/types.ts
index d9bbd1b..88868b1 100644
--- a/src/util/types.ts
+++ b/src/util/types.ts
@@ -106,6 +106,9 @@ export interface ECElement extends Element {
};
highDownSilentOnTouch?: boolean;
onStateChange?: (fromState: 'normal' | 'emphasis', toState: 'normal' | 'emphasis') => void;
+
+ highlighted?: boolean;
+ selected?: boolean;
}
export interface DataHost {
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org