@gravity-ui/charts 1.46.0 → 1.46.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/ChartInner/useChartInnerProps.js +1 -1
- package/dist/cjs/components/Legend/index.js +13 -14
- package/dist/cjs/components/Tooltip/index.js +22 -1
- package/dist/cjs/core/axes/x-axis.js +1 -1
- package/dist/cjs/core/axes/y-axis.js +1 -1
- package/dist/cjs/core/scales/utils.d.ts +1 -1
- package/dist/cjs/core/scales/utils.js +1 -1
- package/dist/cjs/core/scales/x-scale.js +2 -2
- package/dist/cjs/core/scales/y-scale.js +48 -4
- package/dist/cjs/core/series/prepare-area.js +1 -1
- package/dist/cjs/core/series/prepare-bar-x.js +1 -1
- package/dist/cjs/core/series/prepare-bar-y.js +1 -1
- package/dist/cjs/core/series/prepare-funnel.js +1 -1
- package/dist/cjs/core/series/prepare-heatmap.js +1 -1
- package/dist/cjs/core/series/prepare-legend.js +2 -2
- package/dist/cjs/core/series/prepare-line.js +1 -1
- package/dist/cjs/core/series/prepare-pie.js +1 -1
- package/dist/cjs/core/series/prepare-radar.js +1 -1
- package/dist/cjs/core/series/prepare-sankey.js +1 -1
- package/dist/cjs/core/series/prepare-scatter.js +1 -1
- package/dist/cjs/core/series/prepare-treemap.js +1 -1
- package/dist/cjs/core/series/prepare-waterfall.js +1 -1
- package/dist/cjs/core/series/prepare-x-range.js +1 -1
- package/dist/cjs/core/series/prepareSeries.d.ts +7 -1
- package/dist/cjs/core/series/prepareSeries.js +31 -0
- package/dist/cjs/core/series/types.d.ts +5 -0
- package/dist/cjs/core/series/utils.d.ts +4 -0
- package/dist/cjs/core/series/utils.js +9 -1
- package/dist/cjs/{hooks/useShapes/annotation/index.d.ts → core/shapes/annotation.d.ts} +1 -7
- package/dist/cjs/{hooks/useShapes/annotation/index.js → core/shapes/annotation.js} +2 -2
- package/dist/cjs/{hooks/useShapes → core/shapes}/area/prepare-data.d.ts +4 -4
- package/dist/cjs/{hooks/useShapes → core/shapes}/area/prepare-data.js +4 -4
- package/dist/cjs/core/shapes/area/renderer.d.ts +11 -0
- package/dist/cjs/core/shapes/area/renderer.js +181 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/area/types.d.ts +1 -3
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/bar-x/prepare-data.d.ts +4 -4
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/bar-x/prepare-data.js +6 -6
- package/dist/cjs/core/shapes/bar-x/renderer.d.ts +9 -0
- package/dist/cjs/core/shapes/bar-x/renderer.js +110 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/bar-x/types.d.ts +1 -2
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/bar-y/prepare-data.d.ts +3 -3
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/bar-y/prepare-data.js +3 -3
- package/dist/cjs/core/shapes/bar-y/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/bar-y/renderer.js +80 -0
- package/dist/cjs/{hooks/useShapes → core/shapes}/bar-y/types.d.ts +1 -1
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/bar-y/utils.js +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/funnel/prepare-data.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/funnel/prepare-data.js +1 -1
- package/dist/cjs/core/shapes/funnel/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/funnel/renderer.js +79 -0
- package/dist/cjs/{hooks/useShapes → core/shapes}/funnel/types.d.ts +2 -2
- package/dist/cjs/{hooks/useShapes → core/shapes}/heatmap/prepare-data.d.ts +3 -3
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/heatmap/prepare-data.js +2 -2
- package/dist/cjs/core/shapes/heatmap/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/heatmap/renderer.js +55 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/heatmap/types.d.ts +1 -1
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/line/prepare-data.d.ts +4 -4
- package/dist/cjs/{hooks/useShapes → core/shapes}/line/prepare-data.js +3 -3
- package/dist/cjs/core/shapes/line/renderer.d.ts +11 -0
- package/dist/cjs/core/shapes/line/renderer.js +167 -0
- package/dist/cjs/{hooks/useShapes → core/shapes}/line/types.d.ts +2 -4
- package/dist/cjs/core/shapes/marker.d.ts +45 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/marker.js +2 -2
- package/dist/cjs/{hooks/useShapes → core/shapes}/pie/prepare-data.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/pie/prepare-data.js +3 -3
- package/dist/cjs/core/shapes/pie/renderer.d.ts +8 -0
- package/dist/cjs/core/shapes/pie/renderer.js +160 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/pie/types.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/radar/prepare-data.d.ts +1 -1
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/radar/prepare-data.js +2 -2
- package/dist/cjs/core/shapes/radar/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/radar/renderer.js +126 -0
- package/dist/cjs/{hooks/useShapes → core/shapes}/radar/types.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/sankey/prepare-data.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/sankey/prepare-data.js +1 -1
- package/dist/cjs/core/shapes/sankey/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/sankey/renderer.js +50 -0
- package/dist/cjs/{hooks/useShapes → core/shapes}/sankey/types.d.ts +1 -1
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/scatter/prepare-data.d.ts +3 -3
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/scatter/prepare-data.js +2 -2
- package/dist/cjs/core/shapes/scatter/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/scatter/renderer.js +52 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/scatter/types.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/treemap/prepare-data.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/treemap/prepare-data.js +3 -3
- package/dist/cjs/core/shapes/treemap/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/treemap/renderer.js +88 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/treemap/types.d.ts +1 -1
- package/dist/cjs/core/shapes/utils.d.ts +52 -0
- package/dist/cjs/core/shapes/utils.js +138 -0
- package/dist/cjs/{hooks/useShapes → core/shapes}/waterfall/prepare-data.d.ts +3 -3
- package/dist/cjs/{hooks/useShapes → core/shapes}/waterfall/prepare-data.js +4 -4
- package/dist/cjs/core/shapes/waterfall/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/waterfall/renderer.js +115 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/waterfall/types.d.ts +1 -1
- package/dist/cjs/{hooks/useShapes → core/shapes}/x-range/prepare-data.d.ts +3 -3
- package/dist/cjs/{hooks/useShapes → core/shapes}/x-range/prepare-data.js +4 -4
- package/dist/cjs/core/shapes/x-range/renderer.d.ts +6 -0
- package/dist/cjs/core/shapes/x-range/renderer.js +94 -0
- package/dist/{esm/hooks/useShapes → cjs/core/shapes}/x-range/types.d.ts +1 -1
- package/dist/cjs/core/types/chart/area.d.ts +0 -1
- package/dist/cjs/core/types/chart/axis.d.ts +0 -1
- package/dist/cjs/core/types/chart/base.d.ts +1 -4
- package/dist/cjs/{hooks/utils/get-band-size.js → core/utils/band-size.js} +1 -1
- package/dist/{esm/hooks → cjs/core}/utils/bar-y.d.ts +3 -3
- package/dist/cjs/{hooks → core}/utils/bar-y.js +4 -4
- package/dist/cjs/core/utils/get-closest-data.d.ts +1 -1
- package/dist/cjs/core/utils/series/sorting.js +1 -1
- package/dist/cjs/core/utils/text.d.ts +0 -1
- package/dist/cjs/core/utils/text.js +0 -1
- package/dist/cjs/hooks/index.d.ts +1 -1
- package/dist/cjs/hooks/index.js +1 -1
- package/dist/cjs/hooks/useRangeSlider/types.d.ts +1 -1
- package/dist/cjs/hooks/useRangeSlider/utils.d.ts +1 -1
- package/dist/cjs/hooks/useShapes/area/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/area/index.js +13 -185
- package/dist/cjs/hooks/useShapes/bar-x/index.d.ts +4 -4
- package/dist/cjs/hooks/useShapes/bar-x/index.js +10 -119
- package/dist/cjs/hooks/useShapes/bar-y/index.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/bar-y/index.js +5 -84
- package/dist/cjs/hooks/useShapes/funnel/index.d.ts +4 -4
- package/dist/cjs/hooks/useShapes/funnel/index.js +4 -83
- package/dist/cjs/hooks/useShapes/heatmap/index.d.ts +4 -4
- package/dist/cjs/hooks/useShapes/heatmap/index.js +4 -59
- package/dist/cjs/hooks/useShapes/index.d.ts +14 -15
- package/dist/cjs/hooks/useShapes/index.js +13 -13
- package/dist/cjs/hooks/useShapes/line/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/line/index.js +14 -172
- package/dist/cjs/hooks/useShapes/pie/index.d.ts +3 -5
- package/dist/cjs/hooks/useShapes/pie/index.js +3 -158
- package/dist/cjs/hooks/useShapes/radar/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/radar/index.js +2 -121
- package/dist/cjs/hooks/useShapes/sankey/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/sankey/index.js +2 -51
- package/dist/cjs/hooks/useShapes/scatter/index.d.ts +3 -3
- package/dist/cjs/hooks/useShapes/scatter/index.js +3 -58
- package/dist/cjs/hooks/useShapes/treemap/index.d.ts +2 -2
- package/dist/cjs/hooks/useShapes/treemap/index.js +2 -88
- package/dist/cjs/hooks/useShapes/utils.d.ts +2 -52
- package/dist/cjs/hooks/useShapes/utils.js +3 -140
- package/dist/cjs/hooks/useShapes/waterfall/index.d.ts +4 -4
- package/dist/cjs/hooks/useShapes/waterfall/index.js +6 -119
- package/dist/cjs/hooks/useShapes/x-range/index.d.ts +4 -4
- package/dist/cjs/hooks/useShapes/x-range/index.js +3 -98
- package/dist/cjs/setup-jsdom.js +7 -0
- package/dist/esm/components/ChartInner/useChartInnerProps.js +1 -1
- package/dist/esm/components/Legend/index.js +13 -14
- package/dist/esm/components/Tooltip/index.js +22 -1
- package/dist/esm/core/axes/x-axis.js +1 -1
- package/dist/esm/core/axes/y-axis.js +1 -1
- package/dist/esm/core/scales/utils.d.ts +1 -1
- package/dist/esm/core/scales/utils.js +1 -1
- package/dist/esm/core/scales/x-scale.js +2 -2
- package/dist/esm/core/scales/y-scale.js +48 -4
- package/dist/esm/core/series/prepare-area.js +1 -1
- package/dist/esm/core/series/prepare-bar-x.js +1 -1
- package/dist/esm/core/series/prepare-bar-y.js +1 -1
- package/dist/esm/core/series/prepare-funnel.js +1 -1
- package/dist/esm/core/series/prepare-heatmap.js +1 -1
- package/dist/esm/core/series/prepare-legend.js +2 -2
- package/dist/esm/core/series/prepare-line.js +1 -1
- package/dist/esm/core/series/prepare-pie.js +1 -1
- package/dist/esm/core/series/prepare-radar.js +1 -1
- package/dist/esm/core/series/prepare-sankey.js +1 -1
- package/dist/esm/core/series/prepare-scatter.js +1 -1
- package/dist/esm/core/series/prepare-treemap.js +1 -1
- package/dist/esm/core/series/prepare-waterfall.js +1 -1
- package/dist/esm/core/series/prepare-x-range.js +1 -1
- package/dist/esm/core/series/prepareSeries.d.ts +7 -1
- package/dist/esm/core/series/prepareSeries.js +31 -0
- package/dist/esm/core/series/types.d.ts +5 -0
- package/dist/esm/core/series/utils.d.ts +4 -0
- package/dist/esm/core/series/utils.js +9 -1
- package/dist/esm/{hooks/useShapes/annotation/index.d.ts → core/shapes/annotation.d.ts} +1 -7
- package/dist/esm/{hooks/useShapes/annotation/index.js → core/shapes/annotation.js} +2 -2
- package/dist/esm/{hooks/useShapes → core/shapes}/area/prepare-data.d.ts +4 -4
- package/dist/esm/{hooks/useShapes → core/shapes}/area/prepare-data.js +4 -4
- package/dist/esm/core/shapes/area/renderer.d.ts +11 -0
- package/dist/esm/core/shapes/area/renderer.js +181 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/area/types.d.ts +1 -3
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/bar-x/prepare-data.d.ts +4 -4
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/bar-x/prepare-data.js +6 -6
- package/dist/esm/core/shapes/bar-x/renderer.d.ts +9 -0
- package/dist/esm/core/shapes/bar-x/renderer.js +110 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/bar-x/types.d.ts +1 -2
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/bar-y/prepare-data.d.ts +3 -3
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/bar-y/prepare-data.js +3 -3
- package/dist/esm/core/shapes/bar-y/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/bar-y/renderer.js +80 -0
- package/dist/esm/{hooks/useShapes → core/shapes}/bar-y/types.d.ts +1 -1
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/bar-y/utils.js +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/funnel/prepare-data.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/funnel/prepare-data.js +1 -1
- package/dist/esm/core/shapes/funnel/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/funnel/renderer.js +79 -0
- package/dist/esm/{hooks/useShapes → core/shapes}/funnel/types.d.ts +2 -2
- package/dist/esm/{hooks/useShapes → core/shapes}/heatmap/prepare-data.d.ts +3 -3
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/heatmap/prepare-data.js +2 -2
- package/dist/esm/core/shapes/heatmap/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/heatmap/renderer.js +55 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/heatmap/types.d.ts +1 -1
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/line/prepare-data.d.ts +4 -4
- package/dist/esm/{hooks/useShapes → core/shapes}/line/prepare-data.js +3 -3
- package/dist/esm/core/shapes/line/renderer.d.ts +11 -0
- package/dist/esm/core/shapes/line/renderer.js +167 -0
- package/dist/esm/{hooks/useShapes → core/shapes}/line/types.d.ts +2 -4
- package/dist/esm/core/shapes/marker.d.ts +45 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/marker.js +2 -2
- package/dist/esm/{hooks/useShapes → core/shapes}/pie/prepare-data.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/pie/prepare-data.js +3 -3
- package/dist/esm/core/shapes/pie/renderer.d.ts +8 -0
- package/dist/esm/core/shapes/pie/renderer.js +160 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/pie/types.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/radar/prepare-data.d.ts +1 -1
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/radar/prepare-data.js +2 -2
- package/dist/esm/core/shapes/radar/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/radar/renderer.js +126 -0
- package/dist/esm/{hooks/useShapes → core/shapes}/radar/types.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/sankey/prepare-data.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/sankey/prepare-data.js +1 -1
- package/dist/esm/core/shapes/sankey/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/sankey/renderer.js +50 -0
- package/dist/esm/{hooks/useShapes → core/shapes}/sankey/types.d.ts +1 -1
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/scatter/prepare-data.d.ts +3 -3
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/scatter/prepare-data.js +2 -2
- package/dist/esm/core/shapes/scatter/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/scatter/renderer.js +52 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/scatter/types.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/treemap/prepare-data.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/treemap/prepare-data.js +3 -3
- package/dist/esm/core/shapes/treemap/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/treemap/renderer.js +88 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/treemap/types.d.ts +1 -1
- package/dist/esm/core/shapes/utils.d.ts +52 -0
- package/dist/esm/core/shapes/utils.js +138 -0
- package/dist/esm/{hooks/useShapes → core/shapes}/waterfall/prepare-data.d.ts +3 -3
- package/dist/esm/{hooks/useShapes → core/shapes}/waterfall/prepare-data.js +4 -4
- package/dist/esm/core/shapes/waterfall/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/waterfall/renderer.js +115 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/waterfall/types.d.ts +1 -1
- package/dist/esm/{hooks/useShapes → core/shapes}/x-range/prepare-data.d.ts +3 -3
- package/dist/esm/{hooks/useShapes → core/shapes}/x-range/prepare-data.js +4 -4
- package/dist/esm/core/shapes/x-range/renderer.d.ts +6 -0
- package/dist/esm/core/shapes/x-range/renderer.js +94 -0
- package/dist/{cjs/hooks/useShapes → esm/core/shapes}/x-range/types.d.ts +1 -1
- package/dist/esm/core/types/chart/area.d.ts +0 -1
- package/dist/esm/core/types/chart/axis.d.ts +0 -1
- package/dist/esm/core/types/chart/base.d.ts +1 -4
- package/dist/esm/{hooks/utils/get-band-size.js → core/utils/band-size.js} +1 -1
- package/dist/{cjs/hooks → esm/core}/utils/bar-y.d.ts +3 -3
- package/dist/esm/{hooks → core}/utils/bar-y.js +4 -4
- package/dist/esm/core/utils/get-closest-data.d.ts +1 -1
- package/dist/esm/core/utils/series/sorting.js +1 -1
- package/dist/esm/core/utils/text.d.ts +0 -1
- package/dist/esm/core/utils/text.js +0 -1
- package/dist/esm/hooks/index.d.ts +1 -1
- package/dist/esm/hooks/index.js +1 -1
- package/dist/esm/hooks/useRangeSlider/types.d.ts +1 -1
- package/dist/esm/hooks/useRangeSlider/utils.d.ts +1 -1
- package/dist/esm/hooks/useShapes/area/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/area/index.js +13 -185
- package/dist/esm/hooks/useShapes/bar-x/index.d.ts +4 -4
- package/dist/esm/hooks/useShapes/bar-x/index.js +10 -119
- package/dist/esm/hooks/useShapes/bar-y/index.d.ts +3 -3
- package/dist/esm/hooks/useShapes/bar-y/index.js +5 -84
- package/dist/esm/hooks/useShapes/funnel/index.d.ts +4 -4
- package/dist/esm/hooks/useShapes/funnel/index.js +4 -83
- package/dist/esm/hooks/useShapes/heatmap/index.d.ts +4 -4
- package/dist/esm/hooks/useShapes/heatmap/index.js +4 -59
- package/dist/esm/hooks/useShapes/index.d.ts +14 -15
- package/dist/esm/hooks/useShapes/index.js +13 -13
- package/dist/esm/hooks/useShapes/line/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/line/index.js +14 -172
- package/dist/esm/hooks/useShapes/pie/index.d.ts +3 -5
- package/dist/esm/hooks/useShapes/pie/index.js +3 -158
- package/dist/esm/hooks/useShapes/radar/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/radar/index.js +2 -121
- package/dist/esm/hooks/useShapes/sankey/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/sankey/index.js +2 -51
- package/dist/esm/hooks/useShapes/scatter/index.d.ts +3 -3
- package/dist/esm/hooks/useShapes/scatter/index.js +3 -58
- package/dist/esm/hooks/useShapes/treemap/index.d.ts +2 -2
- package/dist/esm/hooks/useShapes/treemap/index.js +2 -88
- package/dist/esm/hooks/useShapes/utils.d.ts +2 -52
- package/dist/esm/hooks/useShapes/utils.js +3 -140
- package/dist/esm/hooks/useShapes/waterfall/index.d.ts +4 -4
- package/dist/esm/hooks/useShapes/waterfall/index.js +6 -119
- package/dist/esm/hooks/useShapes/x-range/index.d.ts +4 -4
- package/dist/esm/hooks/useShapes/x-range/index.js +3 -98
- package/dist/esm/setup-jsdom.js +7 -0
- package/package.json +5 -2
- package/dist/cjs/hooks/useSeries/index.d.ts +0 -12
- package/dist/cjs/hooks/useSeries/index.js +0 -40
- package/dist/cjs/hooks/useSeries/types.d.ts +0 -1
- package/dist/cjs/hooks/useSeries/types.js +0 -1
- package/dist/cjs/hooks/useSeries/utils.d.ts +0 -1
- package/dist/cjs/hooks/useSeries/utils.js +0 -1
- package/dist/cjs/hooks/useShapes/marker.d.ts +0 -15
- package/dist/cjs/hooks/utils/index.d.ts +0 -1
- package/dist/cjs/hooks/utils/index.js +0 -1
- package/dist/esm/hooks/useSeries/index.d.ts +0 -12
- package/dist/esm/hooks/useSeries/index.js +0 -40
- package/dist/esm/hooks/useSeries/types.d.ts +0 -1
- package/dist/esm/hooks/useSeries/types.js +0 -1
- package/dist/esm/hooks/useSeries/utils.d.ts +0 -1
- package/dist/esm/hooks/useSeries/utils.js +0 -1
- package/dist/esm/hooks/useShapes/marker.d.ts +0 -15
- package/dist/esm/hooks/utils/index.d.ts +0 -1
- package/dist/esm/hooks/utils/index.js +0 -1
- /package/dist/cjs/{hooks/useShapes → core/shapes}/area/types.js +0 -0
- /package/dist/cjs/{hooks/constants.d.ts → core/shapes/bar-constants.d.ts} +0 -0
- /package/dist/cjs/{hooks/constants.js → core/shapes/bar-constants.js} +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/bar-x/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/bar-y/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/bar-y/utils.d.ts +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/funnel/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/heatmap/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/line/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/pie/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/pie/utils.d.ts +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/pie/utils.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/radar/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/sankey/sankey-layout.d.ts +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/sankey/sankey-layout.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/sankey/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/scatter/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/treemap/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/waterfall/types.js +0 -0
- /package/dist/cjs/{hooks/useShapes → core/shapes}/x-range/types.js +0 -0
- /package/dist/cjs/{hooks/utils/get-band-size.d.ts → core/utils/band-size.d.ts} +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/area/types.js +0 -0
- /package/dist/esm/{hooks/constants.d.ts → core/shapes/bar-constants.d.ts} +0 -0
- /package/dist/esm/{hooks/constants.js → core/shapes/bar-constants.js} +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/bar-x/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/bar-y/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/bar-y/utils.d.ts +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/funnel/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/heatmap/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/line/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/pie/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/pie/utils.d.ts +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/pie/utils.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/radar/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/sankey/sankey-layout.d.ts +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/sankey/sankey-layout.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/sankey/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/scatter/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/treemap/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/waterfall/types.js +0 -0
- /package/dist/esm/{hooks/useShapes → core/shapes}/x-range/types.js +0 -0
- /package/dist/esm/{hooks/utils/get-band-size.d.ts → core/utils/band-size.d.ts} +0 -0
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { color } from 'd3-color';
|
|
2
|
+
import { select } from 'd3-selection';
|
|
3
|
+
import { block } from '../../../utils';
|
|
4
|
+
const b = block('heatmap');
|
|
5
|
+
export function renderHeatmap(elements, preparedData, seriesOptions, dispatcher) {
|
|
6
|
+
var _a, _b;
|
|
7
|
+
const svgElement = select(elements.plot);
|
|
8
|
+
const hoverOptions = (_b = (_a = seriesOptions.heatmap) === null || _a === void 0 ? void 0 : _a.states) === null || _b === void 0 ? void 0 : _b.hover;
|
|
9
|
+
svgElement.selectAll('*').remove();
|
|
10
|
+
// heatmap cells
|
|
11
|
+
const cellsSelection = svgElement
|
|
12
|
+
.selectAll('rect')
|
|
13
|
+
.data(preparedData.items)
|
|
14
|
+
.join('rect')
|
|
15
|
+
.attr('x', (d) => d.x)
|
|
16
|
+
.attr('y', (d) => d.y)
|
|
17
|
+
.attr('height', (d) => d.height)
|
|
18
|
+
.attr('width', (d) => d.width)
|
|
19
|
+
.attr('fill', (d) => d.color)
|
|
20
|
+
.attr('stroke', (d) => d.borderColor)
|
|
21
|
+
.attr('stroke-width', (d) => d.borderWidth);
|
|
22
|
+
// dataLabels
|
|
23
|
+
svgElement
|
|
24
|
+
.selectAll('text')
|
|
25
|
+
.data(preparedData.labels)
|
|
26
|
+
.join('text')
|
|
27
|
+
.html((d) => d.text)
|
|
28
|
+
.attr('class', b('label'))
|
|
29
|
+
.attr('x', (d) => d.x)
|
|
30
|
+
.attr('y', (d) => d.y)
|
|
31
|
+
.style('font-size', (d) => d.style.fontSize)
|
|
32
|
+
.style('font-weight', (d) => d.style.fontWeight || null)
|
|
33
|
+
.style('fill', (d) => d.style.fontColor || null);
|
|
34
|
+
function handleShapeHover(data) {
|
|
35
|
+
const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
|
|
36
|
+
if (hoverEnabled) {
|
|
37
|
+
const hovered = data === null || data === void 0 ? void 0 : data.reduce((acc, d) => {
|
|
38
|
+
acc.add(d.data);
|
|
39
|
+
return acc;
|
|
40
|
+
}, new Set());
|
|
41
|
+
cellsSelection.attr('fill', (d) => {
|
|
42
|
+
var _a;
|
|
43
|
+
const fillColor = d.color;
|
|
44
|
+
if (hovered === null || hovered === void 0 ? void 0 : hovered.has(d.data)) {
|
|
45
|
+
return (((_a = color(fillColor)) === null || _a === void 0 ? void 0 : _a.brighter(hoverOptions.brightness).toString()) || fillColor);
|
|
46
|
+
}
|
|
47
|
+
return fillColor;
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on('hover-shape.heatmap', handleShapeHover);
|
|
52
|
+
return () => {
|
|
53
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on('hover-shape.heatmap', null);
|
|
54
|
+
};
|
|
55
|
+
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { BaseTextStyle, HeatmapSeriesData, HtmlItem } from '../../../types';
|
|
2
|
-
import type { PreparedHeatmapSeries } from '../../
|
|
2
|
+
import type { PreparedHeatmapSeries } from '../../series/types';
|
|
3
3
|
export type HeatmapItem = {
|
|
4
4
|
x: number;
|
|
5
5
|
y: number;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import type { PreparedSplit } from '../../../core/layout/split-types';
|
|
2
|
-
import type { ChartScale } from '../../../core/scales/types';
|
|
3
1
|
import type { ShapeDataWithLabels } from '../../../types';
|
|
4
|
-
import type { PreparedXAxis, PreparedYAxis } from '../../
|
|
5
|
-
import type {
|
|
2
|
+
import type { PreparedXAxis, PreparedYAxis } from '../../axes/types';
|
|
3
|
+
import type { PreparedSplit } from '../../layout/split-types';
|
|
4
|
+
import type { ChartScale } from '../../scales/types';
|
|
5
|
+
import type { PreparedLineSeries, PreparedSeriesOptions } from '../../series/types';
|
|
6
6
|
import type { PreparedLineData } from './types';
|
|
7
7
|
export declare const prepareLineData: (args: {
|
|
8
8
|
series: PreparedLineSeries[];
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { prepareAnnotation } from '
|
|
2
|
-
import { filterOverlappingLabels, getLabelsSize, getTextSizeFn } from '
|
|
3
|
-
import { getFormattedValue } from '
|
|
1
|
+
import { prepareAnnotation } from '../../series/prepare-annotation';
|
|
2
|
+
import { filterOverlappingLabels, getLabelsSize, getTextSizeFn } from '../../utils';
|
|
3
|
+
import { getFormattedValue } from '../../utils/format';
|
|
4
4
|
import { getXValue, getYValue } from '../utils';
|
|
5
5
|
async function getHtmlLabel(point, series, xMax) {
|
|
6
6
|
var _a;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Dispatch } from 'd3-dispatch';
|
|
2
|
+
import type { PreparedSeriesOptions } from '../../series/types';
|
|
3
|
+
import type { PreparedLineData } from './types';
|
|
4
|
+
export declare function renderLine(elements: {
|
|
5
|
+
plot: SVGGElement;
|
|
6
|
+
markers: SVGGElement;
|
|
7
|
+
hoverMarkers: SVGGElement;
|
|
8
|
+
annotations: SVGGElement;
|
|
9
|
+
boundsWidth: number;
|
|
10
|
+
boundsHeight: number;
|
|
11
|
+
}, preparedData: PreparedLineData[], seriesOptions: PreparedSeriesOptions, dispatcher?: Dispatch<object>): () => void;
|
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
import { color } from 'd3-color';
|
|
2
|
+
import { select } from 'd3-selection';
|
|
3
|
+
import { line as lineGenerator } from 'd3-shape';
|
|
4
|
+
import get from 'lodash/get';
|
|
5
|
+
import { block } from '../../../utils';
|
|
6
|
+
import { getLineDashArray } from '../../utils';
|
|
7
|
+
import { renderAnnotations } from '../annotation';
|
|
8
|
+
import { getMarkerHaloVisibility, getMarkerVisibility, renderMarker, selectMarkerHalo, selectMarkerSymbol, setMarker, } from '../marker';
|
|
9
|
+
import { setActiveState } from '../utils';
|
|
10
|
+
const b = block('line');
|
|
11
|
+
export function renderLine(elements, preparedData, seriesOptions, dispatcher) {
|
|
12
|
+
var _a, _b;
|
|
13
|
+
const plotSvgElement = select(elements.plot);
|
|
14
|
+
const markersSvgElement = select(elements.markers);
|
|
15
|
+
const hoverMarkersSvgElement = select(elements.hoverMarkers);
|
|
16
|
+
const annotationsSvgElement = select(elements.annotations);
|
|
17
|
+
const hoverOptions = get(seriesOptions, 'line.states.hover');
|
|
18
|
+
const inactiveOptions = get(seriesOptions, 'line.states.inactive');
|
|
19
|
+
const line = lineGenerator()
|
|
20
|
+
.defined((d) => d.y !== null && d.x !== null)
|
|
21
|
+
.x((d) => d.x)
|
|
22
|
+
.y((d) => d.y);
|
|
23
|
+
plotSvgElement.selectAll('*').remove();
|
|
24
|
+
markersSvgElement.selectAll('*').remove();
|
|
25
|
+
const lineSelection = plotSvgElement
|
|
26
|
+
.selectAll('path')
|
|
27
|
+
.data(preparedData)
|
|
28
|
+
.join('path')
|
|
29
|
+
.attr('d', (d) => line(d.points))
|
|
30
|
+
.attr('fill', 'none')
|
|
31
|
+
.attr('stroke', (d) => d.color)
|
|
32
|
+
.attr('stroke-width', (d) => d.lineWidth)
|
|
33
|
+
.attr('stroke-linejoin', (d) => d.linejoin)
|
|
34
|
+
.attr('stroke-linecap', (d) => d.linecap)
|
|
35
|
+
.attr('stroke-dasharray', (d) => getLineDashArray(d.dashStyle, d.lineWidth))
|
|
36
|
+
.attr('opacity', (d) => d.opacity)
|
|
37
|
+
.attr('cursor', (d) => d.series.cursor);
|
|
38
|
+
const dataLabels = preparedData.reduce((acc, d) => {
|
|
39
|
+
return acc.concat(d.svgLabels);
|
|
40
|
+
}, []);
|
|
41
|
+
const labelsSelection = plotSvgElement
|
|
42
|
+
.selectAll('text')
|
|
43
|
+
.data(dataLabels)
|
|
44
|
+
.join('text')
|
|
45
|
+
.html((d) => d.text)
|
|
46
|
+
.attr('class', b('label'))
|
|
47
|
+
.attr('x', (d) => d.x)
|
|
48
|
+
.attr('y', (d) => d.y)
|
|
49
|
+
.attr('text-anchor', (d) => d.textAnchor)
|
|
50
|
+
.style('font-size', (d) => d.style.fontSize)
|
|
51
|
+
.style('font-weight', (d) => d.style.fontWeight || null)
|
|
52
|
+
.style('fill', (d) => d.style.fontColor || null);
|
|
53
|
+
const markers = preparedData.reduce((acc, d) => acc.concat(d.markers), []);
|
|
54
|
+
const markerSelection = markersSvgElement
|
|
55
|
+
.selectAll('marker')
|
|
56
|
+
.data(markers)
|
|
57
|
+
.join('g')
|
|
58
|
+
.call(renderMarker);
|
|
59
|
+
renderAnnotations({
|
|
60
|
+
anchors: preparedData.flatMap((d) => d.annotations),
|
|
61
|
+
container: annotationsSvgElement,
|
|
62
|
+
plotHeight: elements.boundsHeight,
|
|
63
|
+
plotWidth: elements.boundsWidth,
|
|
64
|
+
});
|
|
65
|
+
const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
|
|
66
|
+
const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;
|
|
67
|
+
function handleShapeHover(data) {
|
|
68
|
+
const selected = (data === null || data === void 0 ? void 0 : data.filter((d) => d.series.type === 'line')) || [];
|
|
69
|
+
const selectedDataItems = selected.map((d) => d.data);
|
|
70
|
+
const selectedSeriesIds = selected.map((d) => { var _a; return (_a = d.series) === null || _a === void 0 ? void 0 : _a.id; });
|
|
71
|
+
lineSelection.datum((d, index, list) => {
|
|
72
|
+
const elementSelection = select(list[index]);
|
|
73
|
+
const hovered = Boolean(hoverEnabled && selectedSeriesIds.includes(d.id));
|
|
74
|
+
if (d.hovered !== hovered) {
|
|
75
|
+
d.hovered = hovered;
|
|
76
|
+
elementSelection.attr('stroke', (dSelection) => {
|
|
77
|
+
var _a;
|
|
78
|
+
const initialColor = dSelection.color || '';
|
|
79
|
+
if (dSelection.hovered) {
|
|
80
|
+
return (((_a = color(initialColor)) === null || _a === void 0 ? void 0 : _a.brighter(hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.brightness).toString()) ||
|
|
81
|
+
initialColor);
|
|
82
|
+
}
|
|
83
|
+
return initialColor;
|
|
84
|
+
});
|
|
85
|
+
}
|
|
86
|
+
return setActiveState({
|
|
87
|
+
element: list[index],
|
|
88
|
+
state: inactiveOptions,
|
|
89
|
+
active: Boolean(!inactiveEnabled ||
|
|
90
|
+
!selectedSeriesIds.length ||
|
|
91
|
+
selectedSeriesIds.includes(d.id)),
|
|
92
|
+
datum: d,
|
|
93
|
+
});
|
|
94
|
+
});
|
|
95
|
+
labelsSelection.datum((d, index, list) => {
|
|
96
|
+
return setActiveState({
|
|
97
|
+
element: list[index],
|
|
98
|
+
state: inactiveOptions,
|
|
99
|
+
active: Boolean(!inactiveEnabled ||
|
|
100
|
+
!selectedSeriesIds.length ||
|
|
101
|
+
selectedSeriesIds.includes(d.series.id)),
|
|
102
|
+
datum: d,
|
|
103
|
+
});
|
|
104
|
+
});
|
|
105
|
+
markerSelection.datum((d, index, list) => {
|
|
106
|
+
const elementSelection = select(list[index]);
|
|
107
|
+
const hovered = Boolean(hoverEnabled && selectedDataItems.includes(d.point.data));
|
|
108
|
+
if (d.hovered !== hovered) {
|
|
109
|
+
d.hovered = hovered;
|
|
110
|
+
elementSelection.attr('visibility', getMarkerVisibility(d));
|
|
111
|
+
selectMarkerHalo(elementSelection).attr('visibility', getMarkerHaloVisibility);
|
|
112
|
+
selectMarkerSymbol(elementSelection).call(setMarker, hovered ? 'hover' : 'normal');
|
|
113
|
+
}
|
|
114
|
+
if (d.point.series.marker.states.normal.enabled) {
|
|
115
|
+
const isActive = Boolean(!inactiveEnabled ||
|
|
116
|
+
!selectedSeriesIds.length ||
|
|
117
|
+
selectedSeriesIds.includes(d.point.series.id));
|
|
118
|
+
setActiveState({
|
|
119
|
+
element: list[index],
|
|
120
|
+
state: inactiveOptions,
|
|
121
|
+
active: isActive,
|
|
122
|
+
datum: d,
|
|
123
|
+
});
|
|
124
|
+
}
|
|
125
|
+
return d;
|
|
126
|
+
});
|
|
127
|
+
hoverMarkersSvgElement.selectAll('*').remove();
|
|
128
|
+
if (hoverEnabled && selected.length > 0) {
|
|
129
|
+
const hoverOnlyMarkers = [];
|
|
130
|
+
for (const chunk of selected) {
|
|
131
|
+
const seriesData = preparedData.find((pd) => pd.id === chunk.series.id);
|
|
132
|
+
if (!seriesData) {
|
|
133
|
+
continue;
|
|
134
|
+
}
|
|
135
|
+
const { series } = seriesData;
|
|
136
|
+
if (series.marker.states.normal.enabled || !series.marker.states.hover.enabled) {
|
|
137
|
+
continue;
|
|
138
|
+
}
|
|
139
|
+
const point = seriesData.points.find((p) => p.data === chunk.data);
|
|
140
|
+
if (!point || point.x === null || point.y === null) {
|
|
141
|
+
continue;
|
|
142
|
+
}
|
|
143
|
+
hoverOnlyMarkers.push({
|
|
144
|
+
point: point,
|
|
145
|
+
active: true,
|
|
146
|
+
hovered: true,
|
|
147
|
+
clipped: false,
|
|
148
|
+
});
|
|
149
|
+
}
|
|
150
|
+
if (hoverOnlyMarkers.length > 0) {
|
|
151
|
+
hoverMarkersSvgElement
|
|
152
|
+
.selectAll('g')
|
|
153
|
+
.data(hoverOnlyMarkers)
|
|
154
|
+
.join('g')
|
|
155
|
+
.call(renderMarker)
|
|
156
|
+
.each((_d, i, nodes) => {
|
|
157
|
+
selectMarkerSymbol(select(nodes[i])).call(setMarker, 'hover');
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
const eventName = `hover-shape.line-${(_b = (_a = preparedData[0]) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : 'unknown'}`;
|
|
163
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on(eventName, handleShapeHover);
|
|
164
|
+
return () => {
|
|
165
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on(eventName, null);
|
|
166
|
+
};
|
|
167
|
+
}
|
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
import type { DashStyle, LineCap, LineJoin } from '../../../core/constants';
|
|
2
|
-
import type { PreparedAnnotation } from '../../../core/series/types';
|
|
3
1
|
import type { HtmlItem, LabelData, LineSeriesData, LineSeriesLineBaseStyle } from '../../../types';
|
|
4
|
-
import type {
|
|
5
|
-
import type { AnnotationAnchor } from '
|
|
2
|
+
import type { DashStyle, LineCap, LineJoin } from '../../constants';
|
|
3
|
+
import type { AnnotationAnchor, PreparedAnnotation, PreparedLineSeries } from '../../series/types';
|
|
6
4
|
export type PointData = {
|
|
7
5
|
x: number | null;
|
|
8
6
|
y: number | null;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import type { BaseType, Selection } from 'd3-selection';
|
|
2
|
+
import { SymbolType } from '../constants';
|
|
3
|
+
export interface BaseMarkerData {
|
|
4
|
+
point: {
|
|
5
|
+
x: number;
|
|
6
|
+
y: number;
|
|
7
|
+
color?: string;
|
|
8
|
+
data: unknown;
|
|
9
|
+
series: {
|
|
10
|
+
color: string;
|
|
11
|
+
marker: {
|
|
12
|
+
states: {
|
|
13
|
+
normal: {
|
|
14
|
+
symbol: `${SymbolType}`;
|
|
15
|
+
enabled: boolean;
|
|
16
|
+
radius: number;
|
|
17
|
+
borderWidth: number;
|
|
18
|
+
borderColor: string;
|
|
19
|
+
};
|
|
20
|
+
hover: {
|
|
21
|
+
enabled: boolean;
|
|
22
|
+
radius: number;
|
|
23
|
+
borderWidth: number;
|
|
24
|
+
borderColor: string;
|
|
25
|
+
halo: {
|
|
26
|
+
enabled: boolean;
|
|
27
|
+
size: number;
|
|
28
|
+
opacity: number;
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
};
|
|
35
|
+
active: boolean;
|
|
36
|
+
hovered: boolean;
|
|
37
|
+
clipped?: boolean;
|
|
38
|
+
}
|
|
39
|
+
export declare function renderMarker<T extends BaseMarkerData>(selection: Selection<BaseType, T, BaseType, unknown>): Selection<BaseType, T, BaseType, unknown>;
|
|
40
|
+
export declare function getMarkerVisibility(d: BaseMarkerData): "" | "hidden";
|
|
41
|
+
export declare function getMarkerHaloVisibility(d: BaseMarkerData): "" | "hidden";
|
|
42
|
+
export declare function setMarker<T extends BaseType, D extends BaseMarkerData>(selection: Selection<T, D, BaseType | null, unknown>, state: 'normal' | 'hover'): void;
|
|
43
|
+
export declare function getMarkerSymbol(type: `${SymbolType}` | undefined, radius: number): string | null;
|
|
44
|
+
export declare function selectMarkerHalo<T>(parentSelection: Selection<BaseType, T, null, undefined>): Selection<BaseType, T, null, undefined>;
|
|
45
|
+
export declare function selectMarkerSymbol<T>(parentSelection: Selection<BaseType, T, null, undefined>): Selection<BaseType, T, null, undefined>;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { symbol } from 'd3-shape';
|
|
2
2
|
import get from 'lodash/get';
|
|
3
|
-
import { SymbolType } from '../../core/constants';
|
|
4
|
-
import { getSymbol } from '../../core/utils';
|
|
5
3
|
import { block } from '../../utils';
|
|
4
|
+
import { SymbolType } from '../constants';
|
|
5
|
+
import { getSymbol } from '../utils';
|
|
6
6
|
const b = block('marker');
|
|
7
7
|
const haloClassName = b('halo');
|
|
8
8
|
const symbolClassName = b('symbol');
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { group, max } from 'd3-array';
|
|
2
2
|
import { arc, line as lineGenerator } from 'd3-shape';
|
|
3
3
|
import merge from 'lodash/merge';
|
|
4
|
-
import { DEFAULT_DATALABELS_STYLE } from '
|
|
5
|
-
import { calculateNumericProperty, getLabelsSize, getLeftPosition, getTextSizeFn, isLabelsOverlapping, } from '
|
|
6
|
-
import { getFormattedValue } from '
|
|
4
|
+
import { DEFAULT_DATALABELS_STYLE } from '../../constants';
|
|
5
|
+
import { calculateNumericProperty, getLabelsSize, getLeftPosition, getTextSizeFn, isLabelsOverlapping, } from '../../utils';
|
|
6
|
+
import { getFormattedValue } from '../../utils/format';
|
|
7
7
|
import { getCurveFactory, getInscribedAngle, pieGenerator } from './utils';
|
|
8
8
|
const FULL_CIRCLE = Math.PI * 2;
|
|
9
9
|
const getCenter = (boundsWidth, boundsHeight, center) => {
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { Dispatch } from 'd3-dispatch';
|
|
2
|
+
import type { PieArcDatum } from 'd3-shape';
|
|
3
|
+
import type { PreparedSeriesOptions } from '../../series/types';
|
|
4
|
+
import type { PreparedPieData, SegmentData } from './types';
|
|
5
|
+
export declare function getHaloVisibility(d: PieArcDatum<SegmentData>): "" | "hidden";
|
|
6
|
+
export declare function renderPie(elements: {
|
|
7
|
+
plot: SVGGElement;
|
|
8
|
+
}, preparedData: PreparedPieData[], seriesOptions: PreparedSeriesOptions, dispatcher?: Dispatch<object>): () => void;
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
import { color } from 'd3-color';
|
|
2
|
+
import { select } from 'd3-selection';
|
|
3
|
+
import { arc } from 'd3-shape';
|
|
4
|
+
import get from 'lodash/get';
|
|
5
|
+
import { block } from '../../../utils';
|
|
6
|
+
import { setActiveState } from '../../shapes/utils';
|
|
7
|
+
import { setEllipsisForOverflowTexts } from '../../utils';
|
|
8
|
+
const b = block('pie');
|
|
9
|
+
export function getHaloVisibility(d) {
|
|
10
|
+
const enabled = d.data.pie.halo.enabled && d.data.hovered;
|
|
11
|
+
return enabled ? '' : 'hidden';
|
|
12
|
+
}
|
|
13
|
+
export function renderPie(elements, preparedData, seriesOptions, dispatcher) {
|
|
14
|
+
const svgElement = select(elements.plot);
|
|
15
|
+
svgElement.selectAll('*').remove();
|
|
16
|
+
const segmentSelector = `.${b('segment')}`;
|
|
17
|
+
const connectorSelector = `.${b('connector')}`;
|
|
18
|
+
const shapesSelection = svgElement
|
|
19
|
+
.selectAll('pie')
|
|
20
|
+
.data(preparedData)
|
|
21
|
+
.join('g')
|
|
22
|
+
.attr('id', (pieData) => pieData.id)
|
|
23
|
+
.attr('class', b('item'))
|
|
24
|
+
.attr('transform', (pieData) => {
|
|
25
|
+
const [x, y] = pieData.center;
|
|
26
|
+
return `translate(${x}, ${y})`;
|
|
27
|
+
})
|
|
28
|
+
.style('stroke-width', (pieData) => pieData.borderWidth)
|
|
29
|
+
.attr('cursor', (pieData) => pieData.series.cursor);
|
|
30
|
+
// Render halo appearing outside the hovered slice
|
|
31
|
+
shapesSelection
|
|
32
|
+
.selectAll('halo')
|
|
33
|
+
.data((pieData) => {
|
|
34
|
+
if (pieData.halo.enabled) {
|
|
35
|
+
return pieData.segments;
|
|
36
|
+
}
|
|
37
|
+
return [];
|
|
38
|
+
})
|
|
39
|
+
.join('path')
|
|
40
|
+
.attr('d', (d) => {
|
|
41
|
+
const arcGenerator = arc()
|
|
42
|
+
.innerRadius(d.data.pie.innerRadius)
|
|
43
|
+
.outerRadius(d.data.radius + d.data.pie.halo.size)
|
|
44
|
+
.cornerRadius(d.data.pie.borderRadius);
|
|
45
|
+
return arcGenerator(d);
|
|
46
|
+
})
|
|
47
|
+
.attr('class', b('halo'))
|
|
48
|
+
.attr('fill', (d) => d.data.color)
|
|
49
|
+
.attr('opacity', (d) => d.data.pie.halo.opacity)
|
|
50
|
+
.attr('z-index', -1)
|
|
51
|
+
.attr('visibility', getHaloVisibility);
|
|
52
|
+
// Render segments
|
|
53
|
+
shapesSelection
|
|
54
|
+
.selectAll(segmentSelector)
|
|
55
|
+
.data((pieData) => pieData.segments)
|
|
56
|
+
.join('path')
|
|
57
|
+
.attr('d', (d) => {
|
|
58
|
+
const arcGenerator = arc()
|
|
59
|
+
.innerRadius(d.data.pie.innerRadius)
|
|
60
|
+
.outerRadius(d.data.radius)
|
|
61
|
+
.cornerRadius(d.data.pie.borderRadius);
|
|
62
|
+
return arcGenerator(d);
|
|
63
|
+
})
|
|
64
|
+
.attr('class', b('segment'))
|
|
65
|
+
.style('stroke', (d) => d.data.series.borderColor)
|
|
66
|
+
.attr('fill', (d) => d.data.color)
|
|
67
|
+
.attr('opacity', (d) => d.data.opacity);
|
|
68
|
+
// render Labels
|
|
69
|
+
shapesSelection
|
|
70
|
+
.selectAll('text')
|
|
71
|
+
.data((pieData) => pieData.labels)
|
|
72
|
+
.join('text')
|
|
73
|
+
.html((d) => d.text)
|
|
74
|
+
.attr('class', b('label'))
|
|
75
|
+
.attr('x', (d) => d.x)
|
|
76
|
+
.attr('y', (d) => d.y)
|
|
77
|
+
.attr('text-anchor', (d) => d.textAnchor)
|
|
78
|
+
.style('font-size', (d) => d.style.fontSize)
|
|
79
|
+
.style('font-weight', (d) => d.style.fontWeight || null)
|
|
80
|
+
.style('fill', (d) => d.style.fontColor || null)
|
|
81
|
+
.call(setEllipsisForOverflowTexts, (d) => d.size.width > d.maxWidth ? d.maxWidth : Infinity);
|
|
82
|
+
// Add the polyline between chart and labels
|
|
83
|
+
shapesSelection
|
|
84
|
+
.selectAll(connectorSelector)
|
|
85
|
+
.data((pieData) => pieData.connectors)
|
|
86
|
+
.enter()
|
|
87
|
+
.append('path')
|
|
88
|
+
.attr('class', b('connector'))
|
|
89
|
+
.attr('d', (d) => d.path)
|
|
90
|
+
.attr('stroke', (d) => d.color)
|
|
91
|
+
.attr('stroke-width', 1)
|
|
92
|
+
.attr('stroke-linejoin', 'round')
|
|
93
|
+
.attr('stroke-linecap', 'round')
|
|
94
|
+
.style('fill', 'none');
|
|
95
|
+
// Render custom shapes if defined
|
|
96
|
+
shapesSelection.each(async function (d, index, nodes) {
|
|
97
|
+
var _a, _b;
|
|
98
|
+
const customShape = await ((_b = (_a = d.series).renderCustomShape) === null || _b === void 0 ? void 0 : _b.call(_a, {
|
|
99
|
+
series: {
|
|
100
|
+
innerRadius: d.innerRadius,
|
|
101
|
+
},
|
|
102
|
+
}));
|
|
103
|
+
if (customShape) {
|
|
104
|
+
nodes[index].append(customShape);
|
|
105
|
+
}
|
|
106
|
+
});
|
|
107
|
+
const eventName = `hover-shape.pie`;
|
|
108
|
+
const hoverOptions = get(seriesOptions, 'pie.states.hover');
|
|
109
|
+
const inactiveOptions = get(seriesOptions, 'pie.states.inactive');
|
|
110
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on(eventName, (data) => {
|
|
111
|
+
var _a, _b;
|
|
112
|
+
const selectedSeriesId = (_b = (_a = data === null || data === void 0 ? void 0 : data[0]) === null || _a === void 0 ? void 0 : _a.series) === null || _b === void 0 ? void 0 : _b.id;
|
|
113
|
+
const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
|
|
114
|
+
const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;
|
|
115
|
+
shapesSelection.datum((_d, index, list) => {
|
|
116
|
+
const pieSelection = select(list[index]);
|
|
117
|
+
const haloSelection = pieSelection.selectAll(`.${b('halo')}`);
|
|
118
|
+
pieSelection
|
|
119
|
+
.selectAll(segmentSelector)
|
|
120
|
+
.datum((d, i, elements) => {
|
|
121
|
+
const hovered = Boolean(hoverEnabled && d.data.series.id === selectedSeriesId);
|
|
122
|
+
if (d.data.hovered !== hovered) {
|
|
123
|
+
d.data.hovered = hovered;
|
|
124
|
+
select(elements[i]).attr('fill', () => {
|
|
125
|
+
var _a;
|
|
126
|
+
const initialColor = d.data.color;
|
|
127
|
+
if (d.data.hovered) {
|
|
128
|
+
return (((_a = color(initialColor)) === null || _a === void 0 ? void 0 : _a.brighter(hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.brightness).toString()) || initialColor);
|
|
129
|
+
}
|
|
130
|
+
return initialColor;
|
|
131
|
+
});
|
|
132
|
+
const currentSegmentHalo = haloSelection.nodes()[i];
|
|
133
|
+
select(currentSegmentHalo).attr('visibility', getHaloVisibility);
|
|
134
|
+
}
|
|
135
|
+
setActiveState({
|
|
136
|
+
element: elements[i],
|
|
137
|
+
state: inactiveOptions,
|
|
138
|
+
active: Boolean(!inactiveEnabled ||
|
|
139
|
+
!selectedSeriesId ||
|
|
140
|
+
selectedSeriesId === d.data.series.id),
|
|
141
|
+
datum: d.data,
|
|
142
|
+
});
|
|
143
|
+
return d;
|
|
144
|
+
});
|
|
145
|
+
const labelSelection = pieSelection.selectAll(`.${b('label')} tspan`);
|
|
146
|
+
const connectorSelection = pieSelection.selectAll(connectorSelector);
|
|
147
|
+
labelSelection.merge(connectorSelection).datum((d, i, elements) => {
|
|
148
|
+
return setActiveState({
|
|
149
|
+
element: elements[i],
|
|
150
|
+
state: inactiveOptions,
|
|
151
|
+
active: Boolean(!inactiveEnabled || !selectedSeriesId || selectedSeriesId === d.series.id),
|
|
152
|
+
datum: d,
|
|
153
|
+
});
|
|
154
|
+
});
|
|
155
|
+
});
|
|
156
|
+
});
|
|
157
|
+
return () => {
|
|
158
|
+
dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on(eventName, null);
|
|
159
|
+
};
|
|
160
|
+
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { PieArcDatum } from 'd3-shape';
|
|
2
2
|
import type { ConnectorCurve, HtmlItem, LabelData } from '../../../types';
|
|
3
|
-
import type { PreparedPieSeries } from '../../
|
|
3
|
+
import type { PreparedPieSeries } from '../../series/types';
|
|
4
4
|
export type SegmentData = {
|
|
5
5
|
value: number;
|
|
6
6
|
color: string;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { range } from 'd3-array';
|
|
2
2
|
import { scaleLinear } from 'd3-scale';
|
|
3
3
|
import { curveLinearClosed, line } from 'd3-shape';
|
|
4
|
-
import { getLabelsSize, getTextSizeFn } from '
|
|
5
|
-
import { getFormattedValue } from '
|
|
4
|
+
import { getLabelsSize, getTextSizeFn } from '../../utils';
|
|
5
|
+
import { getFormattedValue } from '../../utils/format';
|
|
6
6
|
export async function prepareRadarData(args) {
|
|
7
7
|
const { series: preparedSeries, boundsWidth, boundsHeight } = args;
|
|
8
8
|
const maxRadius = Math.min(boundsWidth, boundsHeight) / 2;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { Dispatch } from 'd3-dispatch';
|
|
2
|
+
import type { PreparedSeriesOptions } from '../../series/types';
|
|
3
|
+
import type { PreparedRadarData } from './types';
|
|
4
|
+
export declare function renderRadar(elements: {
|
|
5
|
+
plot: SVGGElement;
|
|
6
|
+
}, preparedData: PreparedRadarData[], seriesOptions: PreparedSeriesOptions, dispatcher?: Dispatch<object>): () => void;
|