@gravity-ui/charts 1.23.0 → 1.24.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/AxisX/AxisX.d.ts +3 -3
- package/dist/cjs/components/ChartInner/index.js +95 -27
- package/dist/cjs/components/ChartInner/useChartInnerHandlers.d.ts +3 -3
- package/dist/cjs/components/ChartInner/useChartInnerProps.d.ts +41 -20
- package/dist/cjs/components/ChartInner/useChartInnerProps.js +22 -11
- package/dist/cjs/components/ChartInner/useChartInnerState.d.ts +6 -1
- package/dist/cjs/components/ChartInner/useChartInnerState.js +17 -1
- package/dist/cjs/components/ChartInner/utils.d.ts +5 -2
- package/dist/cjs/components/ChartInner/utils.js +13 -0
- package/dist/cjs/components/RangeSlider/index.d.ts +6 -0
- package/dist/cjs/components/RangeSlider/index.js +41 -0
- package/dist/cjs/components/RangeSlider/styles.css +6 -0
- package/dist/cjs/components/RangeSlider/utils.d.ts +5 -0
- package/dist/cjs/components/RangeSlider/utils.js +18 -0
- package/dist/cjs/components/Tooltip/DefaultTooltipContent/index.js +2 -1
- package/dist/cjs/components/Tooltip/DefaultTooltipContent/utils.js +3 -2
- package/dist/cjs/components/Tooltip/index.d.ts +3 -3
- package/dist/cjs/constants/chart-types.d.ts +3 -1
- package/dist/cjs/constants/chart-types.js +2 -1
- package/dist/cjs/constants/defaults/brush.d.ts +2 -0
- package/dist/cjs/constants/defaults/brush.js +15 -0
- package/dist/cjs/constants/defaults/index.d.ts +1 -0
- package/dist/cjs/constants/defaults/index.js +1 -0
- package/dist/cjs/constants/defaults/series-options.d.ts +2 -1
- package/dist/cjs/constants/defaults/series-options.js +11 -0
- package/dist/cjs/hooks/index.d.ts +5 -0
- package/dist/cjs/hooks/index.js +5 -0
- package/dist/cjs/hooks/useAxis/index.d.ts +4 -3
- package/dist/cjs/hooks/useAxis/index.js +2 -2
- package/dist/cjs/hooks/useAxis/range-slider.d.ts +5 -0
- package/dist/cjs/hooks/useAxis/range-slider.js +16 -0
- package/dist/cjs/hooks/useAxis/types.d.ts +66 -0
- package/dist/cjs/hooks/useAxis/types.js +1 -0
- package/dist/cjs/hooks/{useChartOptions → useAxis}/utils.d.ts +1 -2
- package/dist/cjs/hooks/useAxis/utils.js +9 -0
- package/dist/{esm/hooks/useChartOptions → cjs/hooks/useAxis}/x-axis.d.ts +2 -2
- package/dist/{esm/hooks/useChartOptions → cjs/hooks/useAxis}/x-axis.js +5 -3
- package/dist/cjs/hooks/{useChartOptions → useAxis}/y-axis.d.ts +2 -2
- package/dist/cjs/hooks/{useChartOptions → useAxis}/y-axis.js +3 -3
- package/dist/cjs/hooks/useAxisScales/index.d.ts +6 -6
- package/dist/cjs/hooks/useAxisScales/index.js +107 -34
- package/dist/cjs/hooks/useAxisScales/utils.d.ts +19 -0
- package/dist/cjs/hooks/useAxisScales/utils.js +34 -0
- package/dist/cjs/hooks/useBrush/index.js +89 -27
- package/dist/cjs/hooks/useBrush/styles.css +1 -0
- package/dist/cjs/hooks/useBrush/types.d.ts +6 -6
- package/dist/cjs/hooks/useBrush/utils.d.ts +19 -0
- package/dist/cjs/hooks/useBrush/utils.js +172 -0
- package/dist/cjs/hooks/useChartDimensions/index.d.ts +4 -4
- package/dist/cjs/hooks/useChartDimensions/index.js +14 -4
- package/dist/cjs/hooks/useChartDimensions/utils.d.ts +4 -4
- package/dist/cjs/hooks/useChartOptions/index.d.ts +9 -3
- package/dist/cjs/hooks/useChartOptions/tooltip.js +1 -1
- package/dist/cjs/hooks/useChartOptions/types.d.ts +4 -64
- package/dist/cjs/hooks/useChartOptions/zoom.js +24 -21
- package/dist/cjs/hooks/useCrosshair/index.d.ts +3 -3
- package/dist/cjs/hooks/useNormalizedOriginalData/index.d.ts +1 -0
- package/dist/cjs/hooks/useNormalizedOriginalData/index.js +1 -2
- package/dist/cjs/hooks/useRangeSlider/index.d.ts +4 -0
- package/dist/cjs/hooks/useRangeSlider/index.js +130 -0
- package/dist/cjs/hooks/useRangeSlider/types.d.ts +44 -0
- package/dist/cjs/hooks/useRangeSlider/types.js +1 -0
- package/dist/cjs/hooks/useRangeSlider/utils.d.ts +16 -0
- package/dist/cjs/hooks/useRangeSlider/utils.js +19 -0
- package/dist/cjs/hooks/useSeries/prepare-area.js +2 -1
- package/dist/cjs/hooks/useSeries/prepare-bar-x.js +8 -8
- package/dist/cjs/hooks/useSeries/prepare-bar-y.d.ts +1 -0
- package/dist/cjs/hooks/useSeries/prepare-bar-y.js +7 -6
- package/dist/cjs/hooks/useSeries/prepare-funnel.d.ts +10 -0
- package/dist/cjs/hooks/useSeries/prepare-funnel.js +50 -0
- package/dist/cjs/hooks/useSeries/prepare-legend.js +4 -1
- package/dist/cjs/hooks/useSeries/prepare-line.js +2 -1
- package/dist/cjs/hooks/useSeries/prepare-pie.js +3 -2
- package/dist/cjs/hooks/useSeries/prepare-scatter.js +2 -0
- package/dist/cjs/hooks/useSeries/prepareSeries.js +9 -0
- package/dist/cjs/hooks/useSeries/types.d.ts +22 -6
- package/dist/cjs/hooks/useShapes/area/index.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/area/index.js +2 -2
- package/dist/cjs/hooks/useShapes/area/prepare-data.d.ts +5 -3
- package/dist/cjs/hooks/useShapes/area/prepare-data.js +158 -157
- package/dist/cjs/hooks/useShapes/bar-x/index.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/bar-x/index.js +2 -2
- package/dist/cjs/hooks/useShapes/bar-x/prepare-data.d.ts +5 -3
- package/dist/cjs/hooks/useShapes/bar-x/prepare-data.js +102 -82
- package/dist/cjs/hooks/useShapes/bar-y/index.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/bar-y/index.js +2 -2
- package/dist/cjs/hooks/useShapes/bar-y/prepare-data.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/bar-y/prepare-data.js +2 -3
- package/dist/cjs/hooks/useShapes/funnel/index.d.ts +13 -0
- package/dist/cjs/hooks/useShapes/funnel/index.js +95 -0
- package/dist/cjs/hooks/useShapes/funnel/prepare-data.d.ts +9 -0
- package/dist/cjs/hooks/useShapes/funnel/prepare-data.js +120 -0
- package/dist/cjs/hooks/useShapes/funnel/types.d.ts +32 -0
- package/dist/cjs/hooks/useShapes/funnel/types.js +1 -0
- package/dist/cjs/hooks/useShapes/heatmap/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/heatmap/index.js +2 -2
- package/dist/cjs/hooks/useShapes/heatmap/prepare-data.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/index.d.ts +15 -10
- package/dist/cjs/hooks/useShapes/index.js +49 -25
- package/dist/cjs/hooks/useShapes/line/index.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/line/index.js +2 -2
- package/dist/cjs/hooks/useShapes/line/prepare-data.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/line/prepare-data.js +23 -34
- package/dist/cjs/hooks/useShapes/pie/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/pie/index.js +2 -2
- package/dist/cjs/hooks/useShapes/radar/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/radar/index.js +2 -2
- package/dist/cjs/hooks/useShapes/sankey/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/sankey/index.js +2 -2
- package/dist/cjs/hooks/useShapes/scatter/index.d.ts +3 -2
- package/dist/cjs/hooks/useShapes/scatter/index.js +4 -4
- package/dist/cjs/hooks/useShapes/scatter/prepare-data.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/styles.css +8 -8
- package/dist/cjs/hooks/useShapes/treemap/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/treemap/index.js +2 -2
- package/dist/cjs/hooks/useShapes/utils.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/waterfall/index.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/waterfall/index.js +2 -2
- package/dist/cjs/hooks/useShapes/waterfall/prepare-data.d.ts +3 -3
- package/dist/cjs/hooks/useZoom/index.d.ts +4 -3
- package/dist/cjs/hooks/useZoom/utils.d.ts +3 -3
- package/dist/cjs/hooks/utils/bar-x.d.ts +2 -2
- package/dist/cjs/hooks/utils/bar-y.d.ts +2 -2
- package/dist/cjs/types/chart/area.d.ts +7 -2
- package/dist/cjs/types/chart/axis.d.ts +45 -0
- package/dist/cjs/types/chart/bar-x.d.ts +7 -3
- package/dist/cjs/types/chart/bar-y.d.ts +2 -2
- package/dist/cjs/types/chart/base.d.ts +26 -25
- package/dist/cjs/types/chart/brush.d.ts +22 -0
- package/dist/cjs/types/chart/brush.js +1 -0
- package/dist/cjs/types/chart/funnel.d.ts +46 -0
- package/dist/cjs/types/chart/funnel.js +1 -0
- package/dist/cjs/types/chart/heatmap.d.ts +2 -2
- package/dist/cjs/types/chart/legend.d.ts +6 -0
- package/dist/cjs/types/chart/line.d.ts +7 -2
- package/dist/cjs/types/chart/pie.d.ts +2 -2
- package/dist/cjs/types/chart/radar.d.ts +2 -2
- package/dist/cjs/types/chart/sankey.d.ts +2 -2
- package/dist/cjs/types/chart/scatter.d.ts +7 -2
- package/dist/cjs/types/chart/series.d.ts +17 -2
- package/dist/cjs/types/chart/tooltip.d.ts +10 -2
- package/dist/cjs/types/chart/treemap.d.ts +2 -2
- package/dist/cjs/types/chart/waterfall.d.ts +2 -2
- package/dist/cjs/types/chart/zoom.d.ts +2 -5
- package/dist/cjs/types/index.d.ts +2 -0
- package/dist/cjs/types/index.js +2 -0
- package/dist/cjs/types/misc.d.ts +6 -0
- package/dist/cjs/utils/chart/axis.d.ts +5 -2
- package/dist/cjs/utils/chart/axis.js +47 -1
- package/dist/cjs/utils/chart/color.js +2 -1
- package/dist/cjs/utils/chart/get-closest-data.js +18 -1
- package/dist/cjs/utils/chart/index.js +4 -4
- package/dist/cjs/utils/chart/series/sorting.js +3 -3
- package/dist/cjs/utils/chart/zoom.d.ts +3 -3
- package/dist/cjs/utils/chart/zoom.js +2 -2
- package/dist/cjs/validation/index.js +3 -3
- package/dist/esm/components/AxisX/AxisX.d.ts +3 -3
- package/dist/esm/components/ChartInner/index.js +95 -27
- package/dist/esm/components/ChartInner/useChartInnerHandlers.d.ts +3 -3
- package/dist/esm/components/ChartInner/useChartInnerProps.d.ts +41 -20
- package/dist/esm/components/ChartInner/useChartInnerProps.js +22 -11
- package/dist/esm/components/ChartInner/useChartInnerState.d.ts +6 -1
- package/dist/esm/components/ChartInner/useChartInnerState.js +17 -1
- package/dist/esm/components/ChartInner/utils.d.ts +5 -2
- package/dist/esm/components/ChartInner/utils.js +13 -0
- package/dist/esm/components/RangeSlider/index.d.ts +6 -0
- package/dist/esm/components/RangeSlider/index.js +41 -0
- package/dist/esm/components/RangeSlider/styles.css +6 -0
- package/dist/esm/components/RangeSlider/utils.d.ts +5 -0
- package/dist/esm/components/RangeSlider/utils.js +18 -0
- package/dist/esm/components/Tooltip/DefaultTooltipContent/index.js +2 -1
- package/dist/esm/components/Tooltip/DefaultTooltipContent/utils.js +3 -2
- package/dist/esm/components/Tooltip/index.d.ts +3 -3
- package/dist/esm/constants/chart-types.d.ts +3 -1
- package/dist/esm/constants/chart-types.js +2 -1
- package/dist/esm/constants/defaults/brush.d.ts +2 -0
- package/dist/esm/constants/defaults/brush.js +15 -0
- package/dist/esm/constants/defaults/index.d.ts +1 -0
- package/dist/esm/constants/defaults/index.js +1 -0
- package/dist/esm/constants/defaults/series-options.d.ts +2 -1
- package/dist/esm/constants/defaults/series-options.js +11 -0
- package/dist/esm/hooks/index.d.ts +5 -0
- package/dist/esm/hooks/index.js +5 -0
- package/dist/esm/hooks/useAxis/index.d.ts +4 -3
- package/dist/esm/hooks/useAxis/index.js +2 -2
- package/dist/esm/hooks/useAxis/range-slider.d.ts +5 -0
- package/dist/esm/hooks/useAxis/range-slider.js +16 -0
- package/dist/esm/hooks/useAxis/types.d.ts +66 -0
- package/dist/esm/hooks/useAxis/types.js +1 -0
- package/dist/esm/hooks/{useChartOptions → useAxis}/utils.d.ts +1 -2
- package/dist/esm/hooks/useAxis/utils.js +9 -0
- package/dist/{cjs/hooks/useChartOptions → esm/hooks/useAxis}/x-axis.d.ts +2 -2
- package/dist/{cjs/hooks/useChartOptions → esm/hooks/useAxis}/x-axis.js +5 -3
- package/dist/esm/hooks/{useChartOptions → useAxis}/y-axis.d.ts +2 -2
- package/dist/esm/hooks/{useChartOptions → useAxis}/y-axis.js +3 -3
- package/dist/esm/hooks/useAxisScales/index.d.ts +6 -6
- package/dist/esm/hooks/useAxisScales/index.js +107 -34
- package/dist/esm/hooks/useAxisScales/utils.d.ts +19 -0
- package/dist/esm/hooks/useAxisScales/utils.js +34 -0
- package/dist/esm/hooks/useBrush/index.js +89 -27
- package/dist/esm/hooks/useBrush/styles.css +1 -0
- package/dist/esm/hooks/useBrush/types.d.ts +6 -6
- package/dist/esm/hooks/useBrush/utils.d.ts +19 -0
- package/dist/esm/hooks/useBrush/utils.js +172 -0
- package/dist/esm/hooks/useChartDimensions/index.d.ts +4 -4
- package/dist/esm/hooks/useChartDimensions/index.js +14 -4
- package/dist/esm/hooks/useChartDimensions/utils.d.ts +4 -4
- package/dist/esm/hooks/useChartOptions/index.d.ts +9 -3
- package/dist/esm/hooks/useChartOptions/tooltip.js +1 -1
- package/dist/esm/hooks/useChartOptions/types.d.ts +4 -64
- package/dist/esm/hooks/useChartOptions/zoom.js +24 -21
- package/dist/esm/hooks/useCrosshair/index.d.ts +3 -3
- package/dist/esm/hooks/useNormalizedOriginalData/index.d.ts +1 -0
- package/dist/esm/hooks/useNormalizedOriginalData/index.js +1 -2
- package/dist/esm/hooks/useRangeSlider/index.d.ts +4 -0
- package/dist/esm/hooks/useRangeSlider/index.js +130 -0
- package/dist/esm/hooks/useRangeSlider/types.d.ts +44 -0
- package/dist/esm/hooks/useRangeSlider/types.js +1 -0
- package/dist/esm/hooks/useRangeSlider/utils.d.ts +16 -0
- package/dist/esm/hooks/useRangeSlider/utils.js +19 -0
- package/dist/esm/hooks/useSeries/prepare-area.js +2 -1
- package/dist/esm/hooks/useSeries/prepare-bar-x.js +8 -8
- package/dist/esm/hooks/useSeries/prepare-bar-y.d.ts +1 -0
- package/dist/esm/hooks/useSeries/prepare-bar-y.js +7 -6
- package/dist/esm/hooks/useSeries/prepare-funnel.d.ts +10 -0
- package/dist/esm/hooks/useSeries/prepare-funnel.js +50 -0
- package/dist/esm/hooks/useSeries/prepare-legend.js +4 -1
- package/dist/esm/hooks/useSeries/prepare-line.js +2 -1
- package/dist/esm/hooks/useSeries/prepare-pie.js +3 -2
- package/dist/esm/hooks/useSeries/prepare-scatter.js +2 -0
- package/dist/esm/hooks/useSeries/prepareSeries.js +9 -0
- package/dist/esm/hooks/useSeries/types.d.ts +22 -6
- package/dist/esm/hooks/useShapes/area/index.d.ts +3 -3
- package/dist/esm/hooks/useShapes/area/index.js +2 -2
- package/dist/esm/hooks/useShapes/area/prepare-data.d.ts +5 -3
- package/dist/esm/hooks/useShapes/area/prepare-data.js +158 -157
- package/dist/esm/hooks/useShapes/bar-x/index.d.ts +3 -3
- package/dist/esm/hooks/useShapes/bar-x/index.js +2 -2
- package/dist/esm/hooks/useShapes/bar-x/prepare-data.d.ts +5 -3
- package/dist/esm/hooks/useShapes/bar-x/prepare-data.js +102 -82
- package/dist/esm/hooks/useShapes/bar-y/index.d.ts +3 -3
- package/dist/esm/hooks/useShapes/bar-y/index.js +2 -2
- package/dist/esm/hooks/useShapes/bar-y/prepare-data.d.ts +3 -3
- package/dist/esm/hooks/useShapes/bar-y/prepare-data.js +2 -3
- package/dist/esm/hooks/useShapes/funnel/index.d.ts +13 -0
- package/dist/esm/hooks/useShapes/funnel/index.js +95 -0
- package/dist/esm/hooks/useShapes/funnel/prepare-data.d.ts +9 -0
- package/dist/esm/hooks/useShapes/funnel/prepare-data.js +120 -0
- package/dist/esm/hooks/useShapes/funnel/types.d.ts +32 -0
- package/dist/esm/hooks/useShapes/funnel/types.js +1 -0
- package/dist/esm/hooks/useShapes/heatmap/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/heatmap/index.js +2 -2
- package/dist/esm/hooks/useShapes/heatmap/prepare-data.d.ts +3 -3
- package/dist/esm/hooks/useShapes/index.d.ts +15 -10
- package/dist/esm/hooks/useShapes/index.js +49 -25
- package/dist/esm/hooks/useShapes/line/index.d.ts +3 -3
- package/dist/esm/hooks/useShapes/line/index.js +2 -2
- package/dist/esm/hooks/useShapes/line/prepare-data.d.ts +3 -3
- package/dist/esm/hooks/useShapes/line/prepare-data.js +23 -34
- package/dist/esm/hooks/useShapes/pie/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/pie/index.js +2 -2
- package/dist/esm/hooks/useShapes/radar/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/radar/index.js +2 -2
- package/dist/esm/hooks/useShapes/sankey/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/sankey/index.js +2 -2
- package/dist/esm/hooks/useShapes/scatter/index.d.ts +3 -2
- package/dist/esm/hooks/useShapes/scatter/index.js +4 -4
- package/dist/esm/hooks/useShapes/scatter/prepare-data.d.ts +3 -3
- package/dist/esm/hooks/useShapes/styles.css +8 -8
- package/dist/esm/hooks/useShapes/treemap/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/treemap/index.js +2 -2
- package/dist/esm/hooks/useShapes/utils.d.ts +3 -3
- package/dist/esm/hooks/useShapes/waterfall/index.d.ts +3 -3
- package/dist/esm/hooks/useShapes/waterfall/index.js +2 -2
- package/dist/esm/hooks/useShapes/waterfall/prepare-data.d.ts +3 -3
- package/dist/esm/hooks/useZoom/index.d.ts +4 -3
- package/dist/esm/hooks/useZoom/utils.d.ts +3 -3
- package/dist/esm/hooks/utils/bar-x.d.ts +2 -2
- package/dist/esm/hooks/utils/bar-y.d.ts +2 -2
- package/dist/esm/types/chart/area.d.ts +7 -2
- package/dist/esm/types/chart/axis.d.ts +45 -0
- package/dist/esm/types/chart/bar-x.d.ts +7 -3
- package/dist/esm/types/chart/bar-y.d.ts +2 -2
- package/dist/esm/types/chart/base.d.ts +26 -25
- package/dist/esm/types/chart/brush.d.ts +22 -0
- package/dist/esm/types/chart/brush.js +1 -0
- package/dist/esm/types/chart/funnel.d.ts +46 -0
- package/dist/esm/types/chart/funnel.js +1 -0
- package/dist/esm/types/chart/heatmap.d.ts +2 -2
- package/dist/esm/types/chart/legend.d.ts +6 -0
- package/dist/esm/types/chart/line.d.ts +7 -2
- package/dist/esm/types/chart/pie.d.ts +2 -2
- package/dist/esm/types/chart/radar.d.ts +2 -2
- package/dist/esm/types/chart/sankey.d.ts +2 -2
- package/dist/esm/types/chart/scatter.d.ts +7 -2
- package/dist/esm/types/chart/series.d.ts +17 -2
- package/dist/esm/types/chart/tooltip.d.ts +10 -2
- package/dist/esm/types/chart/treemap.d.ts +2 -2
- package/dist/esm/types/chart/waterfall.d.ts +2 -2
- package/dist/esm/types/chart/zoom.d.ts +2 -5
- package/dist/esm/types/index.d.ts +2 -0
- package/dist/esm/types/index.js +2 -0
- package/dist/esm/types/misc.d.ts +6 -0
- package/dist/esm/utils/chart/axis.d.ts +5 -2
- package/dist/esm/utils/chart/axis.js +47 -1
- package/dist/esm/utils/chart/color.js +2 -1
- package/dist/esm/utils/chart/get-closest-data.js +18 -1
- package/dist/esm/utils/chart/index.js +4 -4
- package/dist/esm/utils/chart/series/sorting.js +3 -3
- package/dist/esm/utils/chart/zoom.d.ts +3 -3
- package/dist/esm/utils/chart/zoom.js +2 -2
- package/dist/esm/validation/index.js +3 -3
- package/package.json +1 -1
- package/dist/cjs/hooks/useChartOptions/utils.js +0 -49
- package/dist/esm/hooks/useChartOptions/utils.js +0 -49
|
@@ -1,33 +1,7 @@
|
|
|
1
1
|
import { group } from 'd3';
|
|
2
|
-
import { getDataCategoryValue, getLabelsSize,
|
|
2
|
+
import { getDataCategoryValue, getLabelsSize, getTextSizeFn } from '../../../utils';
|
|
3
3
|
import { getFormattedValue } from '../../../utils/chart/format';
|
|
4
4
|
import { getXValue, getYValue } from '../utils';
|
|
5
|
-
async function getLabelData(point, series, xMax) {
|
|
6
|
-
const text = getFormattedValue(Object.assign({ value: point.data.label || point.data.y }, series.dataLabels));
|
|
7
|
-
const style = series.dataLabels.style;
|
|
8
|
-
const size = await getLabelsSize({ labels: [text], style, html: series.dataLabels.html });
|
|
9
|
-
const labelData = {
|
|
10
|
-
text,
|
|
11
|
-
x: point.x,
|
|
12
|
-
y: point.y - series.dataLabels.padding,
|
|
13
|
-
style,
|
|
14
|
-
size: { width: size.maxWidth, height: size.maxHeight },
|
|
15
|
-
textAnchor: 'middle',
|
|
16
|
-
series: series,
|
|
17
|
-
active: true,
|
|
18
|
-
};
|
|
19
|
-
const left = getLeftPosition(labelData);
|
|
20
|
-
if (left < 0) {
|
|
21
|
-
labelData.x = labelData.x + Math.abs(left);
|
|
22
|
-
}
|
|
23
|
-
else {
|
|
24
|
-
const right = left + labelData.size.width;
|
|
25
|
-
if (right > xMax) {
|
|
26
|
-
labelData.x = labelData.x - (right - xMax);
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
return labelData;
|
|
30
|
-
}
|
|
31
5
|
function getXValues(series, xAxis, xScale) {
|
|
32
6
|
const categories = xAxis.categories || [];
|
|
33
7
|
const xValues = series.reduce((acc, s) => {
|
|
@@ -53,148 +27,175 @@ function getXValues(series, xAxis, xScale) {
|
|
|
53
27
|
}
|
|
54
28
|
return Array.from(xValues);
|
|
55
29
|
}
|
|
30
|
+
async function prepareDataLabels({ series, points, xMax, yAxisTop, }) {
|
|
31
|
+
const svgLabels = [];
|
|
32
|
+
const htmlLabels = [];
|
|
33
|
+
const getTextSize = getTextSizeFn({ style: series.dataLabels.style });
|
|
34
|
+
for (let pointsIndex = 0; pointsIndex < points.length; pointsIndex++) {
|
|
35
|
+
const point = points[pointsIndex];
|
|
36
|
+
if (point.y === null) {
|
|
37
|
+
continue;
|
|
38
|
+
}
|
|
39
|
+
const text = getFormattedValue(Object.assign({ value: point.data.label || point.data.y }, series.dataLabels));
|
|
40
|
+
if (series.dataLabels.html) {
|
|
41
|
+
const size = await getLabelsSize({
|
|
42
|
+
labels: [text],
|
|
43
|
+
style: series.dataLabels.style,
|
|
44
|
+
html: series.dataLabels.html,
|
|
45
|
+
});
|
|
46
|
+
const labelSize = { width: size.maxWidth, height: size.maxHeight };
|
|
47
|
+
const x = Math.min(xMax - labelSize.width, Math.max(0, point.x - labelSize.width / 2));
|
|
48
|
+
const y = Math.max(yAxisTop, point.y - series.dataLabels.padding - labelSize.height);
|
|
49
|
+
htmlLabels.push({
|
|
50
|
+
x,
|
|
51
|
+
y,
|
|
52
|
+
content: text,
|
|
53
|
+
size: labelSize,
|
|
54
|
+
style: series.dataLabels.style,
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
else {
|
|
58
|
+
const labelSize = await getTextSize(text);
|
|
59
|
+
const x = Math.min(xMax - labelSize.width, Math.max(0, point.x - labelSize.width / 2));
|
|
60
|
+
const y = Math.max(yAxisTop, point.y - series.dataLabels.padding - labelSize.height);
|
|
61
|
+
svgLabels.push({
|
|
62
|
+
text,
|
|
63
|
+
x,
|
|
64
|
+
y,
|
|
65
|
+
style: series.dataLabels.style,
|
|
66
|
+
size: labelSize,
|
|
67
|
+
textAnchor: 'start',
|
|
68
|
+
series,
|
|
69
|
+
active: true,
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
return { svgLabels, htmlLabels };
|
|
74
|
+
}
|
|
56
75
|
export const prepareAreaData = async (args) => {
|
|
57
|
-
var _a;
|
|
58
|
-
const { series, xAxis, xScale, yAxis, yScale, boundsHeight: plotHeight, isOutsideBounds } = args;
|
|
76
|
+
var _a, _b;
|
|
77
|
+
const { series, xAxis, xScale, yAxis, yScale, boundsHeight: plotHeight, split, isOutsideBounds, } = args;
|
|
59
78
|
const [_xMin, xRangeMax] = xScale.range();
|
|
60
79
|
const xMax = xRangeMax / (1 - xAxis.maxPadding);
|
|
61
80
|
const result = [];
|
|
62
|
-
const
|
|
63
|
-
|
|
64
|
-
const
|
|
65
|
-
const
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
const
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
const
|
|
74
|
-
const
|
|
75
|
-
const
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
}
|
|
79
|
-
const
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
yAxis
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
? getDataCategoryValue({
|
|
88
|
-
axisDirection: 'x',
|
|
89
|
-
categories: xAxis.categories || [],
|
|
90
|
-
data: d,
|
|
91
|
-
})
|
|
92
|
-
: d.x);
|
|
93
|
-
return m.set(key, d);
|
|
94
|
-
}, new Map());
|
|
95
|
-
const points = xValues.reduce((pointsAcc, [x, xValue]) => {
|
|
96
|
-
var _a;
|
|
97
|
-
const accumulatedYValue = accumulatedYValues.get(x) || 0;
|
|
98
|
-
const d = (_a = seriesData.get(x)) !== null && _a !== void 0 ? _a : {
|
|
99
|
-
x,
|
|
100
|
-
y: 0,
|
|
101
|
-
};
|
|
102
|
-
const yValue = getYValue({ point: d, yAxis: seriesYAxis, yScale: seriesYScale });
|
|
103
|
-
const yPointValue = yValue === null ? null : yValue - accumulatedYValue;
|
|
104
|
-
if (yPointValue !== null) {
|
|
105
|
-
accumulatedYValues.set(x, yMin - yPointValue);
|
|
81
|
+
const dataByPlots = Array.from(group(series, (s) => {
|
|
82
|
+
const yAxisIndex = s.yAxis;
|
|
83
|
+
const seriesYAxis = yAxis[yAxisIndex];
|
|
84
|
+
const plotIndex = seriesYAxis.plotIndex;
|
|
85
|
+
return plotIndex;
|
|
86
|
+
}, (s) => s.stackId));
|
|
87
|
+
const plotIndexes = Object.keys(dataByPlots);
|
|
88
|
+
for (let plotDataIndex = 0; plotDataIndex < plotIndexes.length; plotDataIndex++) {
|
|
89
|
+
const [plotIndex, stackItems] = dataByPlots[plotDataIndex];
|
|
90
|
+
const list = Array.from(stackItems);
|
|
91
|
+
for (let i = 0; i < list.length; i++) {
|
|
92
|
+
const [_stackId, seriesStack] = list[i];
|
|
93
|
+
const xValues = getXValues(seriesStack, xAxis, xScale);
|
|
94
|
+
const accumulatedYValues = new Map();
|
|
95
|
+
xValues.forEach(([key]) => {
|
|
96
|
+
accumulatedYValues.set(key, 0);
|
|
97
|
+
});
|
|
98
|
+
const seriesStackData = [];
|
|
99
|
+
for (let j = 0; j < seriesStack.length; j++) {
|
|
100
|
+
const s = seriesStack[j];
|
|
101
|
+
const yAxisIndex = s.yAxis;
|
|
102
|
+
const seriesYAxis = yAxis[yAxisIndex];
|
|
103
|
+
const seriesYScale = yScale[yAxisIndex];
|
|
104
|
+
if (!seriesYScale) {
|
|
105
|
+
continue;
|
|
106
106
|
}
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
});
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
107
|
+
const yAxisTop = ((_a = split.plots[plotIndex]) === null || _a === void 0 ? void 0 : _a.top) || 0;
|
|
108
|
+
const yMin = (_b = getYValue({
|
|
109
|
+
point: { y: 0 },
|
|
110
|
+
points: s.data,
|
|
111
|
+
yAxis: seriesYAxis,
|
|
112
|
+
yScale: seriesYScale,
|
|
113
|
+
})) !== null && _b !== void 0 ? _b : 0;
|
|
114
|
+
const seriesData = s.data.reduce((m, d) => {
|
|
115
|
+
const key = String(xAxis.type === 'category'
|
|
116
|
+
? getDataCategoryValue({
|
|
117
|
+
axisDirection: 'x',
|
|
118
|
+
categories: xAxis.categories || [],
|
|
119
|
+
data: d,
|
|
120
|
+
})
|
|
121
|
+
: d.x);
|
|
122
|
+
return m.set(key, d);
|
|
123
|
+
}, new Map());
|
|
124
|
+
const points = xValues.reduce((pointsAcc, [x, xValue]) => {
|
|
125
|
+
var _a;
|
|
126
|
+
const accumulatedYValue = accumulatedYValues.get(x) || 0;
|
|
127
|
+
const d = (_a = seriesData.get(x)) !== null && _a !== void 0 ? _a : {
|
|
128
|
+
x,
|
|
129
|
+
y: 0,
|
|
130
|
+
};
|
|
131
|
+
const yValue = getYValue({ point: d, yAxis: seriesYAxis, yScale: seriesYScale });
|
|
132
|
+
const yPointValue = yValue === null ? null : yValue - accumulatedYValue;
|
|
133
|
+
if (yPointValue !== null) {
|
|
134
|
+
accumulatedYValues.set(x, yMin - yPointValue);
|
|
122
135
|
}
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
content: l.text,
|
|
139
|
-
size: {
|
|
140
|
-
width: labelSize.maxWidth,
|
|
141
|
-
height: labelSize.maxHeight,
|
|
142
|
-
},
|
|
143
|
-
style,
|
|
144
|
-
};
|
|
145
|
-
}));
|
|
146
|
-
htmlElements.push(...htmlLabels);
|
|
136
|
+
pointsAcc.push({
|
|
137
|
+
y0: yAxisTop + yMin - accumulatedYValue,
|
|
138
|
+
x: xValue,
|
|
139
|
+
y: yPointValue === null ? null : yAxisTop + (yPointValue !== null && yPointValue !== void 0 ? yPointValue : 0),
|
|
140
|
+
data: d,
|
|
141
|
+
series: s,
|
|
142
|
+
});
|
|
143
|
+
return pointsAcc;
|
|
144
|
+
}, []);
|
|
145
|
+
const labels = [];
|
|
146
|
+
const htmlElements = [];
|
|
147
|
+
if (s.dataLabels.enabled) {
|
|
148
|
+
const labelsData = await prepareDataLabels({ series: s, points, xMax, yAxisTop });
|
|
149
|
+
labels.push(...labelsData.svgLabels);
|
|
150
|
+
htmlElements.push(...labelsData.htmlLabels);
|
|
147
151
|
}
|
|
148
|
-
|
|
149
|
-
|
|
152
|
+
let markers = [];
|
|
153
|
+
if (s.marker.states.normal.enabled || s.marker.states.hover.enabled) {
|
|
154
|
+
markers = points.reduce((markersAcc, p) => {
|
|
155
|
+
if (p.y === null) {
|
|
156
|
+
return markersAcc;
|
|
157
|
+
}
|
|
158
|
+
markersAcc.push({
|
|
159
|
+
point: p,
|
|
160
|
+
active: true,
|
|
161
|
+
hovered: false,
|
|
162
|
+
clipped: isOutsideBounds(p.x, p.y),
|
|
163
|
+
});
|
|
164
|
+
return markersAcc;
|
|
165
|
+
}, []);
|
|
150
166
|
}
|
|
167
|
+
seriesStackData.push({
|
|
168
|
+
points,
|
|
169
|
+
markers,
|
|
170
|
+
labels,
|
|
171
|
+
color: s.color,
|
|
172
|
+
opacity: s.opacity,
|
|
173
|
+
width: s.lineWidth,
|
|
174
|
+
series: s,
|
|
175
|
+
hovered: false,
|
|
176
|
+
active: true,
|
|
177
|
+
id: s.id,
|
|
178
|
+
htmlElements,
|
|
179
|
+
});
|
|
151
180
|
}
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
point
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
181
|
+
if (series.some((s) => s.stacking === 'percent')) {
|
|
182
|
+
xValues.forEach(([x], index) => {
|
|
183
|
+
const stackHeight = accumulatedYValues.get(x) || 0;
|
|
184
|
+
let acc = 0;
|
|
185
|
+
const ratio = plotHeight / stackHeight;
|
|
186
|
+
seriesStackData.forEach((item) => {
|
|
187
|
+
const point = item.points[index];
|
|
188
|
+
if (point.y !== null && point.y !== undefined) {
|
|
189
|
+
const height = (point.y0 - point.y) * ratio;
|
|
190
|
+
point.y0 = plotHeight - height - acc;
|
|
191
|
+
point.y = point.y0 + height;
|
|
192
|
+
acc += height;
|
|
193
|
+
}
|
|
163
194
|
});
|
|
164
|
-
return markersAcc;
|
|
165
|
-
}, []);
|
|
166
|
-
}
|
|
167
|
-
seriesStackData.push({
|
|
168
|
-
points,
|
|
169
|
-
markers,
|
|
170
|
-
labels,
|
|
171
|
-
color: s.color,
|
|
172
|
-
opacity: s.opacity,
|
|
173
|
-
width: s.lineWidth,
|
|
174
|
-
series: s,
|
|
175
|
-
hovered: false,
|
|
176
|
-
active: true,
|
|
177
|
-
id: s.id,
|
|
178
|
-
htmlElements,
|
|
179
|
-
});
|
|
180
|
-
}
|
|
181
|
-
if (series.some((s) => s.stacking === 'percent')) {
|
|
182
|
-
xValues.forEach(([x], index) => {
|
|
183
|
-
const stackHeight = accumulatedYValues.get(x) || 0;
|
|
184
|
-
let acc = 0;
|
|
185
|
-
const ratio = plotHeight / stackHeight;
|
|
186
|
-
seriesStackData.forEach((item) => {
|
|
187
|
-
const point = item.points[index];
|
|
188
|
-
if (point.y !== null && point.y !== undefined) {
|
|
189
|
-
const height = (point.y0 - point.y) * ratio;
|
|
190
|
-
point.y0 = plotHeight - height - acc;
|
|
191
|
-
point.y = point.y0 + height;
|
|
192
|
-
acc += height;
|
|
193
|
-
}
|
|
194
195
|
});
|
|
195
|
-
}
|
|
196
|
+
}
|
|
197
|
+
result.push(...seriesStackData);
|
|
196
198
|
}
|
|
197
|
-
result.push(...seriesStackData);
|
|
198
199
|
}
|
|
199
200
|
return result;
|
|
200
201
|
};
|
|
@@ -5,10 +5,10 @@ import type { PreparedBarXData } from './types';
|
|
|
5
5
|
export { prepareBarXData } from './prepare-data';
|
|
6
6
|
export * from './types';
|
|
7
7
|
type Args = {
|
|
8
|
-
|
|
8
|
+
clipPathId: string;
|
|
9
|
+
htmlLayout: HTMLElement | null;
|
|
9
10
|
preparedData: PreparedBarXData[];
|
|
10
11
|
seriesOptions: PreparedSeriesOptions;
|
|
11
|
-
|
|
12
|
-
clipPathId: string;
|
|
12
|
+
dispatcher?: Dispatch<object>;
|
|
13
13
|
};
|
|
14
14
|
export declare const BarXSeriesShapes: (args: Args) => React.JSX.Element;
|
|
@@ -104,9 +104,9 @@ export const BarXSeriesShapes = (args) => {
|
|
|
104
104
|
if (hoveredDataRef.current !== null) {
|
|
105
105
|
handleShapeHover(hoveredDataRef.current);
|
|
106
106
|
}
|
|
107
|
-
dispatcher.on('hover-shape.bar-x', handleShapeHover);
|
|
107
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on('hover-shape.bar-x', handleShapeHover);
|
|
108
108
|
return () => {
|
|
109
|
-
dispatcher.on('hover-shape.bar-x', null);
|
|
109
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on('hover-shape.bar-x', null);
|
|
110
110
|
};
|
|
111
111
|
}, [dispatcher, preparedData, seriesOptions]);
|
|
112
112
|
return (React.createElement(React.Fragment, null,
|
|
@@ -1,13 +1,15 @@
|
|
|
1
|
+
import type { PreparedXAxis, PreparedYAxis } from '../../useAxis/types';
|
|
1
2
|
import type { ChartScale } from '../../useAxisScales';
|
|
2
|
-
import type { PreparedAxis } from '../../useChartOptions/types';
|
|
3
3
|
import type { PreparedBarXSeries, PreparedSeriesOptions } from '../../useSeries/types';
|
|
4
|
+
import type { PreparedSplit } from '../../useSplit/types';
|
|
4
5
|
import type { PreparedBarXData } from './types';
|
|
5
6
|
export declare const prepareBarXData: (args: {
|
|
6
7
|
series: PreparedBarXSeries[];
|
|
7
8
|
seriesOptions: PreparedSeriesOptions;
|
|
8
|
-
xAxis:
|
|
9
|
+
xAxis: PreparedXAxis;
|
|
9
10
|
xScale: ChartScale;
|
|
10
|
-
yAxis:
|
|
11
|
+
yAxis: PreparedYAxis[];
|
|
11
12
|
yScale: (ChartScale | undefined)[];
|
|
12
13
|
boundsHeight: number;
|
|
14
|
+
split: PreparedSplit;
|
|
13
15
|
}) => Promise<PreparedBarXData[]>;
|
|
@@ -33,8 +33,8 @@ async function getLabelData(d) {
|
|
|
33
33
|
}
|
|
34
34
|
// eslint-disable-next-line complexity
|
|
35
35
|
export const prepareBarXData = async (args) => {
|
|
36
|
-
var _a;
|
|
37
|
-
const { series, seriesOptions, xAxis, xScale, yScale, boundsHeight: plotHeight } = args;
|
|
36
|
+
var _a, _b, _c;
|
|
37
|
+
const { series, seriesOptions, xAxis, xScale, yAxis, yScale, boundsHeight: plotHeight, split, } = args;
|
|
38
38
|
const stackGap = seriesOptions['bar-x'].stackGap;
|
|
39
39
|
const categories = get(xAxis, 'categories', []);
|
|
40
40
|
const barMaxWidth = get(seriesOptions, 'bar-x.barMaxWidth');
|
|
@@ -55,8 +55,17 @@ export const prepareBarXData = async (args) => {
|
|
|
55
55
|
}
|
|
56
56
|
}
|
|
57
57
|
})();
|
|
58
|
-
|
|
58
|
+
// series grouped by plotIndex > xValue > data[];
|
|
59
|
+
const dataByPlots = new Map();
|
|
59
60
|
series.forEach((s) => {
|
|
61
|
+
var _a;
|
|
62
|
+
const yAxisIndex = s.yAxis;
|
|
63
|
+
const seriesYAxis = yAxis[yAxisIndex];
|
|
64
|
+
const plotIndex = seriesYAxis.plotIndex;
|
|
65
|
+
if (!dataByPlots.has(plotIndex)) {
|
|
66
|
+
dataByPlots.set(plotIndex, {});
|
|
67
|
+
}
|
|
68
|
+
const data = (_a = dataByPlots.get(plotIndex)) !== null && _a !== void 0 ? _a : {};
|
|
60
69
|
s.data.forEach((d) => {
|
|
61
70
|
if (!isSeriesDataValid(d)) {
|
|
62
71
|
return;
|
|
@@ -96,94 +105,105 @@ export const prepareBarXData = async (args) => {
|
|
|
96
105
|
}
|
|
97
106
|
});
|
|
98
107
|
}
|
|
99
|
-
const maxGroupSize = max(Object.values(data), (d) => Object.values(d).length) || 1;
|
|
100
|
-
const groupGap = Math.max(bandWidth * groupPadding, MIN_BAR_GROUP_GAP);
|
|
101
|
-
const groupWidth = bandWidth - groupGap;
|
|
102
|
-
const rectGap = Math.max(bandWidth * barPadding, MIN_BAR_GAP);
|
|
103
|
-
const rectWidth = Math.max(MIN_BAR_WIDTH, Math.min(groupWidth / maxGroupSize - rectGap, barMaxWidth));
|
|
104
108
|
const result = [];
|
|
105
|
-
const
|
|
106
|
-
for (let
|
|
107
|
-
const
|
|
108
|
-
const
|
|
109
|
-
const
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
const
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
const
|
|
127
|
-
const
|
|
128
|
-
|
|
109
|
+
const plotIndexes = Array.from(dataByPlots.keys());
|
|
110
|
+
for (let plotDataIndex = 0; plotDataIndex < plotIndexes.length; plotDataIndex++) {
|
|
111
|
+
const data = (_a = dataByPlots.get(plotIndexes[plotDataIndex])) !== null && _a !== void 0 ? _a : {};
|
|
112
|
+
const maxGroupSize = max(Object.values(data), (d) => Object.values(d).length) || 1;
|
|
113
|
+
const groupGap = Math.max(bandWidth * groupPadding, MIN_BAR_GROUP_GAP);
|
|
114
|
+
const groupWidth = bandWidth - groupGap;
|
|
115
|
+
const rectGap = Math.max(bandWidth * barPadding, MIN_BAR_GAP);
|
|
116
|
+
const rectWidth = Math.max(MIN_BAR_WIDTH, Math.min(groupWidth / maxGroupSize - rectGap, barMaxWidth));
|
|
117
|
+
const groupedData = Object.entries(data);
|
|
118
|
+
for (let groupedDataIndex = 0; groupedDataIndex < groupedData.length; groupedDataIndex++) {
|
|
119
|
+
const [xValue, val] = groupedData[groupedDataIndex];
|
|
120
|
+
const stacks = Object.values(val);
|
|
121
|
+
const currentGroupWidth = rectWidth * stacks.length + rectGap * (stacks.length - 1);
|
|
122
|
+
for (let groupItemIndex = 0; groupItemIndex < stacks.length; groupItemIndex++) {
|
|
123
|
+
const yValues = stacks[groupItemIndex];
|
|
124
|
+
let stackHeight = 0;
|
|
125
|
+
const stackItems = [];
|
|
126
|
+
const sortedData = sortKey
|
|
127
|
+
? sort(yValues, (a, b) => comparator(get(a, sortKey), get(b, sortKey)))
|
|
128
|
+
: yValues;
|
|
129
|
+
for (let yValueIndex = 0; yValueIndex < sortedData.length; yValueIndex++) {
|
|
130
|
+
const yValue = sortedData[yValueIndex];
|
|
131
|
+
const yAxisIndex = yValue.series.yAxis;
|
|
132
|
+
const seriesYScale = yScale[yAxisIndex];
|
|
133
|
+
if (!seriesYScale) {
|
|
129
134
|
continue;
|
|
130
135
|
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
136
|
+
const seriesYAxis = yAxis[yAxisIndex];
|
|
137
|
+
const yAxisTop = ((_b = split.plots[seriesYAxis.plotIndex]) === null || _b === void 0 ? void 0 : _b.top) || 0;
|
|
138
|
+
let xCenter;
|
|
139
|
+
if (xAxis.type === 'category') {
|
|
140
|
+
const xBandScale = xScale;
|
|
141
|
+
const xBandScaleDomain = xBandScale.domain();
|
|
142
|
+
if (xBandScaleDomain.indexOf(xValue) === -1) {
|
|
143
|
+
continue;
|
|
144
|
+
}
|
|
145
|
+
xCenter = (xBandScale(xValue) || 0) + xBandScale.bandwidth() / 2;
|
|
146
|
+
}
|
|
147
|
+
else {
|
|
148
|
+
const xLinearScale = xScale;
|
|
149
|
+
xCenter = xLinearScale(Number(xValue));
|
|
150
|
+
}
|
|
151
|
+
const x = xCenter - currentGroupWidth / 2 + (rectWidth + rectGap) * groupItemIndex;
|
|
152
|
+
const yDataValue = ((_c = yValue.data.y) !== null && _c !== void 0 ? _c : 0);
|
|
153
|
+
const y = seriesYScale(yDataValue);
|
|
154
|
+
const base = seriesYScale(0);
|
|
155
|
+
const isLastStackItem = yValueIndex === sortedData.length - 1;
|
|
156
|
+
const height = Math.abs(base - y);
|
|
157
|
+
let shapeHeight = height - (stackItems.length ? stackGap : 0);
|
|
158
|
+
if (shapeHeight < 0) {
|
|
159
|
+
shapeHeight = height;
|
|
160
|
+
}
|
|
161
|
+
if (shapeHeight < 0) {
|
|
162
|
+
continue;
|
|
163
|
+
}
|
|
164
|
+
const barData = {
|
|
165
|
+
x,
|
|
166
|
+
y: yAxisTop + (yDataValue > 0 ? y - stackHeight : base),
|
|
167
|
+
width: rectWidth,
|
|
168
|
+
height: shapeHeight,
|
|
169
|
+
opacity: get(yValue.data, 'opacity', null),
|
|
170
|
+
data: yValue.data,
|
|
171
|
+
series: yValue.series,
|
|
172
|
+
htmlElements: [],
|
|
173
|
+
isLastStackItem,
|
|
174
|
+
};
|
|
175
|
+
stackItems.push(barData);
|
|
176
|
+
stackHeight += height;
|
|
149
177
|
}
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
series: yValue.series,
|
|
158
|
-
htmlElements: [],
|
|
159
|
-
isLastStackItem,
|
|
160
|
-
};
|
|
161
|
-
const label = await getLabelData(barData);
|
|
162
|
-
if (yValue.series.dataLabels.html && label) {
|
|
163
|
-
barData.htmlElements.push({
|
|
164
|
-
x: label.x,
|
|
165
|
-
y: label.y,
|
|
166
|
-
content: label.text,
|
|
167
|
-
size: label.size,
|
|
168
|
-
style: label.style,
|
|
178
|
+
if (series.some((s) => s.stacking === 'percent')) {
|
|
179
|
+
let acc = 0;
|
|
180
|
+
const ratio = plotHeight / (stackHeight - stackItems.length);
|
|
181
|
+
stackItems.forEach((item) => {
|
|
182
|
+
item.height = item.height * ratio;
|
|
183
|
+
item.y = plotHeight - item.height - acc;
|
|
184
|
+
acc += item.height + 1;
|
|
169
185
|
});
|
|
170
186
|
}
|
|
171
|
-
|
|
172
|
-
barData.label = await getLabelData(barData);
|
|
173
|
-
}
|
|
174
|
-
stackItems.push(barData);
|
|
175
|
-
stackHeight += height;
|
|
187
|
+
result.push(...stackItems);
|
|
176
188
|
}
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
for (let i = 0; i < result.length; i++) {
|
|
192
|
+
const barData = result[i];
|
|
193
|
+
if (barData.series.dataLabels.enabled) {
|
|
194
|
+
const label = await getLabelData(barData);
|
|
195
|
+
if (barData.series.dataLabels.html && label) {
|
|
196
|
+
barData.htmlElements.push({
|
|
197
|
+
x: label.x,
|
|
198
|
+
y: label.y,
|
|
199
|
+
content: label.text,
|
|
200
|
+
size: label.size,
|
|
201
|
+
style: label.style,
|
|
184
202
|
});
|
|
185
203
|
}
|
|
186
|
-
|
|
204
|
+
else {
|
|
205
|
+
barData.label = label;
|
|
206
|
+
}
|
|
187
207
|
}
|
|
188
208
|
}
|
|
189
209
|
return result;
|
|
@@ -4,10 +4,10 @@ import type { PreparedSeriesOptions } from '../../useSeries/types';
|
|
|
4
4
|
import type { BarYShapesArgs } from './types';
|
|
5
5
|
export { prepareBarYData } from './prepare-data';
|
|
6
6
|
type Args = {
|
|
7
|
-
|
|
7
|
+
clipPathId: string;
|
|
8
|
+
htmlLayout: HTMLElement | null;
|
|
8
9
|
preparedData: BarYShapesArgs;
|
|
9
10
|
seriesOptions: PreparedSeriesOptions;
|
|
10
|
-
|
|
11
|
-
clipPathId: string;
|
|
11
|
+
dispatcher?: Dispatch<object>;
|
|
12
12
|
};
|
|
13
13
|
export declare function BarYSeriesShapes(args: Args): React.JSX.Element;
|
|
@@ -86,9 +86,9 @@ export function BarYSeriesShapes(args) {
|
|
|
86
86
|
if (hoveredDataRef.current !== null) {
|
|
87
87
|
handleShapeHover(hoveredDataRef.current);
|
|
88
88
|
}
|
|
89
|
-
dispatcher.on('hover-shape.bar-y', handleShapeHover);
|
|
89
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on('hover-shape.bar-y', handleShapeHover);
|
|
90
90
|
return () => {
|
|
91
|
-
dispatcher.on('hover-shape.bar-y', null);
|
|
91
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on('hover-shape.bar-y', null);
|
|
92
92
|
};
|
|
93
93
|
}, [dataLabels, dispatcher, preparedData, seriesOptions]);
|
|
94
94
|
return (React.createElement(React.Fragment, null,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import type { PreparedXAxis, PreparedYAxis } from '../../useAxis/types';
|
|
1
2
|
import type { ChartScale } from '../../useAxisScales';
|
|
2
|
-
import type { PreparedAxis } from '../../useChartOptions/types';
|
|
3
3
|
import type { PreparedBarYSeries, PreparedSeriesOptions } from '../../useSeries/types';
|
|
4
4
|
import type { BarYShapesArgs } from './types';
|
|
5
5
|
export declare function prepareBarYData(args: {
|
|
@@ -7,8 +7,8 @@ export declare function prepareBarYData(args: {
|
|
|
7
7
|
boundsWidth: number;
|
|
8
8
|
series: PreparedBarYSeries[];
|
|
9
9
|
seriesOptions: PreparedSeriesOptions;
|
|
10
|
-
xAxis:
|
|
10
|
+
xAxis: PreparedXAxis;
|
|
11
11
|
xScale: ChartScale;
|
|
12
|
-
yAxis:
|
|
12
|
+
yAxis: PreparedYAxis[];
|
|
13
13
|
yScale: (ChartScale | undefined)[];
|
|
14
14
|
}): Promise<BarYShapesArgs>;
|