@hitachivantara/uikit-react-viz 5.6.47 → 5.6.48
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/BarChart/BarChart.cjs +2 -1
- package/dist/cjs/BarChart/BarChart.cjs.map +1 -1
- package/dist/cjs/LineChart/LineChart.cjs +2 -1
- package/dist/cjs/LineChart/LineChart.cjs.map +1 -1
- package/dist/cjs/hooks/useSeries.cjs +6 -6
- package/dist/cjs/hooks/useSeries.cjs.map +1 -1
- package/dist/esm/BarChart/BarChart.js +3 -2
- package/dist/esm/BarChart/BarChart.js.map +1 -1
- package/dist/esm/LineChart/LineChart.js +3 -2
- package/dist/esm/LineChart/LineChart.js.map +1 -1
- package/dist/esm/hooks/useSeries.js +6 -6
- package/dist/esm/hooks/useSeries.js.map +1 -1
- package/package.json +3 -3
|
@@ -42,7 +42,8 @@ echarts__namespace.use([
|
|
|
42
42
|
components.TooltipComponent,
|
|
43
43
|
components.LegendComponent,
|
|
44
44
|
components.DataZoomSliderComponent,
|
|
45
|
-
components.DataZoomInsideComponent
|
|
45
|
+
components.DataZoomInsideComponent,
|
|
46
|
+
components.MarkLineComponent
|
|
46
47
|
]);
|
|
47
48
|
const HvBarChart = react.forwardRef(
|
|
48
49
|
(props, ref) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BarChart.cjs","sources":["../../../src/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useXAxis,\n useYAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n useOption,\n HvChartTooltipClasses,\n} from \"../hooks\";\n\nimport { HvBarChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n BarChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvBarChartMeasures>;\n /** Whether the bar chart should be horizontal. Defaults to `false`. */\n horizontal?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n (props, ref) => {\n const {\n yAxis,\n xAxis,\n horizontal = false,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n stack,\n seriesNameFormatter,\n measures,\n legend,\n tooltip,\n classes,\n height,\n width,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n defaultType: horizontal ? \"categorical\" : \"continuous\",\n });\n\n const chartXAxis = useXAxis({\n type: horizontal ? \"continuous\" : \"categorical\",\n ...xAxis,\n });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"bar\",\n data: chartData,\n groupBy,\n measures,\n stack,\n nameFormatter: seriesNameFormatter,\n horizontal,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n icon: \"square\",\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n horizontal,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":["echarts","BarChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","forwardRef","useData","useDataset","useYAxis","useXAxis","useDataZoom","useGrid","useSeries","useLegend","useTooltip","useOption","jsx","HvBaseChart"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"BarChart.cjs","sources":["../../../src/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useXAxis,\n useYAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n useOption,\n HvChartTooltipClasses,\n} from \"../hooks\";\n\nimport { HvBarChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n BarChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvBarChartMeasures>;\n /** Whether the bar chart should be horizontal. Defaults to `false`. */\n horizontal?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n (props, ref) => {\n const {\n yAxis,\n xAxis,\n horizontal = false,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n stack,\n seriesNameFormatter,\n measures,\n legend,\n tooltip,\n classes,\n height,\n width,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n defaultType: horizontal ? \"categorical\" : \"continuous\",\n });\n\n const chartXAxis = useXAxis({\n type: horizontal ? \"continuous\" : \"categorical\",\n ...xAxis,\n });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"bar\",\n data: chartData,\n groupBy,\n measures,\n stack,\n nameFormatter: seriesNameFormatter,\n horizontal,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n icon: \"square\",\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n horizontal,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":["echarts","BarChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","MarkLineComponent","forwardRef","useData","useDataset","useYAxis","useXAxis","useDataZoom","useGrid","useSeries","useLegend","useTooltip","useOption","jsx","HvBaseChart"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCAA,mBAAQ,IAAI;AAAA,EACVC,OAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AACF,CAAC;AAkBM,MAAM,aAAaC,MAAA;AAAA,EACxB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACE,IAAA;AAEE,UAAA,YAAYC,gBAAQ,EAAE,MAAM,SAAS,QAAQ,SAAS,UAAU;AAEhE,UAAA,eAAeC,sBAAW,SAAS;AAEzC,UAAM,aAAaC,SAAAA,SAAS;AAAA,MAC1B,MAAM,MAAM,QAAQ,KAAK,KAAK,SAAS,OAAO,QAAQ,CAAC,KAAK;AAAA,MAC5D,aAAa,aAAa,gBAAgB;AAAA,IAAA,CAC3C;AAED,UAAM,aAAaC,SAAAA,SAAS;AAAA,MAC1B,MAAM,aAAa,eAAe;AAAA,MAClC,GAAG;AAAA,IAAA,CACJ;AAED,UAAM,cAAcC,YAAAA,YAAY;AAAA,MAC9B,gBAAgB,uBAAuB;AAAA,IAAA,CACxC;AAED,UAAM,YAAYC,QAAA,QAAQ,EAAE,GAAG,KAAM,CAAA;AAErC,UAAM,cAAcC,UAAAA,UAAU;AAAA,MAC5B,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf;AAAA,IAAA,CACD;AAED,UAAM,cAAcC,UAAAA,UAAU;AAAA,MAC5B,GAAG;AAAA,MACH,QAAQ,YAAY;AAAA,MACpB,MAAM;AAAA,IAAA,CACP;AAED,UAAM,eAAeC,WAAAA,WAAW;AAAA,MAC9B,GAAG;AAAA,MACH,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAED,UAAM,SAASC,UAAAA,UAAU;AAAA,MACvB,QAAQ;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA;AAAA,IAAA,CACD;AAED,WACGC,2BAAAA,IAAAC,UAAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAgB,CAAA;AAAA,EAEzE;AACF;;"}
|
|
@@ -42,7 +42,8 @@ echarts__namespace.use([
|
|
|
42
42
|
components.TooltipComponent,
|
|
43
43
|
components.LegendComponent,
|
|
44
44
|
components.DataZoomSliderComponent,
|
|
45
|
-
components.DataZoomInsideComponent
|
|
45
|
+
components.DataZoomInsideComponent,
|
|
46
|
+
components.MarkLineComponent
|
|
46
47
|
]);
|
|
47
48
|
const HvLineChart = react.forwardRef(
|
|
48
49
|
(props, ref) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LineChart.cjs","sources":["../../../src/LineChart/LineChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { LineChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useYAxis,\n useXAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n HvChartTooltipClasses,\n useOption,\n} from \"../hooks\";\n\nimport { HvChartEmptyCellMode, HvLineChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n LineChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n]);\n\nexport interface HvLineChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvLineChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvLineChartMeasures>;\n /** Strategy to use when there are empty cells. Defaults to `void`. */\n emptyCellMode?: HvChartEmptyCellMode;\n /** Whether the area under the lines should be filled. Defaults to `false`. */\n area?: boolean;\n /** Sets opacity of the filled area if `area` is true. Defaults to `0.5`. */\n areaOpacity?: number;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvLineChartClasses;\n}\n\n/**\n * A line chart or line plot or line graph is a type of chart which displays information as a series of data points\n * connected by straight line segments. It is a basic type of chart common in many fields.\n */\nexport const HvLineChart = forwardRef<ReactECharts, HvLineChartProps>(\n (props, ref) => {\n const {\n area = false,\n emptyCellMode = \"void\",\n areaOpacity = 0.5,\n yAxis,\n xAxis,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n measures,\n stack,\n seriesNameFormatter,\n legend,\n classes,\n tooltip,\n width,\n height,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, measures, splitBy, sortBy });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n });\n\n const chartXAxis = useXAxis({ ...xAxis, scale: true });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"line\",\n data: chartData,\n groupBy,\n measures,\n area,\n areaOpacity,\n emptyCellMode,\n stack,\n nameFormatter: seriesNameFormatter,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":["echarts","LineChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","forwardRef","useData","useDataset","useYAxis","useXAxis","useDataZoom","useGrid","useSeries","useLegend","useTooltip","useOption","jsx","HvBaseChart"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"LineChart.cjs","sources":["../../../src/LineChart/LineChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { LineChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useYAxis,\n useXAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n HvChartTooltipClasses,\n useOption,\n} from \"../hooks\";\n\nimport { HvChartEmptyCellMode, HvLineChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n LineChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n]);\n\nexport interface HvLineChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvLineChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvLineChartMeasures>;\n /** Strategy to use when there are empty cells. Defaults to `void`. */\n emptyCellMode?: HvChartEmptyCellMode;\n /** Whether the area under the lines should be filled. Defaults to `false`. */\n area?: boolean;\n /** Sets opacity of the filled area if `area` is true. Defaults to `0.5`. */\n areaOpacity?: number;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvLineChartClasses;\n}\n\n/**\n * A line chart or line plot or line graph is a type of chart which displays information as a series of data points\n * connected by straight line segments. It is a basic type of chart common in many fields.\n */\nexport const HvLineChart = forwardRef<ReactECharts, HvLineChartProps>(\n (props, ref) => {\n const {\n area = false,\n emptyCellMode = \"void\",\n areaOpacity = 0.5,\n yAxis,\n xAxis,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n measures,\n stack,\n seriesNameFormatter,\n legend,\n classes,\n tooltip,\n width,\n height,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, measures, splitBy, sortBy });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n });\n\n const chartXAxis = useXAxis({ ...xAxis, scale: true });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"line\",\n data: chartData,\n groupBy,\n measures,\n area,\n areaOpacity,\n emptyCellMode,\n stack,\n nameFormatter: seriesNameFormatter,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":["echarts","LineChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","MarkLineComponent","forwardRef","useData","useDataset","useYAxis","useXAxis","useDataZoom","useGrid","useSeries","useLegend","useTooltip","useOption","jsx","HvBaseChart"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCAA,mBAAQ,IAAI;AAAA,EACVC,OAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AAAA,EACAC,WAAA;AACF,CAAC;AAuBM,MAAM,cAAcC,MAAA;AAAA,EACzB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ,OAAO;AAAA,MACP,gBAAgB;AAAA,MAChB,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACE,IAAA;AAEE,UAAA,YAAYC,gBAAQ,EAAE,MAAM,SAAS,UAAU,SAAS,QAAQ;AAEhE,UAAA,eAAeC,sBAAW,SAAS;AAEzC,UAAM,aAAaC,SAAAA,SAAS;AAAA,MAC1B,MAAM,MAAM,QAAQ,KAAK,KAAK,SAAS,OAAO,QAAQ,CAAC,KAAK;AAAA,IAAA,CAC7D;AAED,UAAM,aAAaC,SAAAA,SAAS,EAAE,GAAG,OAAO,OAAO,MAAM;AAErD,UAAM,cAAcC,YAAAA,YAAY;AAAA,MAC9B,gBAAgB,uBAAuB;AAAA,IAAA,CACxC;AAED,UAAM,YAAYC,QAAA,QAAQ,EAAE,GAAG,KAAM,CAAA;AAErC,UAAM,cAAcC,UAAAA,UAAU;AAAA,MAC5B,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,IAAA,CAChB;AAED,UAAM,cAAcC,UAAAA,UAAU;AAAA,MAC5B,GAAG;AAAA,MACH,QAAQ,YAAY;AAAA,IAAA,CACrB;AAED,UAAM,eAAeC,WAAAA,WAAW;AAAA,MAC9B,GAAG;AAAA,MACH,SAAS;AAAA,MACT;AAAA,MACA;AAAA,IAAA,CACD;AAED,UAAM,SAASC,UAAAA,UAAU;AAAA,MACvB,QAAQ;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA;AAAA,IAAA,CACD;AAED,WACGC,2BAAAA,IAAAC,UAAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAgB,CAAA;AAAA,EAEzE;AACF;;"}
|
|
@@ -92,15 +92,15 @@ const useSeries = ({
|
|
|
92
92
|
}, [
|
|
93
93
|
data,
|
|
94
94
|
groupByKey,
|
|
95
|
-
area,
|
|
96
|
-
stack,
|
|
97
|
-
nameFormatter,
|
|
98
|
-
emptyCellMode,
|
|
99
|
-
areaOpacity,
|
|
100
95
|
measures,
|
|
101
96
|
type,
|
|
97
|
+
nameFormatter,
|
|
98
|
+
radius,
|
|
99
|
+
stack,
|
|
102
100
|
horizontal,
|
|
103
|
-
|
|
101
|
+
emptyCellMode,
|
|
102
|
+
area,
|
|
103
|
+
areaOpacity
|
|
104
104
|
]);
|
|
105
105
|
return option;
|
|
106
106
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSeries.cjs","sources":["../../../src/hooks/useSeries.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n BarSeriesOption,\n LineSeriesOption,\n PieSeriesOption,\n} from \"echarts/charts\";\n\nimport { internal } from \"arquero\";\n\nimport { getGroupKey, getMeasure } from \"../utils\";\nimport {\n HvBarChartMeasures,\n HvChartEmptyCellMode,\n HvDonutChartMeasure,\n HvLineChartMeasures,\n} from \"../types\";\nimport {\n HvAxisChartCommonProps,\n HvChartCommonProps,\n HvEChartsOption,\n} from \"../types/common\";\nimport { BarFullMeasures, LineFullMeasures } from \"../types/measures\";\n\ninterface HvSeriesHookProps {\n type: \"line\" | \"bar\" | \"pie\";\n data: internal.ColumnTable;\n groupBy: HvChartCommonProps[\"groupBy\"];\n measures:\n | Arrayable<HvLineChartMeasures | HvBarChartMeasures>\n | HvDonutChartMeasure;\n area?: boolean;\n areaOpacity?: number;\n emptyCellMode?: HvChartEmptyCellMode;\n stack?: HvAxisChartCommonProps[\"stack\"];\n nameFormatter?: HvAxisChartCommonProps[\"seriesNameFormatter\"];\n horizontal?: boolean;\n radius?: number | string | (number | string)[];\n}\n\nexport const useSeries = ({\n groupBy,\n type,\n data,\n measures,\n nameFormatter,\n stack,\n horizontal = false,\n area = false,\n areaOpacity = 0.5,\n emptyCellMode,\n radius,\n}: HvSeriesHookProps) => {\n const groupByKey = getGroupKey(groupBy);\n\n const option: Pick<HvEChartsOption, \"series\"> = useMemo<\n Pick<HvEChartsOption, \"series\">\n >(() => {\n return {\n series: data\n .columnNames()\n .filter((c) => c !== groupByKey)\n .map<LineSeriesOption | BarSeriesOption | PieSeriesOption>((c) => {\n const measure = getMeasure(c, measures);\n\n let pieOps: PieSeriesOption = {};\n let lineOps: LineSeriesOption = {};\n let barOps: BarSeriesOption = {};\n\n // pie\n if (type === \"pie\") {\n pieOps = {\n encode: {\n value: c,\n itemName: groupByKey,\n },\n labelLine: {\n show: false,\n },\n label: {\n show: false,\n },\n emphasis: {\n label: {\n show: false,\n },\n },\n radius,\n };\n }\n\n // line or bar\n if (type === \"line\" || type === \"bar\") {\n const sampling =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).sampling\n : undefined;\n const yAxisId =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).yAxis\n : undefined;\n const stackName =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).stack ??\n stack ??\n undefined\n : stack ?? undefined;\n\n const axisOps = {\n sampling,\n yAxisId,\n stack: stackName,\n encode: horizontal\n ? {\n x: c,\n y: groupByKey,\n }\n : {\n x: groupByKey,\n y: c,\n },\n };\n\n // bar\n if (type === \"bar\") {\n barOps = {\n ...axisOps,\n barMaxWidth: 90,\n barMinWidth: 3,\n };\n }\n\n // line\n if (type === \"line\") {\n const showSymbol =\n typeof measure !== \"string\"\n ? !(measure as LineFullMeasures).hideSymbol\n : true;\n const connectNulls =\n typeof measure !== \"string\" &&\n (measure as LineFullMeasures).emptyCellMode\n ? (measure as LineFullMeasures).emptyCellMode === \"connect\"\n : emptyCellMode === \"connect\";\n const isArea =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).area ?? area\n : area;\n const aOpacity =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).areaOpacity ?? areaOpacity\n : areaOpacity;\n\n lineOps = {\n ...axisOps,\n connectNulls,\n showSymbol,\n areaStyle: isArea ? { opacity: aOpacity } : undefined,\n };\n }\n }\n\n return {\n id: `series~${groupByKey}~${c}`,\n type,\n name: nameFormatter ? nameFormatter(c) : c,\n ...pieOps,\n ...barOps,\n ...lineOps,\n } as LineSeriesOption | BarSeriesOption | PieSeriesOption;\n }),\n };\n }, [\n data,\n groupByKey,\n
|
|
1
|
+
{"version":3,"file":"useSeries.cjs","sources":["../../../src/hooks/useSeries.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n BarSeriesOption,\n LineSeriesOption,\n PieSeriesOption,\n} from \"echarts/charts\";\n\nimport { internal } from \"arquero\";\n\nimport { getGroupKey, getMeasure } from \"../utils\";\nimport {\n HvBarChartMeasures,\n HvChartEmptyCellMode,\n HvDonutChartMeasure,\n HvLineChartMeasures,\n} from \"../types\";\nimport {\n HvAxisChartCommonProps,\n HvChartCommonProps,\n HvEChartsOption,\n} from \"../types/common\";\nimport { BarFullMeasures, LineFullMeasures } from \"../types/measures\";\n\ninterface HvSeriesHookProps {\n type: \"line\" | \"bar\" | \"pie\";\n data: internal.ColumnTable;\n groupBy: HvChartCommonProps[\"groupBy\"];\n measures:\n | Arrayable<HvLineChartMeasures | HvBarChartMeasures>\n | HvDonutChartMeasure;\n area?: boolean;\n areaOpacity?: number;\n emptyCellMode?: HvChartEmptyCellMode;\n stack?: HvAxisChartCommonProps[\"stack\"];\n nameFormatter?: HvAxisChartCommonProps[\"seriesNameFormatter\"];\n horizontal?: boolean;\n radius?: number | string | (number | string)[];\n}\n\nexport const useSeries = ({\n groupBy,\n type,\n data,\n measures,\n nameFormatter,\n stack,\n horizontal = false,\n area = false,\n areaOpacity = 0.5,\n emptyCellMode,\n radius,\n}: HvSeriesHookProps) => {\n const groupByKey = getGroupKey(groupBy);\n\n const option: Pick<HvEChartsOption, \"series\"> = useMemo<\n Pick<HvEChartsOption, \"series\">\n >(() => {\n return {\n series: data\n .columnNames()\n .filter((c) => c !== groupByKey)\n .map<LineSeriesOption | BarSeriesOption | PieSeriesOption>((c) => {\n const measure = getMeasure(c, measures);\n\n let pieOps: PieSeriesOption = {};\n let lineOps: LineSeriesOption = {};\n let barOps: BarSeriesOption = {};\n\n // pie\n if (type === \"pie\") {\n pieOps = {\n encode: {\n value: c,\n itemName: groupByKey,\n },\n labelLine: {\n show: false,\n },\n label: {\n show: false,\n },\n emphasis: {\n label: {\n show: false,\n },\n },\n radius,\n };\n }\n\n // line or bar\n if (type === \"line\" || type === \"bar\") {\n const sampling =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).sampling\n : undefined;\n const yAxisId =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).yAxis\n : undefined;\n const stackName =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).stack ??\n stack ??\n undefined\n : stack ?? undefined;\n\n const axisOps = {\n sampling,\n yAxisId,\n stack: stackName,\n encode: horizontal\n ? {\n x: c,\n y: groupByKey,\n }\n : {\n x: groupByKey,\n y: c,\n },\n };\n\n // bar\n if (type === \"bar\") {\n barOps = {\n ...axisOps,\n barMaxWidth: 90,\n barMinWidth: 3,\n };\n }\n\n // line\n if (type === \"line\") {\n const showSymbol =\n typeof measure !== \"string\"\n ? !(measure as LineFullMeasures).hideSymbol\n : true;\n const connectNulls =\n typeof measure !== \"string\" &&\n (measure as LineFullMeasures).emptyCellMode\n ? (measure as LineFullMeasures).emptyCellMode === \"connect\"\n : emptyCellMode === \"connect\";\n const isArea =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).area ?? area\n : area;\n const aOpacity =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).areaOpacity ?? areaOpacity\n : areaOpacity;\n\n lineOps = {\n ...axisOps,\n connectNulls,\n showSymbol,\n areaStyle: isArea ? { opacity: aOpacity } : undefined,\n };\n }\n }\n\n return {\n id: `series~${groupByKey}~${c}`,\n type,\n name: nameFormatter ? nameFormatter(c) : c,\n ...pieOps,\n ...barOps,\n ...lineOps,\n } as LineSeriesOption | BarSeriesOption | PieSeriesOption;\n }),\n };\n }, [\n data,\n groupByKey,\n measures,\n type,\n nameFormatter,\n radius,\n stack,\n horizontal,\n emptyCellMode,\n area,\n areaOpacity,\n ]);\n\n return option;\n};\n"],"names":["getGroupKey","useMemo","getMeasure"],"mappings":";;;;AA0CO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,OAAO;AAAA,EACP,cAAc;AAAA,EACd;AAAA,EACA;AACF,MAAyB;AACjB,QAAA,aAAaA,kBAAY,OAAO;AAEhC,QAAA,SAA0CC,MAAAA,QAE9C,MAAM;AACC,WAAA;AAAA,MACL,QAAQ,KACL,YAAY,EACZ,OAAO,CAAC,MAAM,MAAM,UAAU,EAC9B,IAA0D,CAAC,MAAM;AAC1D,cAAA,UAAUC,MAAAA,WAAW,GAAG,QAAQ;AAEtC,YAAI,SAA0B,CAAA;AAC9B,YAAI,UAA4B,CAAA;AAChC,YAAI,SAA0B,CAAA;AAG9B,YAAI,SAAS,OAAO;AACT,mBAAA;AAAA,YACP,QAAQ;AAAA,cACN,OAAO;AAAA,cACP,UAAU;AAAA,YACZ;AAAA,YACA,WAAW;AAAA,cACT,MAAM;AAAA,YACR;AAAA,YACA,OAAO;AAAA,cACL,MAAM;AAAA,YACR;AAAA,YACA,UAAU;AAAA,cACR,OAAO;AAAA,gBACL,MAAM;AAAA,cACR;AAAA,YACF;AAAA,YACA;AAAA,UAAA;AAAA,QAEJ;AAGI,YAAA,SAAS,UAAU,SAAS,OAAO;AACrC,gBAAM,WACJ,OAAO,YAAY,WACd,QAA+C,WAChD;AACN,gBAAM,UACJ,OAAO,YAAY,WACd,QAA+C,QAChD;AACA,gBAAA,YACJ,OAAO,YAAY,WACd,QAA+C,SAChD,SACA,SACA,SAAS;AAEf,gBAAM,UAAU;AAAA,YACd;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP,QAAQ,aACJ;AAAA,cACE,GAAG;AAAA,cACH,GAAG;AAAA,YAAA,IAEL;AAAA,cACE,GAAG;AAAA,cACH,GAAG;AAAA,YACL;AAAA,UAAA;AAIN,cAAI,SAAS,OAAO;AACT,qBAAA;AAAA,cACP,GAAG;AAAA,cACH,aAAa;AAAA,cACb,aAAa;AAAA,YAAA;AAAA,UAEjB;AAGA,cAAI,SAAS,QAAQ;AACnB,kBAAM,aACJ,OAAO,YAAY,WACf,CAAE,QAA6B,aAC/B;AACA,kBAAA,eACJ,OAAO,YAAY,YAClB,QAA6B,gBACzB,QAA6B,kBAAkB,YAChD,kBAAkB;AACxB,kBAAM,SACJ,OAAO,YAAY,WACd,QAA6B,QAAQ,OACtC;AACN,kBAAM,WACJ,OAAO,YAAY,WACd,QAA6B,eAAe,cAC7C;AAEI,sBAAA;AAAA,cACR,GAAG;AAAA,cACH;AAAA,cACA;AAAA,cACA,WAAW,SAAS,EAAE,SAAS,aAAa;AAAA,YAAA;AAAA,UAEhD;AAAA,QACF;AAEO,eAAA;AAAA,UACL,IAAI,UAAU,UAAU,IAAI,CAAC;AAAA,UAC7B;AAAA,UACA,MAAM,gBAAgB,cAAc,CAAC,IAAI;AAAA,UACzC,GAAG;AAAA,UACH,GAAG;AAAA,UACH,GAAG;AAAA,QAAA;AAAA,MACL,CACD;AAAA,IAAA;AAAA,EACL,GACC;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAEM,SAAA;AACT;;"}
|
|
@@ -2,7 +2,7 @@ import { jsx } from "@emotion/react/jsx-runtime";
|
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
3
|
import * as echarts from "echarts/core";
|
|
4
4
|
import { BarChart } from "echarts/charts";
|
|
5
|
-
import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent } from "echarts/components";
|
|
5
|
+
import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent, MarkLineComponent } from "echarts/components";
|
|
6
6
|
import { useData } from "../hooks/useData.js";
|
|
7
7
|
import { useDataset } from "../hooks/useDataset.js";
|
|
8
8
|
import { useYAxis } from "../hooks/useYAxis.js";
|
|
@@ -21,7 +21,8 @@ echarts.use([
|
|
|
21
21
|
TooltipComponent,
|
|
22
22
|
LegendComponent,
|
|
23
23
|
DataZoomSliderComponent,
|
|
24
|
-
DataZoomInsideComponent
|
|
24
|
+
DataZoomInsideComponent,
|
|
25
|
+
MarkLineComponent
|
|
25
26
|
]);
|
|
26
27
|
const HvBarChart = forwardRef(
|
|
27
28
|
(props, ref) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BarChart.js","sources":["../../../src/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useXAxis,\n useYAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n useOption,\n HvChartTooltipClasses,\n} from \"../hooks\";\n\nimport { HvBarChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n BarChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvBarChartMeasures>;\n /** Whether the bar chart should be horizontal. Defaults to `false`. */\n horizontal?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n (props, ref) => {\n const {\n yAxis,\n xAxis,\n horizontal = false,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n stack,\n seriesNameFormatter,\n measures,\n legend,\n tooltip,\n classes,\n height,\n width,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n defaultType: horizontal ? \"categorical\" : \"continuous\",\n });\n\n const chartXAxis = useXAxis({\n type: horizontal ? \"continuous\" : \"categorical\",\n ...xAxis,\n });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"bar\",\n data: chartData,\n groupBy,\n measures,\n stack,\n nameFormatter: seriesNameFormatter,\n horizontal,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n icon: \"square\",\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n horizontal,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"BarChart.js","sources":["../../../src/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useXAxis,\n useYAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n useOption,\n HvChartTooltipClasses,\n} from \"../hooks\";\n\nimport { HvBarChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n BarChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvBarChartMeasures>;\n /** Whether the bar chart should be horizontal. Defaults to `false`. */\n horizontal?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n (props, ref) => {\n const {\n yAxis,\n xAxis,\n horizontal = false,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n stack,\n seriesNameFormatter,\n measures,\n legend,\n tooltip,\n classes,\n height,\n width,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n defaultType: horizontal ? \"categorical\" : \"continuous\",\n });\n\n const chartXAxis = useXAxis({\n type: horizontal ? \"continuous\" : \"categorical\",\n ...xAxis,\n });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"bar\",\n data: chartData,\n groupBy,\n measures,\n stack,\n nameFormatter: seriesNameFormatter,\n horizontal,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n icon: \"square\",\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n horizontal,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAoCA,QAAQ,IAAI;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAkBM,MAAM,aAAa;AAAA,EACxB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACE,IAAA;AAEE,UAAA,YAAY,QAAQ,EAAE,MAAM,SAAS,QAAQ,SAAS,UAAU;AAEhE,UAAA,eAAe,WAAW,SAAS;AAEzC,UAAM,aAAa,SAAS;AAAA,MAC1B,MAAM,MAAM,QAAQ,KAAK,KAAK,SAAS,OAAO,QAAQ,CAAC,KAAK;AAAA,MAC5D,aAAa,aAAa,gBAAgB;AAAA,IAAA,CAC3C;AAED,UAAM,aAAa,SAAS;AAAA,MAC1B,MAAM,aAAa,eAAe;AAAA,MAClC,GAAG;AAAA,IAAA,CACJ;AAED,UAAM,cAAc,YAAY;AAAA,MAC9B,gBAAgB,uBAAuB;AAAA,IAAA,CACxC;AAED,UAAM,YAAY,QAAQ,EAAE,GAAG,KAAM,CAAA;AAErC,UAAM,cAAc,UAAU;AAAA,MAC5B,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf;AAAA,IAAA,CACD;AAED,UAAM,cAAc,UAAU;AAAA,MAC5B,GAAG;AAAA,MACH,QAAQ,YAAY;AAAA,MACpB,MAAM;AAAA,IAAA,CACP;AAED,UAAM,eAAe,WAAW;AAAA,MAC9B,GAAG;AAAA,MACH,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAED,UAAM,SAAS,UAAU;AAAA,MACvB,QAAQ;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA;AAAA,IAAA,CACD;AAED,WACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAgB,CAAA;AAAA,EAEzE;AACF;"}
|
|
@@ -2,7 +2,7 @@ import { jsx } from "@emotion/react/jsx-runtime";
|
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
3
|
import * as echarts from "echarts/core";
|
|
4
4
|
import { LineChart } from "echarts/charts";
|
|
5
|
-
import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent } from "echarts/components";
|
|
5
|
+
import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent, MarkLineComponent } from "echarts/components";
|
|
6
6
|
import { useData } from "../hooks/useData.js";
|
|
7
7
|
import { useDataset } from "../hooks/useDataset.js";
|
|
8
8
|
import { useYAxis } from "../hooks/useYAxis.js";
|
|
@@ -21,7 +21,8 @@ echarts.use([
|
|
|
21
21
|
TooltipComponent,
|
|
22
22
|
LegendComponent,
|
|
23
23
|
DataZoomSliderComponent,
|
|
24
|
-
DataZoomInsideComponent
|
|
24
|
+
DataZoomInsideComponent,
|
|
25
|
+
MarkLineComponent
|
|
25
26
|
]);
|
|
26
27
|
const HvLineChart = forwardRef(
|
|
27
28
|
(props, ref) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LineChart.js","sources":["../../../src/LineChart/LineChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { LineChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useYAxis,\n useXAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n HvChartTooltipClasses,\n useOption,\n} from \"../hooks\";\n\nimport { HvChartEmptyCellMode, HvLineChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n LineChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n]);\n\nexport interface HvLineChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvLineChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvLineChartMeasures>;\n /** Strategy to use when there are empty cells. Defaults to `void`. */\n emptyCellMode?: HvChartEmptyCellMode;\n /** Whether the area under the lines should be filled. Defaults to `false`. */\n area?: boolean;\n /** Sets opacity of the filled area if `area` is true. Defaults to `0.5`. */\n areaOpacity?: number;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvLineChartClasses;\n}\n\n/**\n * A line chart or line plot or line graph is a type of chart which displays information as a series of data points\n * connected by straight line segments. It is a basic type of chart common in many fields.\n */\nexport const HvLineChart = forwardRef<ReactECharts, HvLineChartProps>(\n (props, ref) => {\n const {\n area = false,\n emptyCellMode = \"void\",\n areaOpacity = 0.5,\n yAxis,\n xAxis,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n measures,\n stack,\n seriesNameFormatter,\n legend,\n classes,\n tooltip,\n width,\n height,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, measures, splitBy, sortBy });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n });\n\n const chartXAxis = useXAxis({ ...xAxis, scale: true });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"line\",\n data: chartData,\n groupBy,\n measures,\n area,\n areaOpacity,\n emptyCellMode,\n stack,\n nameFormatter: seriesNameFormatter,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"LineChart.js","sources":["../../../src/LineChart/LineChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { LineChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useYAxis,\n useXAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n HvChartTooltipClasses,\n useOption,\n} from \"../hooks\";\n\nimport { HvChartEmptyCellMode, HvLineChartMeasures } from \"../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../types/common\";\n\n// Register chart components\necharts.use([\n LineChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n MarkLineComponent,\n]);\n\nexport interface HvLineChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvLineChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvLineChartMeasures>;\n /** Strategy to use when there are empty cells. Defaults to `void`. */\n emptyCellMode?: HvChartEmptyCellMode;\n /** Whether the area under the lines should be filled. Defaults to `false`. */\n area?: boolean;\n /** Sets opacity of the filled area if `area` is true. Defaults to `0.5`. */\n areaOpacity?: number;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvLineChartClasses;\n}\n\n/**\n * A line chart or line plot or line graph is a type of chart which displays information as a series of data points\n * connected by straight line segments. It is a basic type of chart common in many fields.\n */\nexport const HvLineChart = forwardRef<ReactECharts, HvLineChartProps>(\n (props, ref) => {\n const {\n area = false,\n emptyCellMode = \"void\",\n areaOpacity = 0.5,\n yAxis,\n xAxis,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n measures,\n stack,\n seriesNameFormatter,\n legend,\n classes,\n tooltip,\n width,\n height,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, measures, splitBy, sortBy });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n });\n\n const chartXAxis = useXAxis({ ...xAxis, scale: true });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"line\",\n data: chartData,\n groupBy,\n measures,\n area,\n areaOpacity,\n emptyCellMode,\n stack,\n nameFormatter: seriesNameFormatter,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAoCA,QAAQ,IAAI;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAuBM,MAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ,OAAO;AAAA,MACP,gBAAgB;AAAA,MAChB,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACE,IAAA;AAEE,UAAA,YAAY,QAAQ,EAAE,MAAM,SAAS,UAAU,SAAS,QAAQ;AAEhE,UAAA,eAAe,WAAW,SAAS;AAEzC,UAAM,aAAa,SAAS;AAAA,MAC1B,MAAM,MAAM,QAAQ,KAAK,KAAK,SAAS,OAAO,QAAQ,CAAC,KAAK;AAAA,IAAA,CAC7D;AAED,UAAM,aAAa,SAAS,EAAE,GAAG,OAAO,OAAO,MAAM;AAErD,UAAM,cAAc,YAAY;AAAA,MAC9B,gBAAgB,uBAAuB;AAAA,IAAA,CACxC;AAED,UAAM,YAAY,QAAQ,EAAE,GAAG,KAAM,CAAA;AAErC,UAAM,cAAc,UAAU;AAAA,MAC5B,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,IAAA,CAChB;AAED,UAAM,cAAc,UAAU;AAAA,MAC5B,GAAG;AAAA,MACH,QAAQ,YAAY;AAAA,IAAA,CACrB;AAED,UAAM,eAAe,WAAW;AAAA,MAC9B,GAAG;AAAA,MACH,SAAS;AAAA,MACT;AAAA,MACA;AAAA,IAAA,CACD;AAED,UAAM,SAAS,UAAU;AAAA,MACvB,QAAQ;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA;AAAA,IAAA,CACD;AAED,WACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAgB,CAAA;AAAA,EAEzE;AACF;"}
|
|
@@ -90,15 +90,15 @@ const useSeries = ({
|
|
|
90
90
|
}, [
|
|
91
91
|
data,
|
|
92
92
|
groupByKey,
|
|
93
|
-
area,
|
|
94
|
-
stack,
|
|
95
|
-
nameFormatter,
|
|
96
|
-
emptyCellMode,
|
|
97
|
-
areaOpacity,
|
|
98
93
|
measures,
|
|
99
94
|
type,
|
|
95
|
+
nameFormatter,
|
|
96
|
+
radius,
|
|
97
|
+
stack,
|
|
100
98
|
horizontal,
|
|
101
|
-
|
|
99
|
+
emptyCellMode,
|
|
100
|
+
area,
|
|
101
|
+
areaOpacity
|
|
102
102
|
]);
|
|
103
103
|
return option;
|
|
104
104
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSeries.js","sources":["../../../src/hooks/useSeries.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n BarSeriesOption,\n LineSeriesOption,\n PieSeriesOption,\n} from \"echarts/charts\";\n\nimport { internal } from \"arquero\";\n\nimport { getGroupKey, getMeasure } from \"../utils\";\nimport {\n HvBarChartMeasures,\n HvChartEmptyCellMode,\n HvDonutChartMeasure,\n HvLineChartMeasures,\n} from \"../types\";\nimport {\n HvAxisChartCommonProps,\n HvChartCommonProps,\n HvEChartsOption,\n} from \"../types/common\";\nimport { BarFullMeasures, LineFullMeasures } from \"../types/measures\";\n\ninterface HvSeriesHookProps {\n type: \"line\" | \"bar\" | \"pie\";\n data: internal.ColumnTable;\n groupBy: HvChartCommonProps[\"groupBy\"];\n measures:\n | Arrayable<HvLineChartMeasures | HvBarChartMeasures>\n | HvDonutChartMeasure;\n area?: boolean;\n areaOpacity?: number;\n emptyCellMode?: HvChartEmptyCellMode;\n stack?: HvAxisChartCommonProps[\"stack\"];\n nameFormatter?: HvAxisChartCommonProps[\"seriesNameFormatter\"];\n horizontal?: boolean;\n radius?: number | string | (number | string)[];\n}\n\nexport const useSeries = ({\n groupBy,\n type,\n data,\n measures,\n nameFormatter,\n stack,\n horizontal = false,\n area = false,\n areaOpacity = 0.5,\n emptyCellMode,\n radius,\n}: HvSeriesHookProps) => {\n const groupByKey = getGroupKey(groupBy);\n\n const option: Pick<HvEChartsOption, \"series\"> = useMemo<\n Pick<HvEChartsOption, \"series\">\n >(() => {\n return {\n series: data\n .columnNames()\n .filter((c) => c !== groupByKey)\n .map<LineSeriesOption | BarSeriesOption | PieSeriesOption>((c) => {\n const measure = getMeasure(c, measures);\n\n let pieOps: PieSeriesOption = {};\n let lineOps: LineSeriesOption = {};\n let barOps: BarSeriesOption = {};\n\n // pie\n if (type === \"pie\") {\n pieOps = {\n encode: {\n value: c,\n itemName: groupByKey,\n },\n labelLine: {\n show: false,\n },\n label: {\n show: false,\n },\n emphasis: {\n label: {\n show: false,\n },\n },\n radius,\n };\n }\n\n // line or bar\n if (type === \"line\" || type === \"bar\") {\n const sampling =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).sampling\n : undefined;\n const yAxisId =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).yAxis\n : undefined;\n const stackName =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).stack ??\n stack ??\n undefined\n : stack ?? undefined;\n\n const axisOps = {\n sampling,\n yAxisId,\n stack: stackName,\n encode: horizontal\n ? {\n x: c,\n y: groupByKey,\n }\n : {\n x: groupByKey,\n y: c,\n },\n };\n\n // bar\n if (type === \"bar\") {\n barOps = {\n ...axisOps,\n barMaxWidth: 90,\n barMinWidth: 3,\n };\n }\n\n // line\n if (type === \"line\") {\n const showSymbol =\n typeof measure !== \"string\"\n ? !(measure as LineFullMeasures).hideSymbol\n : true;\n const connectNulls =\n typeof measure !== \"string\" &&\n (measure as LineFullMeasures).emptyCellMode\n ? (measure as LineFullMeasures).emptyCellMode === \"connect\"\n : emptyCellMode === \"connect\";\n const isArea =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).area ?? area\n : area;\n const aOpacity =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).areaOpacity ?? areaOpacity\n : areaOpacity;\n\n lineOps = {\n ...axisOps,\n connectNulls,\n showSymbol,\n areaStyle: isArea ? { opacity: aOpacity } : undefined,\n };\n }\n }\n\n return {\n id: `series~${groupByKey}~${c}`,\n type,\n name: nameFormatter ? nameFormatter(c) : c,\n ...pieOps,\n ...barOps,\n ...lineOps,\n } as LineSeriesOption | BarSeriesOption | PieSeriesOption;\n }),\n };\n }, [\n data,\n groupByKey,\n
|
|
1
|
+
{"version":3,"file":"useSeries.js","sources":["../../../src/hooks/useSeries.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n BarSeriesOption,\n LineSeriesOption,\n PieSeriesOption,\n} from \"echarts/charts\";\n\nimport { internal } from \"arquero\";\n\nimport { getGroupKey, getMeasure } from \"../utils\";\nimport {\n HvBarChartMeasures,\n HvChartEmptyCellMode,\n HvDonutChartMeasure,\n HvLineChartMeasures,\n} from \"../types\";\nimport {\n HvAxisChartCommonProps,\n HvChartCommonProps,\n HvEChartsOption,\n} from \"../types/common\";\nimport { BarFullMeasures, LineFullMeasures } from \"../types/measures\";\n\ninterface HvSeriesHookProps {\n type: \"line\" | \"bar\" | \"pie\";\n data: internal.ColumnTable;\n groupBy: HvChartCommonProps[\"groupBy\"];\n measures:\n | Arrayable<HvLineChartMeasures | HvBarChartMeasures>\n | HvDonutChartMeasure;\n area?: boolean;\n areaOpacity?: number;\n emptyCellMode?: HvChartEmptyCellMode;\n stack?: HvAxisChartCommonProps[\"stack\"];\n nameFormatter?: HvAxisChartCommonProps[\"seriesNameFormatter\"];\n horizontal?: boolean;\n radius?: number | string | (number | string)[];\n}\n\nexport const useSeries = ({\n groupBy,\n type,\n data,\n measures,\n nameFormatter,\n stack,\n horizontal = false,\n area = false,\n areaOpacity = 0.5,\n emptyCellMode,\n radius,\n}: HvSeriesHookProps) => {\n const groupByKey = getGroupKey(groupBy);\n\n const option: Pick<HvEChartsOption, \"series\"> = useMemo<\n Pick<HvEChartsOption, \"series\">\n >(() => {\n return {\n series: data\n .columnNames()\n .filter((c) => c !== groupByKey)\n .map<LineSeriesOption | BarSeriesOption | PieSeriesOption>((c) => {\n const measure = getMeasure(c, measures);\n\n let pieOps: PieSeriesOption = {};\n let lineOps: LineSeriesOption = {};\n let barOps: BarSeriesOption = {};\n\n // pie\n if (type === \"pie\") {\n pieOps = {\n encode: {\n value: c,\n itemName: groupByKey,\n },\n labelLine: {\n show: false,\n },\n label: {\n show: false,\n },\n emphasis: {\n label: {\n show: false,\n },\n },\n radius,\n };\n }\n\n // line or bar\n if (type === \"line\" || type === \"bar\") {\n const sampling =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).sampling\n : undefined;\n const yAxisId =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).yAxis\n : undefined;\n const stackName =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures | BarFullMeasures).stack ??\n stack ??\n undefined\n : stack ?? undefined;\n\n const axisOps = {\n sampling,\n yAxisId,\n stack: stackName,\n encode: horizontal\n ? {\n x: c,\n y: groupByKey,\n }\n : {\n x: groupByKey,\n y: c,\n },\n };\n\n // bar\n if (type === \"bar\") {\n barOps = {\n ...axisOps,\n barMaxWidth: 90,\n barMinWidth: 3,\n };\n }\n\n // line\n if (type === \"line\") {\n const showSymbol =\n typeof measure !== \"string\"\n ? !(measure as LineFullMeasures).hideSymbol\n : true;\n const connectNulls =\n typeof measure !== \"string\" &&\n (measure as LineFullMeasures).emptyCellMode\n ? (measure as LineFullMeasures).emptyCellMode === \"connect\"\n : emptyCellMode === \"connect\";\n const isArea =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).area ?? area\n : area;\n const aOpacity =\n typeof measure !== \"string\"\n ? (measure as LineFullMeasures).areaOpacity ?? areaOpacity\n : areaOpacity;\n\n lineOps = {\n ...axisOps,\n connectNulls,\n showSymbol,\n areaStyle: isArea ? { opacity: aOpacity } : undefined,\n };\n }\n }\n\n return {\n id: `series~${groupByKey}~${c}`,\n type,\n name: nameFormatter ? nameFormatter(c) : c,\n ...pieOps,\n ...barOps,\n ...lineOps,\n } as LineSeriesOption | BarSeriesOption | PieSeriesOption;\n }),\n };\n }, [\n data,\n groupByKey,\n measures,\n type,\n nameFormatter,\n radius,\n stack,\n horizontal,\n emptyCellMode,\n area,\n areaOpacity,\n ]);\n\n return option;\n};\n"],"names":[],"mappings":";;AA0CO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,OAAO;AAAA,EACP,cAAc;AAAA,EACd;AAAA,EACA;AACF,MAAyB;AACjB,QAAA,aAAa,YAAY,OAAO;AAEhC,QAAA,SAA0C,QAE9C,MAAM;AACC,WAAA;AAAA,MACL,QAAQ,KACL,YAAY,EACZ,OAAO,CAAC,MAAM,MAAM,UAAU,EAC9B,IAA0D,CAAC,MAAM;AAC1D,cAAA,UAAU,WAAW,GAAG,QAAQ;AAEtC,YAAI,SAA0B,CAAA;AAC9B,YAAI,UAA4B,CAAA;AAChC,YAAI,SAA0B,CAAA;AAG9B,YAAI,SAAS,OAAO;AACT,mBAAA;AAAA,YACP,QAAQ;AAAA,cACN,OAAO;AAAA,cACP,UAAU;AAAA,YACZ;AAAA,YACA,WAAW;AAAA,cACT,MAAM;AAAA,YACR;AAAA,YACA,OAAO;AAAA,cACL,MAAM;AAAA,YACR;AAAA,YACA,UAAU;AAAA,cACR,OAAO;AAAA,gBACL,MAAM;AAAA,cACR;AAAA,YACF;AAAA,YACA;AAAA,UAAA;AAAA,QAEJ;AAGI,YAAA,SAAS,UAAU,SAAS,OAAO;AACrC,gBAAM,WACJ,OAAO,YAAY,WACd,QAA+C,WAChD;AACN,gBAAM,UACJ,OAAO,YAAY,WACd,QAA+C,QAChD;AACA,gBAAA,YACJ,OAAO,YAAY,WACd,QAA+C,SAChD,SACA,SACA,SAAS;AAEf,gBAAM,UAAU;AAAA,YACd;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP,QAAQ,aACJ;AAAA,cACE,GAAG;AAAA,cACH,GAAG;AAAA,YAAA,IAEL;AAAA,cACE,GAAG;AAAA,cACH,GAAG;AAAA,YACL;AAAA,UAAA;AAIN,cAAI,SAAS,OAAO;AACT,qBAAA;AAAA,cACP,GAAG;AAAA,cACH,aAAa;AAAA,cACb,aAAa;AAAA,YAAA;AAAA,UAEjB;AAGA,cAAI,SAAS,QAAQ;AACnB,kBAAM,aACJ,OAAO,YAAY,WACf,CAAE,QAA6B,aAC/B;AACA,kBAAA,eACJ,OAAO,YAAY,YAClB,QAA6B,gBACzB,QAA6B,kBAAkB,YAChD,kBAAkB;AACxB,kBAAM,SACJ,OAAO,YAAY,WACd,QAA6B,QAAQ,OACtC;AACN,kBAAM,WACJ,OAAO,YAAY,WACd,QAA6B,eAAe,cAC7C;AAEI,sBAAA;AAAA,cACR,GAAG;AAAA,cACH;AAAA,cACA;AAAA,cACA,WAAW,SAAS,EAAE,SAAS,aAAa;AAAA,YAAA;AAAA,UAEhD;AAAA,QACF;AAEO,eAAA;AAAA,UACL,IAAI,UAAU,UAAU,IAAI,CAAC;AAAA,UAC7B;AAAA,UACA,MAAM,gBAAgB,cAAc,CAAC,IAAI;AAAA,UACzC,GAAG;AAAA,UACH,GAAG;AAAA,UACH,GAAG;AAAA,QAAA;AAAA,MACL,CACD;AAAA,IAAA;AAAA,EACL,GACC;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAEM,SAAA;AACT;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hitachivantara/uikit-react-viz",
|
|
3
|
-
"version": "5.6.
|
|
3
|
+
"version": "5.6.48",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "Hitachi Vantara UI Kit Team",
|
|
6
6
|
"description": "Contributed React visualization components for the NEXT UI Kit.",
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@emotion/css": "^11.11.0",
|
|
36
|
-
"@hitachivantara/uikit-react-core": "^5.
|
|
36
|
+
"@hitachivantara/uikit-react-core": "^5.46.0"
|
|
37
37
|
},
|
|
38
38
|
"files": [
|
|
39
39
|
"dist"
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"access": "public",
|
|
43
43
|
"directory": "package"
|
|
44
44
|
},
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "a2562049d702de7c20373efd6785fb8f84e9a20a",
|
|
46
46
|
"main": "dist/cjs/index.cjs",
|
|
47
47
|
"exports": {
|
|
48
48
|
".": {
|