From 7801cd48e65878838a65a866dc26c6b4da53c40b Mon Sep 17 00:00:00 2001 From: xile611 Date: Thu, 19 Dec 2024 11:27:10 +0800 Subject: [PATCH 1/3] feat: add miss Series and Chart in react vchart, close #3578 --- .../react-vchart/src/charts/MosaicChart.tsx | 21 +++++++++++++++++++ .../src/charts/PictogramChart.tsx | 19 +++++++++++++++++ .../src/charts/RangeAreaChart.tsx | 19 +++++++++++++++++ packages/react-vchart/src/charts/index.ts | 4 ++++ packages/react-vchart/src/series/Gauge.tsx | 5 +++-- .../react-vchart/src/series/GaugePointer.tsx | 14 +++++++++++++ packages/react-vchart/src/series/Mosaic.tsx | 8 +++++++ .../react-vchart/src/series/Pictogram.tsx | 10 +++++++++ .../react-vchart/src/series/RangeArea.tsx | 10 +++++++++ packages/react-vchart/src/series/Venn.tsx | 10 +++++++++ packages/react-vchart/src/series/index.ts | 5 +++++ packages/vchart/src/series/index.ts | 16 +++++++++++--- 12 files changed, 136 insertions(+), 5 deletions(-) create mode 100644 packages/react-vchart/src/charts/MosaicChart.tsx create mode 100644 packages/react-vchart/src/charts/PictogramChart.tsx create mode 100644 packages/react-vchart/src/charts/RangeAreaChart.tsx create mode 100644 packages/react-vchart/src/series/GaugePointer.tsx create mode 100644 packages/react-vchart/src/series/Mosaic.tsx create mode 100644 packages/react-vchart/src/series/Pictogram.tsx create mode 100644 packages/react-vchart/src/series/RangeArea.tsx create mode 100644 packages/react-vchart/src/series/Venn.tsx diff --git a/packages/react-vchart/src/charts/MosaicChart.tsx b/packages/react-vchart/src/charts/MosaicChart.tsx new file mode 100644 index 0000000000..d98d59d22f --- /dev/null +++ b/packages/react-vchart/src/charts/MosaicChart.tsx @@ -0,0 +1,21 @@ +import type React from 'react'; +import type { IMosaicChartSpec, IVChartConstructor } from '@visactor/vchart'; +import { VChart, registerMosaicChart, registerLabel, registerTotalLabel } from '@visactor/vchart'; +import type { BaseChartProps } from './BaseChart'; +import { createChart } from './BaseChart'; +import { registers } from './registers/cartesian'; + +export interface MosaicChartProps + extends Omit, + Omit, 'type'> { + // +} + +export const MosaicChart = createChart & { type?: 'mosaic' }>( + 'MosaicChart', + { + type: 'mosaic', + vchartConstrouctor: VChart as IVChartConstructor + }, + [registerMosaicChart, registerLabel, registerTotalLabel, ...registers] +); diff --git a/packages/react-vchart/src/charts/PictogramChart.tsx b/packages/react-vchart/src/charts/PictogramChart.tsx new file mode 100644 index 0000000000..7f560432b1 --- /dev/null +++ b/packages/react-vchart/src/charts/PictogramChart.tsx @@ -0,0 +1,19 @@ +import type React from 'react'; +import type { IPictogramChartSpec, IVChartConstructor } from '@visactor/vchart'; +import { VChart, registerPictogramChart, registerLabel } from '@visactor/vchart'; +import { registers } from './registers/simple'; +import type { BaseChartProps } from './BaseChart'; +import { createChart } from './BaseChart'; + +export interface PictogramChartProps + extends Omit, + Omit, 'type'> {} + +export const PictogramChart = createChart & { type?: 'pictogram' }>( + 'PictogramChart', + { + type: 'pictogram', + vchartConstrouctor: VChart as IVChartConstructor + }, + [registerPictogramChart, registerLabel, ...registers] +); diff --git a/packages/react-vchart/src/charts/RangeAreaChart.tsx b/packages/react-vchart/src/charts/RangeAreaChart.tsx new file mode 100644 index 0000000000..b495d3d44b --- /dev/null +++ b/packages/react-vchart/src/charts/RangeAreaChart.tsx @@ -0,0 +1,19 @@ +import type React from 'react'; +import type { IRangeAreaChartSpec, IVChartConstructor } from '@visactor/vchart'; +import { VChart, registerRangeAreaChart, registerLabel } from '@visactor/vchart'; +import { registers } from './registers/cartesian'; +import type { BaseChartProps } from './BaseChart'; +import { createChart } from './BaseChart'; + +export interface RangeAreaChartProps + extends Omit, + Omit, 'type'> {} + +export const RangeAreaChart = createChart & { type?: 'rangeArea' }>( + 'RangeAreaChart', + { + type: 'rangeArea', + vchartConstrouctor: VChart as IVChartConstructor + }, + [registerRangeAreaChart, registerLabel, ...registers] +); diff --git a/packages/react-vchart/src/charts/index.ts b/packages/react-vchart/src/charts/index.ts index 597cb0e4f3..9d6d4f7f5b 100644 --- a/packages/react-vchart/src/charts/index.ts +++ b/packages/react-vchart/src/charts/index.ts @@ -20,9 +20,13 @@ export * from './LineChart'; export * from './LiquidChart'; export * from './MapChart'; +export * from './MosaicChart'; +export * from './PictogramChart'; + export * from './PieChart'; export * from './Pie3dChart'; export * from './RadarChart'; +export * from './RangeAreaChart'; export * from './RangeColumnChart'; export * from './RangeColumn3dChart'; export * from './RoseChart'; diff --git a/packages/react-vchart/src/series/Gauge.tsx b/packages/react-vchart/src/series/Gauge.tsx index 5f700bb022..26642aba69 100644 --- a/packages/react-vchart/src/series/Gauge.tsx +++ b/packages/react-vchart/src/series/Gauge.tsx @@ -1,8 +1,9 @@ -import { BaseSeriesProps, createSeries } from './BaseSeries'; +import type { BaseSeriesProps } from './BaseSeries'; +import { createSeries } from './BaseSeries'; import type { IGaugeSeriesSpec } from '@visactor/vchart'; import { registerGaugeSeries } from '@visactor/vchart'; export type GaugeProps = BaseSeriesProps & Omit; -export const Gauge = createSeries('Sankey', ['segment', 'track', 'label'], 'gauge', [registerGaugeSeries]); +export const Gauge = createSeries('Gauge', ['segment', 'track', 'label'], 'gauge', [registerGaugeSeries]); diff --git a/packages/react-vchart/src/series/GaugePointer.tsx b/packages/react-vchart/src/series/GaugePointer.tsx new file mode 100644 index 0000000000..f06e0a5719 --- /dev/null +++ b/packages/react-vchart/src/series/GaugePointer.tsx @@ -0,0 +1,14 @@ +import type { BaseSeriesProps } from './BaseSeries'; +import { createSeries } from './BaseSeries'; + +import type { IGaugePointerSeriesSpec } from '@visactor/vchart'; +import { registerGaugePointerSeries } from '@visactor/vchart'; + +export type GaugePointerProps = BaseSeriesProps & Omit; + +export const GaugePointer = createSeries( + 'GaugePointer', + ['pinBackground', 'pin', 'pointer'], + 'gaugePointer', + [registerGaugePointerSeries] +); diff --git a/packages/react-vchart/src/series/Mosaic.tsx b/packages/react-vchart/src/series/Mosaic.tsx new file mode 100644 index 0000000000..56f6601c3d --- /dev/null +++ b/packages/react-vchart/src/series/Mosaic.tsx @@ -0,0 +1,8 @@ +import type { BaseSeriesProps } from './BaseSeries'; +import { createSeries } from './BaseSeries'; +import type { IMosaicSeriesSpec } from '@visactor/vchart'; +import { registerMosaicSeries } from '@visactor/vchart'; + +export type MosaicProps = BaseSeriesProps & Omit; + +export const Mosaic = createSeries('Mosaic', ['mosaic'], 'mosaic', [registerMosaicSeries]); diff --git a/packages/react-vchart/src/series/Pictogram.tsx b/packages/react-vchart/src/series/Pictogram.tsx new file mode 100644 index 0000000000..53e360db63 --- /dev/null +++ b/packages/react-vchart/src/series/Pictogram.tsx @@ -0,0 +1,10 @@ +import type { BaseSeriesProps } from './BaseSeries'; +import { createSeries } from './BaseSeries'; +import type { IPictogramSeriesSpec } from '@visactor/vchart'; +import { registerPictogramSeries } from '@visactor/vchart'; + +export type PictogramProps = BaseSeriesProps & Omit; + +export const Pictogram = createSeries('Pictogram', ['pictogram'], 'pictogram', [ + registerPictogramSeries +]); diff --git a/packages/react-vchart/src/series/RangeArea.tsx b/packages/react-vchart/src/series/RangeArea.tsx new file mode 100644 index 0000000000..882bea1045 --- /dev/null +++ b/packages/react-vchart/src/series/RangeArea.tsx @@ -0,0 +1,10 @@ +import type { BaseSeriesProps } from './BaseSeries'; +import { createSeries } from './BaseSeries'; +import type { IRangeAreaSeriesSpec } from '@visactor/vchart'; +import { registerRangeAreaSeries } from '@visactor/vchart'; + +export type RangeAreaProps = BaseSeriesProps & Omit; + +export const RangeArea = createSeries('RangeArea', ['rangeArea'], 'rangeArea', [ + registerRangeAreaSeries +]); diff --git a/packages/react-vchart/src/series/Venn.tsx b/packages/react-vchart/src/series/Venn.tsx new file mode 100644 index 0000000000..022ebb9477 --- /dev/null +++ b/packages/react-vchart/src/series/Venn.tsx @@ -0,0 +1,10 @@ +import type { BaseSeriesProps } from './BaseSeries'; +import { createSeries } from './BaseSeries'; +import type { IVennSeriesSpec } from '@visactor/vchart'; +import { registerVennSeries } from '@visactor/vchart'; + +export type VennProps = BaseSeriesProps & Omit; + +export const Venn = createSeries('Venn', ['circle', 'overlap', 'overlapLabel'], 'venn', [ + registerVennSeries +]); diff --git a/packages/react-vchart/src/series/index.ts b/packages/react-vchart/src/series/index.ts index 3f5171d7af..5863b73ae7 100644 --- a/packages/react-vchart/src/series/index.ts +++ b/packages/react-vchart/src/series/index.ts @@ -13,6 +13,7 @@ export * from './Funnel'; export * from './Funnel3d'; export * from './Gauge'; +export * from './GaugePointer'; export * from './Heatmap'; export * from './Line'; export * from './LinearProgress'; @@ -20,9 +21,12 @@ export * from './Link'; export * from './Liquid'; export * from './Map'; +export * from './Mosaic'; +export * from './Pictogram'; export * from './Pie'; export * from './Pie3d'; export * from './Radar'; +export * from './RangeArea'; export * from './RangeColumn'; export * from './RangeColumn3d'; export * from './Rose'; @@ -31,6 +35,7 @@ export * from './Sankey'; export * from './Scatter'; export * from './Sunburst'; export * from './Treemap'; +export * from './Venn'; export * from './Waterfall'; export * from './WordCloud'; export * from './WordCloud3d'; diff --git a/packages/vchart/src/series/index.ts b/packages/vchart/src/series/index.ts index 4d4ce819e4..084e6ebe43 100644 --- a/packages/vchart/src/series/index.ts +++ b/packages/vchart/src/series/index.ts @@ -71,6 +71,10 @@ import type { ILiquidSeriesSpec } from './liquid/interface'; import { LiquidSeries, registerLiquidSeries } from './liquid/liquid'; import type { IVennSeriesSpec } from './venn/interface'; import { VennSeries, registerVennSeries } from './venn/venn'; +import type { IMosaicSeriesSpec } from './mosaic/interface'; +import { MosaicSeries, registerMosaicSeries } from './mosaic/mosaic'; +import type { IPictogramSeriesSpec } from './pictogram/interface'; +import { PictogramSeries, registerPictogramSeries } from './pictogram/pictogram'; import type { ISeries, ICartesianSeries, IPolarSeries, IGeoSeries } from './interface'; @@ -112,7 +116,9 @@ export { ProgressLikeSeries, CorrelationSeries, LiquidSeries, - VennSeries + VennSeries, + PictogramSeries, + MosaicSeries }; export { @@ -147,7 +153,9 @@ export { registerWordCloud3dSeries, registerWordCloudSeries, registerLiquidSeries, - registerVennSeries + registerVennSeries, + registerMosaicSeries, + registerPictogramSeries }; export type { @@ -191,7 +199,9 @@ export type { IWordCloudSeriesSpec, ICorrelationSeriesSpec, ILiquidSeriesSpec, - IVennSeriesSpec + IVennSeriesSpec, + IMosaicSeriesSpec, + IPictogramSeriesSpec }; export * from './interface'; From e2a3d1b973cab4f690c286ba9d13677dc32e836b Mon Sep 17 00:00:00 2001 From: xile611 Date: Thu, 19 Dec 2024 11:28:26 +0800 Subject: [PATCH 2/3] docs: update changelog of rush --- .../feat-react-vchart-series_2024-12-19-03-28.json | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 common/changes/@visactor/vchart/feat-react-vchart-series_2024-12-19-03-28.json diff --git a/common/changes/@visactor/vchart/feat-react-vchart-series_2024-12-19-03-28.json b/common/changes/@visactor/vchart/feat-react-vchart-series_2024-12-19-03-28.json new file mode 100644 index 0000000000..5108a884dc --- /dev/null +++ b/common/changes/@visactor/vchart/feat-react-vchart-series_2024-12-19-03-28.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vchart", + "comment": "feat: add miss Series and Chart in react vchart, close #3578", + "type": "none" + } + ], + "packageName": "@visactor/vchart" +} \ No newline at end of file From 7b751de2565c2dbbb0291c7e71f3afedba0d6079 Mon Sep 17 00:00:00 2001 From: xile611 Date: Thu, 19 Dec 2024 15:46:19 +0800 Subject: [PATCH 3/3] fix: fix error component name of Heatmap series --- packages/react-vchart/src/series/Heatmap.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/react-vchart/src/series/Heatmap.tsx b/packages/react-vchart/src/series/Heatmap.tsx index dc87915ebd..22b1ecb9a1 100644 --- a/packages/react-vchart/src/series/Heatmap.tsx +++ b/packages/react-vchart/src/series/Heatmap.tsx @@ -1,9 +1,10 @@ -import { BaseSeriesProps, createSeries } from './BaseSeries'; +import type { BaseSeriesProps } from './BaseSeries'; +import { createSeries } from './BaseSeries'; import type { IHeatmapChartSpec } from '@visactor/vchart'; import { registerHeatmapSeries } from '@visactor/vchart'; export type HeatmapProps = BaseSeriesProps & Omit; -export const Heatmap = createSeries('Treemap', ['cell', 'cellBackground', 'label'], 'heatmap', [ +export const Heatmap = createSeries('Heatmap', ['cell', 'cellBackground', 'label'], 'heatmap', [ registerHeatmapSeries ]);