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/04/01 12:30:40 UTC
[incubator-echarts] branch next updated: refact: fix color palette
in funnel ane pie.
This is an automated email from the ASF dual-hosted git repository.
shenyi pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
The following commit(s) were added to refs/heads/next by this push:
new 7c3debb refact: fix color palette in funnel ane pie.
7c3debb is described below
commit 7c3debbd044cb6d2a5ce472fdbeb3af6313e9789
Author: pissang <bm...@gmail.com>
AuthorDate: Wed Apr 1 20:29:50 2020 +0800
refact: fix color palette in funnel ane pie.
---
src/chart/funnel/FunnelSeries.ts | 2 +-
src/chart/funnel/FunnelView.ts | 47 ++++++++++---------------------------
src/component/axis/AngleAxisView.ts | 1 +
src/component/legend/LegendView.ts | 1 +
src/util/graphic.ts | 12 +++-------
src/visual/style.ts | 26 +++++++++++---------
6 files changed, 34 insertions(+), 55 deletions(-)
diff --git a/src/chart/funnel/FunnelSeries.ts b/src/chart/funnel/FunnelSeries.ts
index 1140507..a679788 100644
--- a/src/chart/funnel/FunnelSeries.ts
+++ b/src/chart/funnel/FunnelSeries.ts
@@ -96,7 +96,7 @@ class FunnelSeriesModel extends SeriesModel<FunnelSeriesOption> {
static type = 'series.funnel' as const;
type = FunnelSeriesModel.type;
- useColorPaletteOnData: true;
+ useColorPaletteOnData = true;
init(option: FunnelSeriesOption) {
super.init.apply(this, arguments as any);
diff --git a/src/chart/funnel/FunnelView.ts b/src/chart/funnel/FunnelView.ts
index b5ae8d6..47e1209 100644
--- a/src/chart/funnel/FunnelView.ts
+++ b/src/chart/funnel/FunnelView.ts
@@ -18,21 +18,15 @@
*/
import * as graphic from '../../util/graphic';
-import * as zrUtil from 'zrender/src/core/util';
import ChartView from '../../view/Chart';
import FunnelSeriesModel, {FunnelDataItemOption} from './FunnelSeries';
import GlobalModel from '../../model/Global';
import ExtensionAPI from '../../ExtensionAPI';
import List from '../../data/List';
-import { DisplayState, ColorString } from '../../util/types';
-import Displayable from 'zrender/src/graphic/Displayable';
+import { ColorString } from '../../util/types';
const opacityAccessPath = ['itemStyle', 'opacity'] as const;
-type FunnelLabelEl = Displayable & {
- hoverIgnore?: boolean
- normalIgnore?: boolean
-};
/**
* Piece of pie including Sector, Label, LabelLine
*/
@@ -51,21 +45,6 @@ class FunnelPiece extends graphic.Group {
this.updateData(data, idx, true);
}
- onStateChange(fromState: DisplayState, toState: DisplayState) {
-
- const labelLine = this.childAt(1) as graphic.Polyline;
- const text = this.childAt(2) as graphic.Text;
-
- if (toState === 'emphasis') {
- labelLine.ignore = (labelLine as FunnelLabelEl).hoverIgnore;
- text.ignore = (text as FunnelLabelEl).hoverIgnore;
- }
- else {
- labelLine.ignore = (labelLine as FunnelLabelEl).normalIgnore;
- text.ignore = (text as FunnelLabelEl).normalIgnore;
- }
- }
-
updateData(data: List, idx: number, firstCreate?: boolean) {
const polygon = this.childAt(0) as graphic.Polygon;
@@ -76,14 +55,16 @@ class FunnelPiece extends graphic.Group {
let opacity = itemModel.get(opacityAccessPath);
opacity = opacity == null ? 1 : opacity;
- // Reset style
- polygon.useStyle({});
+
+ // Update common style
+ polygon.useStyle(data.getItemVisual(idx, 'style'));
+ polygon.style.lineJoin = 'round';
if (firstCreate) {
polygon.setShape({
points: layout.points
});
- polygon.setStyle({opacity: 0});
+ polygon.style.opacity = 0;
graphic.initProps(polygon, {
style: {
opacity: opacity
@@ -101,10 +82,6 @@ class FunnelPiece extends graphic.Group {
}, seriesModel, idx);
}
- // Update common style
- polygon.useStyle(data.getItemVisual(idx, 'style'));
- polygon.style.lineJoin = 'round';
-
const polygonEmphasisState = polygon.ensureState('emphasis');
polygonEmphasisState.style = itemModel.getModel(['emphasis', 'itemStyle']).getItemStyle();
@@ -129,7 +106,7 @@ class FunnelPiece extends graphic.Group {
const labelLineModel = itemModel.getModel('labelLine');
const labelLineHoverModel = itemModel.getModel(['emphasis', 'labelLine']);
- const visualColor = data.getItemVisual(idx, 'style').stroke as ColorString;
+ const visualColor = data.getItemVisual(idx, 'style').fill as ColorString;
graphic.setLabelStyle(
labelText, labelModel, labelHoverModel,
@@ -174,11 +151,13 @@ class FunnelPiece extends graphic.Group {
z2: 10
});
- labelText.ignore = (labelText as FunnelLabelEl).normalIgnore = !labelModel.get('show');
- (labelText as FunnelLabelEl).hoverIgnore = !labelHoverModel.get('show');
+ labelText.ignore = !labelModel.get('show');
+ const labelTextEmphasisState = labelText.ensureState('emphasis');
+ labelTextEmphasisState.ignore = !labelHoverModel.get('show');
- labelLine.ignore = (labelLine as FunnelLabelEl).normalIgnore = !labelLineModel.get('show');
- (labelLine as FunnelLabelEl).hoverIgnore = !labelLineHoverModel.get('show');
+ labelLine.ignore = !labelLineModel.get('show');
+ const labelLineEmphasisState = labelLine.ensureState('emphasis');
+ labelLineEmphasisState.ignore = !labelLineHoverModel.get('show');
// Default use item visual color
labelLine.setStyle({
diff --git a/src/component/axis/AngleAxisView.ts b/src/component/axis/AngleAxisView.ts
index 48f1eea..3a95368 100644
--- a/src/component/axis/AngleAxisView.ts
+++ b/src/component/axis/AngleAxisView.ts
@@ -163,6 +163,7 @@ const angelAxisElementsBuilders: Record<typeof elementList[number], AngleAxisEle
silent: true
});
}
+ shape.style.fill = null;
group.add(shape);
},
diff --git a/src/component/legend/LegendView.ts b/src/component/legend/LegendView.ts
index ecff71e..dafa108 100644
--- a/src/component/legend/LegendView.ts
+++ b/src/component/legend/LegendView.ts
@@ -578,6 +578,7 @@ function dispatchSelectAction(
name: seriesName != null ? seriesName : dataName
});
// highlight after select
+ // TODO higlight immediately may cause animation loss.
dispatchHighlightAction(seriesName, dataName, api, excludeSeriesId);
}
diff --git a/src/util/graphic.ts b/src/util/graphic.ts
index 1b9540e..727fd40 100644
--- a/src/util/graphic.ts
+++ b/src/util/graphic.ts
@@ -377,15 +377,9 @@ function singleEnterEmphasis(el: Element) {
}
const disp = el as Displayable;
- let emphasisStyle;
- let currentFill;
- let currentStroke;
- // state may be a function
- if (!(typeof disp.states.emphasis === 'function')) {
- emphasisStyle = disp.states.emphasis.style;
- currentFill = disp.style && disp.style.fill;
- currentStroke = disp.style && disp.style.stroke;
- }
+ const emphasisStyle = disp.states.emphasis.style;
+ const currentFill = disp.style && disp.style.fill;
+ const currentStroke = disp.style && disp.style.stroke;
el.useState('emphasis');
diff --git a/src/visual/style.ts b/src/visual/style.ts
index 3d66948..e047085 100644
--- a/src/visual/style.ts
+++ b/src/visual/style.ts
@@ -84,7 +84,7 @@ const seriesStyleTask: StageHandler = {
// TODO style callback
const colorCallback = isFunction(color) ? color as unknown as ColorCallback : null;
// Default
- if (!globalStyle[colorKey] || colorCallback) { // TODO Better handling on callback
+ if ((!globalStyle[colorKey] || colorCallback) && !seriesModel.useColorPaletteOnData) {
globalStyle[colorKey] = seriesModel.getColorFromPalette(
// TODO series count changed.
seriesModel.name, null, ecModel.getSeriesCount()
@@ -96,17 +96,21 @@ const seriesStyleTask: StageHandler = {
// Only visible series has each data be visual encoded
if (!ecModel.isSeriesFiltered(seriesModel)) {
- if (colorCallback) {
- return {
- dataEach(data, idx) {
- data.each(function (idx) {
- const dataParams = seriesModel.getDataParams(idx);
- const itemStyle = extend({}, globalStyle);
+ // if (colorCallback) {
+ return {
+ dataEach(data, idx) {
+ data.each(function (idx) {
+ const dataParams = seriesModel.getDataParams(idx);
+ const itemStyle = extend({}, globalStyle);
+ // FIXME share style may affect other elements when one changes it's style(for example in animation)
+ if (colorCallback) {
itemStyle[colorKey] = colorCallback(dataParams);
- });
- }
- };
- }
+ }
+ data.setItemVisual(idx, 'style', itemStyle);
+ });
+ }
+ };
+ // }
}
}
};
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org