From 2a763d2c8c1407f6d65a2f77b5a8fa50dd2062b2 Mon Sep 17 00:00:00 2001 From: vlaforet Date: Tue, 21 May 2024 23:50:59 +0200 Subject: [PATCH 1/2] feat(types): Add area-step-range chart type --- demo/chart.js | 2 +- demo/types/types.js | 1 + src/config/Options/data/data.ts | 9 +++++---- src/config/const.ts | 14 ++++++++++---- src/config/resolver/shape.ts | 4 ++++ src/index.esm.ts | 1 + types/bb.d.ts | 1 + types/index.d.ts | 1 + types/options.d.ts | 6 +++--- types/types.d.ts | 1 + 10 files changed, 28 insertions(+), 12 deletions(-) diff --git a/demo/chart.js b/demo/chart.js index 9a026ca2a..5c241b037 100644 --- a/demo/chart.js +++ b/demo/chart.js @@ -237,7 +237,7 @@ var billboardDemo = { // UMD code.data = code.data.join("") - .replace(/"(area|area-line-range|area-spline|area-spline-range|area-step|bar|bubble|candlestick|donut|gauge|line|pie|polar|radar|scatter|spline|step|treemap|selection|subchart|zoom)(\(\))?",?/g, function(match, p1, p2, p3, offset, string) { + .replace(/"(area|area-line-range|area-spline|area-spline-range|area-step|area-step-range|bar|bubble|candlestick|donut|gauge|line|pie|polar|radar|scatter|spline|step|treemap|selection|subchart|zoom)(\(\))?",?/g, function(match, p1, p2, p3, offset, string) { var module = camelize(p1); code.esm.indexOf(module) === -1 && diff --git a/demo/types/types.js b/demo/types/types.js index 70eac8343..842feeb3a 100644 --- a/demo/types/types.js +++ b/demo/types/types.js @@ -5,6 +5,7 @@ const Types = { "area-spline", "area-spline-range", "area-step", + "area-step-range", "bar", "grouped-bar", "bubble", diff --git a/src/config/Options/data/data.ts b/src/config/Options/data/data.ts index 56a055fe5..053949b2f 100644 --- a/src/config/Options/data/data.ts +++ b/src/config/Options/data/data.ts @@ -87,6 +87,7 @@ export default { * - area-spline * - area-spline-range * - area-step + * - area-step-range * - bar * - bubble * - candlestick @@ -575,7 +576,7 @@ export default { /** * Set a callback for minimum data - * - **NOTE:** For 'area-line-range' and 'area-spline-range', `mid` data will be taken for the comparison + * - **NOTE:** For 'area-line-range', 'area-step-range' and 'area-spline-range', `mid` data will be taken for the comparison * @name data․onmin * @memberof Options * @type {Function} @@ -591,7 +592,7 @@ export default { /** * Set a callback for maximum data - * - **NOTE:** For 'area-line-range' and 'area-spline-range', `mid` data will be taken for the comparison + * - **NOTE:** For 'area-line-range', 'area-step-range' and 'area-spline-range', `mid` data will be taken for the comparison * @name data․onmax * @memberof Options * @type {Function} @@ -698,7 +699,7 @@ export default { * type: "bar" * } * - * // for 'range' types('area-line-range' or 'area-spline-range'), data should contain: + * // for 'range' types('area-line-range' or 'area-step-range' or 'area-spline-range'), data should contain: * // - an array of [high, mid, low] data following the order * // - or an object with 'high', 'mid' and 'low' key value * data: { @@ -784,7 +785,7 @@ export default { * type: "bar" * } * - * // for 'range' types('area-line-range' or 'area-spline-range'), data should contain: + * // for 'range' types('area-line-range' or 'area-step-range' or 'area-spline-range'), data should contain: * // - an array of [high, mid, low] data following the order * // - or an object with 'high', 'mid' and 'low' key value * data: { diff --git a/src/config/const.ts b/src/config/const.ts index 73a3a7dd9..582f40c64 100644 --- a/src/config/const.ts +++ b/src/config/const.ts @@ -12,6 +12,7 @@ export const TYPE = { AREA_SPLINE: "area-spline", AREA_SPLINE_RANGE: "area-spline-range", AREA_STEP: "area-step", + AREA_STEP_RANGE: "area-step-range", BAR: "bar", BUBBLE: "bubble", CANDLESTICK: "candlestick", @@ -37,6 +38,7 @@ export const TYPE_METHOD_NEEDED = { AREA_SPLINE: "initArea", AREA_SPLINE_RANGE: "initArea", AREA_STEP: "initArea", + AREA_STEP_RANGE: "initArea", BAR: "initBar", BUBBLE: "initCircle", CANDLESTICK: "initCandlestick", @@ -62,11 +64,13 @@ export const TYPE_BY_CATEGORY = { TYPE.AREA_SPLINE, TYPE.AREA_SPLINE_RANGE, TYPE.AREA_LINE_RANGE, - TYPE.AREA_STEP + TYPE.AREA_STEP, + TYPE.AREA_STEP_RANGE ], AreaRange: [ TYPE.AREA_SPLINE_RANGE, - TYPE.AREA_LINE_RANGE + TYPE.AREA_LINE_RANGE, + TYPE.AREA_STEP_RANGE ], Arc: [ TYPE.PIE, @@ -83,11 +87,13 @@ export const TYPE_BY_CATEGORY = { TYPE.AREA_SPLINE_RANGE, TYPE.AREA_LINE_RANGE, TYPE.STEP, - TYPE.AREA_STEP + TYPE.AREA_STEP, + TYPE.AREA_STEP_RANGE ], Step: [ TYPE.STEP, - TYPE.AREA_STEP + TYPE.AREA_STEP, + TYPE.AREA_STEP_RANGE ], Spline: [ TYPE.SPLINE, diff --git a/src/config/resolver/shape.ts b/src/config/resolver/shape.ts index d9fbcc553..86e3d51c1 100644 --- a/src/config/resolver/shape.ts +++ b/src/config/resolver/shape.ts @@ -50,6 +50,7 @@ export { areaSpline, areaSplineRange, areaStep, + areaStepRange, bar, bubble, candlestick, @@ -106,6 +107,9 @@ let area = (): string => ( let areaLineRange = (): string => ( extendLine(shapeArea, [optArea]), (areaLineRange = () => TYPE.AREA_LINE_RANGE)() ); +let areaStepRange = (): string => ( + extendLine(shapeArea, [optArea]), (areaStepRange = () => TYPE.AREA_STEP_RANGE)() +); let areaSpline = () => ( extendLine(shapeArea, [optArea, optSpline]), (areaSpline = () => TYPE.AREA_SPLINE)() ); diff --git a/src/index.esm.ts b/src/index.esm.ts index 76b49a95d..b10814196 100644 --- a/src/index.esm.ts +++ b/src/index.esm.ts @@ -9,6 +9,7 @@ export { areaSpline, areaSplineRange, areaStep, + areaStepRange, bar, bubble, candlestick, diff --git a/types/bb.d.ts b/types/bb.d.ts index 1cadaa9f0..e69257ae9 100644 --- a/types/bb.d.ts +++ b/types/bb.d.ts @@ -38,6 +38,7 @@ export function areaLineRange(): "area-line-range"; export function areaSpline(): "area-spline"; export function areaSplineRange(): "area-spline-range"; export function areaStep(): "area-step"; +export function areaStepRange(): "area-step-range"; export function bar(): "bar"; export function bubble(): "bubble"; export function candlestick(): "candlestick"; diff --git a/types/index.d.ts b/types/index.d.ts index 9fdeb0c09..8624dabe4 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -15,6 +15,7 @@ export { areaSpline, areaSplineRange, areaStep, + areaStepRange, bar, bubble, candlestick, diff --git a/types/options.d.ts b/types/options.d.ts index 3de78027e..8bc485a38 100644 --- a/types/options.d.ts +++ b/types/options.d.ts @@ -1118,7 +1118,7 @@ export interface Data { /** * Set chart type at once. * If this option is specified, the type will be applied to every data. This setting can be overwritten by data.types. - * - Available Values: area, area-line-range, area-spline, area-spline-range, area-step, bar, bubble, candlestick, donut, gauge, line, pie, radar, scatter, spline, step + * - Available Values: area, area-line-range, area-spline, area-spline-range, area-step, area-step-range, bar, bubble, candlestick, donut, gauge, line, pie, radar, scatter, spline, step */ type?: ChartTypes; @@ -1342,13 +1342,13 @@ export interface Data { /** * Set a callback for minimum data - * - NOTE: For 'area-line-range' and 'area-spline-range', mid data will be taken for the comparison + * - NOTE: For 'area-line-range', 'area-step-range' and 'area-spline-range', mid data will be taken for the comparison */ onmin?(this: Chart, d: DataItem[]): void; /** * Set a callback for maximum data - * - NOTE: For 'area-line-range' and 'area-spline-range', mid data will be taken for the comparison + * - NOTE: For 'area-line-range', 'area-step-range' and 'area-spline-range', mid data will be taken for the comparison */ onmax?(this: Chart, d: DataItem[]): void; diff --git a/types/types.d.ts b/types/types.d.ts index 05f7c36ec..505de8504 100644 --- a/types/types.d.ts +++ b/types/types.d.ts @@ -17,6 +17,7 @@ export type ChartTypes = "area" | "area-spline" | "area-spline-range" | "area-step" + | "area-step-range" | "bar" | "bubble" | "candlestick" From b96566f224486a38b77a250537d3b933589ebd6f Mon Sep 17 00:00:00 2001 From: vlaforet Date: Tue, 28 May 2024 20:53:18 +0200 Subject: [PATCH 2/2] fix(step-range): Pass mid range value to getYScaleById in isWithinShape instead of array of values --- src/ChartInternal/shape/shape.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ChartInternal/shape/shape.ts b/src/ChartInternal/shape/shape.ts index 53a5caeb3..4c6fbe03a 100644 --- a/src/ChartInternal/shape/shape.ts +++ b/src/ChartInternal/shape/shape.ts @@ -531,7 +531,7 @@ export default { isWithin = false; } else if ($$.hasValidPointType?.(that.nodeName)) { isWithin = $$.isStepType(d) ? - $$.isWithinStep(that, $$.getYScaleById(d.id)(d.value)) : + $$.isWithinStep(that, $$.getYScaleById(d.id)($$.getBaseValue(d))) : $$.isWithinCircle( that, $$.isBubbleType(d) ? $$.pointSelectR(d) * 1.5 : 0