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 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<BaseChartProps, 'container' | 'type' | 'data'>, + Omit<Partial<IMosaicChartSpec>, 'type'> { + // +} + +export const MosaicChart = createChart<React.PropsWithChildren<MosaicChartProps> & { 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<BaseChartProps, 'container' | 'type' | 'data'>, + Omit<Partial<IPictogramChartSpec>, 'type'> {} + +export const PictogramChart = createChart<React.PropsWithChildren<PictogramChartProps> & { 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<BaseChartProps, 'container' | 'type' | 'data'>, + Omit<Partial<IRangeAreaChartSpec>, 'type'> {} + +export const RangeAreaChart = createChart<React.PropsWithChildren<RangeAreaChartProps> & { 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<IGaugeSeriesSpec, 'type'>; -export const Gauge = createSeries<GaugeProps>('Sankey', ['segment', 'track', 'label'], 'gauge', [registerGaugeSeries]); +export const Gauge = createSeries<GaugeProps>('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<IGaugePointerSeriesSpec, 'type'>; + +export const GaugePointer = createSeries<GaugePointerProps>( + 'GaugePointer', + ['pinBackground', 'pin', 'pointer'], + 'gaugePointer', + [registerGaugePointerSeries] +); 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<IHeatmapChartSpec, 'type'>; -export const Heatmap = createSeries<HeatmapProps>('Treemap', ['cell', 'cellBackground', 'label'], 'heatmap', [ +export const Heatmap = createSeries<HeatmapProps>('Heatmap', ['cell', 'cellBackground', 'label'], 'heatmap', [ registerHeatmapSeries ]); 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<IMosaicSeriesSpec, 'type'>; + +export const Mosaic = createSeries<MosaicProps>('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<IPictogramSeriesSpec, 'type'>; + +export const Pictogram = createSeries<PictogramProps>('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<IRangeAreaSeriesSpec, 'type'>; + +export const RangeArea = createSeries<RangeAreaProps>('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<IVennSeriesSpec, 'type'>; + +export const Venn = createSeries<VennProps>('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';