Skip to content

fix(pie): fix percent isn't updated after the legend is changed #17734

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
plainheart merged 3 commits into from
Oct 8, 2022
Merged

fix(pie): fix percent isn't updated after the legend is changed #17734

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0495331
chore: fix some typos
plainheart Oct 8, 2022
a80fec3
fix(pie): fix percent isn't updated when the legend is changed
plainheart Oct 8, 2022
8c8a1a2
refactor(pie): mount `seats` on data inner
plainheart Oct 8, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 21 additions & 14 deletions src/chart/pie/PieSeries.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ import {
SeriesLabelOption,
DefaultEmphasisFocus
} from '../../util/types';
import SeriesData from '../../data/SeriesData';
import type SeriesData from '../../data/SeriesData';

interface PieItemStyleOption<TCbParams = never> extends ItemStyleOption<TCbParams> {
// can be 10
Expand Down Expand Up @@ -129,12 +129,14 @@ export interface PieSeriesOption extends
data?: (OptionDataValueNumeric | OptionDataValueNumeric[] | PieDataItemOption)[]
}

const innerData = modelUtil.makeInner<{
seats?: number[]
}, SeriesData>();

class PieSeriesModel extends SeriesModel<PieSeriesOption> {

static type = 'series.pie' as const;

seats: number[];

/**
* @overwrite
*/
Expand All @@ -161,25 +163,30 @@ class PieSeriesModel extends SeriesModel<PieSeriesOption> {
* @overwrite
*/
getInitialData(this: PieSeriesModel): SeriesData {
const data = createSeriesDataSimply(this, {
return createSeriesDataSimply(this, {
coordDimensions: ['value'],
encodeDefaulter: zrUtil.curry(makeSeriesEncodeForNameBased, this)
});
const valueList:number[] = [];
data.each(data.mapDimension('value'), function (value: number) {
valueList.push(value);
});

this.seats = getPercentSeats(valueList, data.hostModel.get('percentPrecision'));
return data;
}

/**
* @overwrite
*/
getDataParams(dataIndex: number): PieCallbackDataParams {
const data = this.getData();
// update seats when data is changed
const dataInner = innerData(data);
let seats = dataInner.seats;
if (!seats) {
const valueList: number[] = [];
data.each(data.mapDimension('value'), function (value: number) {
valueList.push(value);
});
seats = dataInner.seats = getPercentSeats(valueList, data.hostModel.get('percentPrecision'));
}
const params = super.getDataParams(dataIndex) as PieCallbackDataParams;
params.percent = this.seats[dataIndex];
// seats may be empty when sum is 0
params.percent = seats[dataIndex] || 0;
params.$vars.push('percent');
return params;
}
Expand Down Expand Up @@ -254,8 +261,8 @@ class PieSeriesModel extends SeriesModel<PieSeriesOption> {
bleedMargin: 10,
// Distance between text and label line.
distanceToLabelLine: 5
// formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
// 默认使用全局文本样式，详见TEXTSTYLE
// formatter: 标签文本格式器，同 tooltip.formatter，不支持异步回调
// 默认使用全局文本样式，详见 textStyle
// distance: 当position为inner时有效，为label位置到圆心的距离与圆半径(环状图为内外半径和)的比例系数
},
// Enabled when label.normal.position is 'outer'
Expand Down
44 changes: 22 additions & 22 deletions src/data/SeriesData.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ const map = zrUtil.map;
const CtorInt32Array = typeof Int32Array === 'undefined' ? Array : Int32Array;

// Use prefix to avoid index to be the same as otherIdList[idx],
// which will cause weird udpate animation.
// which will cause weird update animation.
const ID_PREFIX = 'e\0\0';

const INDEX_NOT_FOUND = -1;
Expand Down Expand Up @@ -159,12 +159,12 @@ class SeriesData<
* Name of dimensions list of SeriesData.
*
* @caution Carefully use the index of this array.
* Becuase when DataStore is an extra high dimension(>30) dataset. We will only pick
* Because when DataStore is an extra high dimension(>30) dataset. We will only pick
* the used dimensions from DataStore to avoid performance issue.
*/
readonly dimensions: SeriesDimensionName[];

// Infomation of each data dimension, like data type.
// Information of each data dimension, like data type.
private _dimInfos: Record<SeriesDimensionName, SeriesDimensionDefine>;

private _dimOmitted = false;
Expand Down Expand Up @@ -192,7 +192,7 @@ class SeriesData<

/**
* @readonly
* Host tree if List is used to store tree ndoes.
* Host tree if List is used to store tree nodes.
*/
tree?: Tree;

Expand All @@ -208,7 +208,7 @@ class SeriesData<
// Global visual properties after visual coding
private _visual: Dictionary<any> = {};

// Globel layout properties.
// Global layout properties.
private _layout: Dictionary<any> = {};

// Item visual properties after visual coding
Expand All @@ -217,7 +217,7 @@ class SeriesData<
// Item layout properties after layout
private _itemLayouts: any[] = [];

// Graphic elemnents
// Graphic elements
private _graphicEls: Element[] = [];

// key: dim, value: extent
Expand Down Expand Up @@ -357,7 +357,7 @@ class SeriesData<
* Because only those dimensions will have auto-generated dimension names if not
* have a user-specified name, and other dimensions will get a return of null/undefined.
*
* @notice Becuause of this reason, should better use `getDimensionIndex` instead, for examples:
* @notice Because of this reason, should better use `getDimensionIndex` instead, for examples:
* ```js
* const val = data.getStore().get(data.getDimensionIndex(dim), dataIdx);
* ```
Expand All @@ -375,7 +375,7 @@ class SeriesData<
return this.dimensions[dimIdx];
}

// Retrieve from series dimension definition becuase it probably contains
// Retrieve from series dimension definition because it probably contains
// generated dimension name (like 'x', 'y').
const dimName = this._dimIdxToName.get(dimIdx);
if (dimName != null) {
Expand Down Expand Up @@ -419,15 +419,15 @@ class SeriesData<
* + If there is the same concrete dim name defined in `series.dimensions` or `dataset.dimensions`,
* it means that concrete name.
* + If not, it will be converted to a number, which means the index of the dimension.
* (why? because of the backward compatbility. We have been tolerating number-like string in
* (why? because of the backward compatibility. We have been tolerating number-like string in
* dimension setting, although now it seems that it is not a good idea.)
* For example, `visualMap[i].dimension: "1"` is the same meaning as `visualMap[i].dimension: 1`,
* if no dimension name is defined as `"1"`.
* + If dim is a not-number-like string, it means the concrete dim name.
* For example, it can be be default name `"x"`, `"y"`, `"z"`, `"lng"`, `"lat"`, `"angle"`, `"radius"`,
* or customized in `dimensions` property of option like `"age"`.
*
* @return recogonized `DimensionIndex`. Otherwise return null/undefined (means that dim is `DimensionName`).
* @return recognized `DimensionIndex`. Otherwise return null/undefined (means that dim is `DimensionName`).
*/
private _recognizeDimIndex(dim: DimensionLoose): DimensionIndex {
if (zrUtil.isNumber(dim)
Expand All @@ -447,7 +447,7 @@ class SeriesData<
const dimIdx = this.getDimensionIndex(dim);
if (__DEV__) {
if (dimIdx == null) {
throw new Error('Unkown dimension ' + dim);
throw new Error('Unknown dimension ' + dim);
}
}
return dimIdx;
Expand Down Expand Up @@ -580,7 +580,7 @@ class SeriesData<
* [NaN, 43, 1],
* ['-', 'asdf', 0]
* ]
* Each item is exaclty cooresponding to a dimension.
* Each item is exactly corresponding to a dimension.
*/
appendValues(values: any[][], names?: string[]): void {
const {start, end} = this._store.appendValues(values, names.length);
Expand Down Expand Up @@ -690,7 +690,7 @@ class SeriesData<

/**
* Calculate extent on a filtered data might be time consuming.
* Approximate extent is only used for: calculte extent of filtered data outside.
* Approximate extent is only used for: calculate extent of filtered data outside.
*/
setApproximateExtent(extent: [number, number], dim: SeriesDimensionLoose): void {
dim = this.getDimension(dim);
Expand Down Expand Up @@ -723,7 +723,7 @@ class SeriesData<
}

/**
* @return Never be null/undefined. `number` will be converted to string. Becuase:
* @return Never be null/undefined. `number` will be converted to string. Because:
* In most cases, name is used in display, where returning a string is more convenient.
* In other cases, name is used in query (see `indexOfName`), where we can keep the
* rule that name `2` equals to name `'2'`.
Expand All @@ -750,7 +750,7 @@ class SeriesData<
}

/**
* @return Never null/undefined. `number` will be converted to string. Becuase:
* @return Never null/undefined. `number` will be converted to string. Because:
* In all cases having encountered at present, id is used in making diff comparison, which
* are usually based on hash map. We can keep the rule that the internal id are always string
* (treat `2` is the same as `'2'`) to make the related logic simple.
Expand Down Expand Up @@ -816,7 +816,7 @@ class SeriesData<
}

/**
* If value is NaN. Inlcuding '-'
* If value is NaN. Including '-'
* Only check the coord dimensions.
*/
hasValue(idx: number): boolean {
Expand All @@ -833,7 +833,7 @@ class SeriesData<
}

/**
* Retreive the index with given name
* Retrieve the index with given name
*/
indexOfName(name: string): number {
for (let i = 0, len = this._store.count(); i < len; i++) {
Expand Down Expand Up @@ -874,7 +874,7 @@ class SeriesData<
}

/**
* Retreive the index of nearest value
* Retrieve the index of nearest value
* @param dim
* @param value
* @param [maxDistance=Infinity]
Expand Down Expand Up @@ -1069,8 +1069,8 @@ class SeriesData<
);

// If do shallow clone here, if there are too many stacked series,
// it still cost lots of memory, becuase `_store.dimensions` are not shared.
// We should consider there probably be shallow clone happen in each sereis
// it still cost lots of memory, because `_store.dimensions` are not shared.
// We should consider there probably be shallow clone happen in each series
// in consequent filter/map.
this._store.modify(
dimIndices,
Expand Down Expand Up @@ -1124,7 +1124,7 @@ class SeriesData<
*/
// TODO: Type of data item
getItemModel<ItemOpts extends unknown = unknown>(idx: number): Model<ItemOpts
// Extract item option with value key. FIXME will cause incompatitable issue
// Extract item option with value key. FIXME will cause incompatible issue
// Extract<HostModel['option']['data'][number], { value?: any }>
> {
const hostModel = this.hostModel;
Expand Down Expand Up @@ -1433,7 +1433,7 @@ class SeriesData<
};

/**
* Data in excludeDimensions is copied, otherwise transfered.
* Data in excludeDimensions is copied, otherwise transferred.
*/
cloneListForMapAndSample = function (original: SeriesData): SeriesData {
const list = new SeriesData(
Expand Down
Loading