feat(v2/column): extract common interval geometry #1391
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,4 @@ | ||
| export { area, AreaGeometryOptions } from './area'; | ||
| export { line, LineGeometryOptions } from './line'; | ||
| export { point, PointGeometryOptions } from './point'; | ||
| export { interval, IntervalGeometryOptions } from './interval'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,96 @@ | ||
| import { isNil, isFunction } from '@antv/util'; | ||
| import { Params } from '../../core/adaptor'; | ||
| import { Options } from '../../types'; | ||
| import { ShapeStyle } from '../../types/style'; | ||
|
|
||
| export interface IntervalGeometryOptions extends Options { | ||
| /** x 轴字段 */ | ||
| readonly xField: string; | ||
| /** y 轴字段 */ | ||
| readonly yField: string; | ||
| /** 颜色字段，可选 */ | ||
| readonly colorField?: string; | ||
| /** 拆分字段，在分组柱状图下同 groupField、colorField，在堆积柱状图下同 stackField、colorField */ | ||
| readonly seriesField?: string; | ||
| /** 是否分组柱形图 */ | ||
| readonly isGroup?: boolean; | ||
| /** 分组拆分字段 */ | ||
| readonly groupField?: string; | ||
| /** 是否堆积柱状图 */ | ||
| readonly isStack?: boolean; | ||
| /** 堆积拆分字段 */ | ||
| readonly stackField?: string; | ||
| /** 柱子样式配置 */ | ||
| readonly interval?: { | ||
| /** 柱状图宽度占比 [0-1] */ | ||
| readonly widthRatio?: number; | ||
| /** 分组中柱子之间的间距 [0-1]，仅对分组柱状图适用 */ | ||
| readonly marginRatio?: number; | ||
| /** 柱子样式配置，可选 */ | ||
| readonly style?: ShapeStyle | ((x: any, y: any, color?: any) => ShapeStyle); | ||
| }; | ||
| } | ||
|
|
||
| export function getGroupField(params: Params<IntervalGeometryOptions>): string { | ||
| const { options } = params; | ||
| const { groupField, seriesField, colorField } = options; | ||
|
|
||
| return groupField || seriesField || colorField; | ||
| } | ||
|
|
||
| export function getStackField(params: Params<IntervalGeometryOptions>): string { | ||
| const { options } = params; | ||
| const { stackField, seriesField, colorField } = options; | ||
|
|
||
| return stackField || seriesField || colorField; | ||
| } | ||
|
There was a problem hiding this comment. 这两个属于 util 方法，放到 plots/bar/ 中？如果外面不需要用，就不 export 出去，作为这个文件的内部方法 |
||
|
|
||
| export function interval<O extends IntervalGeometryOptions>(params: Params<O>): Params<O> { | ||
| const { chart, options } = params; | ||
| const { xField, yField, colorField, color, isGroup, isStack, interval } = options; | ||
| let realColorField = colorField; | ||
|
|
||
| if (interval) { | ||
| const { marginRatio, widthRatio, style } = interval; | ||
| const geometry = chart.interval().position(`${xField}*${yField}`); | ||
|
|
||
| // field | ||
| if (isGroup) { | ||
| realColorField = getGroupField(params); | ||
| geometry.color(realColorField, color); | ||
| geometry.adjust({ | ||
| type: 'dodge', | ||
| marginRatio, | ||
| }); | ||
| } else if (isStack) { | ||
| realColorField = getStackField(params); | ||
| geometry.color(getStackField(params), color); | ||
| geometry.adjust({ | ||
| type: 'stack', | ||
| marginRatio, | ||
| }); | ||
| } else { | ||
| if (colorField) { | ||
| geometry.color(colorField, color); | ||
| } | ||
| } | ||
|
|
||
| // widthRatio | ||
| if (!isNil(widthRatio)) { | ||
| chart.theme({ | ||
| columnWidthRatio: widthRatio, | ||
| }); | ||
| } | ||
|
|
||
| // style | ||
| if (style) { | ||
| if (isFunction(style)) { | ||
| geometry.style(`${xField}*${yField}*${realColorField}`, style); | ||
| } else { | ||
| geometry.style(style); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| return params; | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
interval 就是一个单独的 geometry type 了，看48行