@fluentui/react-charts 9.2.1 → 9.2.3
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/CHANGELOG.md +57 -2
- package/dist/index.d.ts +168 -15
- package/lib/ChartTable.js +1 -0
- package/lib/ChartTable.js.map +1 -0
- package/lib/components/AreaChart/AreaChart.js +4 -1
- package/lib/components/AreaChart/AreaChart.js.map +1 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.js +2 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js +2 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
- package/lib/components/ChartTable/ChartTable.js +58 -0
- package/lib/components/ChartTable/ChartTable.js.map +1 -0
- package/lib/components/ChartTable/ChartTable.types.js +1 -0
- package/lib/components/ChartTable/ChartTable.types.js.map +1 -0
- package/lib/components/ChartTable/index.js +3 -0
- package/lib/components/ChartTable/index.js.map +1 -0
- package/lib/components/ChartTable/useChartTableStyles.styles.js +93 -0
- package/lib/components/ChartTable/useChartTableStyles.styles.js.map +1 -0
- package/lib/components/ChartTable/useChartTableStyles.styles.raw.js +55 -0
- package/lib/components/ChartTable/useChartTableStyles.styles.raw.js.map +1 -0
- package/lib/components/CommonComponents/CartesianChart.js +170 -100
- package/lib/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib/components/CommonComponents/ChartPopover.types.js.map +1 -1
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.js +13 -0
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js +12 -0
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
- package/lib/components/DeclarativeChart/DeclarativeChart.js +180 -102
- package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js +100 -0
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -0
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +890 -211
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.js +2 -2
- package/lib/components/DonutChart/DonutChart.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.types.js.map +1 -1
- package/lib/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib/components/GanttChart/GanttChart.js.map +1 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.js +2 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +185 -144
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +2 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib/components/HeatMapChart/HeatMapChart.js +175 -114
- package/lib/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.types.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +26 -6
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
- package/lib/components/Legends/Legends.js.map +1 -1
- package/lib/components/Legends/OverflowMenu.js.map +1 -1
- package/lib/components/LineChart/LineChart.js +251 -78
- package/lib/components/LineChart/LineChart.js.map +1 -1
- package/lib/components/LineChart/LineChart.types.js.map +1 -1
- package/lib/components/LineChart/useLineChartStyles.styles.js +10 -3
- package/lib/components/LineChart/useLineChartStyles.styles.js.map +1 -1
- package/lib/components/LineChart/useLineChartStyles.styles.raw.js +14 -2
- package/lib/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
- package/lib/components/ScatterChart/ScatterChart.js +56 -37
- package/lib/components/ScatterChart/ScatterChart.js.map +1 -1
- package/lib/components/ScatterChart/ScatterChart.types.js.map +1 -1
- package/lib/components/ScatterChart/useScatterChartStyles.styles.js +21 -4
- package/lib/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
- package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js +16 -3
- package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.js +38 -14
- package/lib/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +2 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js +214 -96
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +2 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +2 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -1
- package/lib/types/DataPoint.js.map +1 -1
- package/lib/utilities/FocusableTooltipText.js.map +1 -1
- package/lib/utilities/utilities.js +41 -42
- package/lib/utilities/utilities.js.map +1 -1
- package/lib/utilities/vbc-utils.js +24 -0
- package/lib/utilities/vbc-utils.js.map +1 -1
- package/lib-commonjs/ChartTable.js +6 -0
- package/lib-commonjs/ChartTable.js.map +1 -0
- package/lib-commonjs/components/AreaChart/AreaChart.js +4 -1
- package/lib-commonjs/components/AreaChart/AreaChart.js.map +1 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js +2 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/ChartTable/ChartTable.js +69 -0
- package/lib-commonjs/components/ChartTable/ChartTable.js.map +1 -0
- package/lib-commonjs/components/ChartTable/ChartTable.types.js +6 -0
- package/lib-commonjs/components/ChartTable/ChartTable.types.js.map +1 -0
- package/lib-commonjs/components/ChartTable/index.js +8 -0
- package/lib-commonjs/components/ChartTable/index.js.map +1 -0
- package/lib-commonjs/components/ChartTable/useChartTableStyles.styles.js +196 -0
- package/lib-commonjs/components/ChartTable/useChartTableStyles.styles.js.map +1 -0
- package/lib-commonjs/components/ChartTable/useChartTableStyles.styles.raw.js +69 -0
- package/lib-commonjs/components/ChartTable/useChartTableStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CommonComponents/CartesianChart.js +169 -98
- package/lib-commonjs/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/ChartPopover.types.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js +13 -0
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js +12 -0
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +176 -100
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js +128 -0
- package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -0
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +909 -209
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.js +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.types.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib-commonjs/components/GanttChart/GanttChart.js.map +1 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js +2 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +183 -142
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +2 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js +174 -113
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.types.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +25 -5
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/Legends/Legends.js.map +1 -1
- package/lib-commonjs/components/Legends/OverflowMenu.js.map +1 -1
- package/lib-commonjs/components/LineChart/LineChart.js +250 -78
- package/lib-commonjs/components/LineChart/LineChart.js.map +1 -1
- package/lib-commonjs/components/LineChart/LineChart.types.js.map +1 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js +12 -3
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js +14 -2
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/ScatterChart.js +56 -37
- package/lib-commonjs/components/ScatterChart/ScatterChart.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/ScatterChart.types.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js +30 -3
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js +15 -2
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js +37 -13
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +2 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js +213 -95
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +2 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/index.js +1 -0
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/types/DataPoint.js.map +1 -1
- package/lib-commonjs/utilities/FocusableTooltipText.js.map +1 -1
- package/lib-commonjs/utilities/utilities.js +44 -41
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/lib-commonjs/utilities/vbc-utils.js +27 -0
- package/lib-commonjs/utilities/vbc-utils.js.map +1 -1
- package/package.json +10 -10
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/types/DataPoint.ts"],"sourcesContent":["import { SVGProps } from 'react';\nimport { LegendShape } from '../components/Legends/Legends.types';\nimport { CurveFactory } from 'd3-shape';\nimport { SankeyLink, SankeyNode } from 'd3-sankey';\n\nexport interface Basestate {\n _width?: number;\n _height?: number;\n activeLegend?: string;\n color?: string;\n dataForHoverCard?: number;\n isCalloutVisible: boolean;\n isLegendSelected?: boolean;\n isLegendHovered?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n refSelected?: any;\n YValueHover?: { legend?: string; y?: number; color?: string }[];\n hoverYValue?: string | number | null;\n hoverXValue?: string | number | null;\n xCalloutValue?: string;\n yCalloutValue?: string;\n lineColor?: string;\n hoveredLineColor?: string;\n selectedLegend?: string;\n containerWidth?: number;\n containerHeight?: number;\n}\n\nexport interface RefArrayData {\n index?: string;\n refElement?: SVGGElement;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface Margins {\n /**\n * left margin for the chart.\n */\n left?: number;\n /**\n * Right margin for the chart.\n */\n right?: number;\n /**\n * Top margin for the chart.\n */\n top?: number;\n /**\n * Bottom margin for the chart.\n */\n bottom?: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface DataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n */\n x: number | string;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n\n // NOTE: VerticalStackedBarChart, PieChart\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface VerticalStackedBarDataPoint extends Omit<DataPoint, 'x'> {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n * If data type on x is Date, then the data is spaced evenly by d3-scale.\n */\n x: number | string | Date;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface HorizontalDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n */\n x: number;\n\n /**\n * Total value of a single point bar chart.\n */\n total?: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface ChartDataPoint {\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * data the datapoint in the chart\n */\n data?: number;\n\n /**\n * data the datapoint in the chart\n */\n horizontalBarChartdata?: HorizontalDataPoint;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Color for the legend in the chart. If not provided, it will fallback on the default color palette.\n */\n color?: string;\n\n /**\n * placeholder data point\n */\n placeHolder?: boolean;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface VerticalBarChartDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n */\n x: number | string | Date;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * data to render the line along with bars\n */\n lineData?: LineDataInVerticalBarChart;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface HorizontalBarChartWithAxisDataPoint {\n /**\n * Dependent value of the data point, rendered along the x-axis.\n */\n x: number;\n\n /**\n * Independent value of the data point, rendered along the y-axis.\n * If y is a number, then each y-coordinate is plotted at its y-coordinate.\n * If y is a string, then the data is evenly spaced along the y-axis.\n */\n y: number | string;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineDataInVerticalBarChart {\n y: VerticalBarChartDataPoint['y'];\n yAxisCalloutData?: string | undefined;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n}\n\n/**\n * {@docCategory ChartData}\n */\ninterface BaseDataPoint {\n /**\n * Defines the function that is executed on clicking line\n */\n onDataPointClick?: () => void;\n\n /**\n * Callout data for x axis\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n */\n yAxisCalloutData?: string | { [id: string]: number };\n\n /**\n * Whether to hide callout data for the point.\n */\n hideCallout?: boolean;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n\n /**\n * X axis Accessibility data for callout\n */\n xAxisCalloutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineChartDataPoint extends BaseDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n */\n x: number | Date;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n}\n\n/**\n * {@docCategory ChartData}\n * ScatterChartDataPoint interface.\n */\nexport interface ScatterChartDataPoint extends BaseDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n */\n x: number | Date | string;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n\n /**\n * Marker size of the points\n */\n markerSize?: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineChartGap {\n /**\n * Starting index of the gap.\n */\n startIndex: number;\n\n /**\n * Ending index of the gap.\n */\n endIndex: number;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface LineChartLineOptions extends SVGProps<SVGPathElement> {\n /**\n * Width of the line/stroke.\n * Overrides the strokeWidth set on ICartesianChartProps level.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-width\n */\n strokeWidth?: number | string;\n\n /**\n * Pattern of dashes and gaps.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray\n */\n strokeDasharray?: string | number;\n\n /**\n * Offset on rendering of stroke dash array.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dashoffset\n */\n strokeDashoffset?: string | number;\n\n /**\n * Shape at the end of a subpath.\n * Default round.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linecap\n */\n strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit';\n\n /**\n * Width of border around the line. Default no border.\n */\n lineBorderWidth?: string | number;\n\n /**\n * Color of border around the line. Default white.\n */\n lineBorderColor?: string;\n\n /**\n * Defines the type of interpolation used to render the line.\n * @default 'linear'\n */\n curve?: 'linear' | 'natural' | 'step' | 'stepAfter' | 'stepBefore' | CurveFactory;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineChartPoints {\n /**\n * Legend text for the datapoint in the chart\n */\n legend: string;\n\n /**\n * The shape for the legend\n * default: show the rect legend\n */\n legendShape?: LegendShape;\n\n /**\n * dataPoints for the line chart\n */\n data: LineChartDataPoint[] | ScatterChartDataPoint[];\n\n /**\n * gaps in the line chart where a line is not drawn\n */\n gaps?: LineChartGap[];\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * opacity for chart fill color\n */\n opacity?: number;\n\n /**\n * options for the line drawn\n */\n lineOptions?: LineChartLineOptions;\n\n /**\n * hide dots for points that are not active\n */\n hideNonActiveDots?: boolean;\n\n /**\n * Defines the function that is executed on clicking this legend\n */\n onLegendClick?: (selectedLegend: string | null | string[]) => void;\n\n /**\n * Defines the function that is executed on clicking line\n */\n onLineClick?: () => void;\n\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface ChartProps {\n /**\n * chart title for the chart\n */\n chartTitle?: string;\n\n /**\n * Accessibility data for chart title\n */\n chartTitleAccessibilityData?: AccessibilityProps;\n /**\n * data for the points in the chart\n */\n chartData?: ChartDataPoint[];\n\n /**\n * Accessibility data for chart data\n */\n chartDataAccessibilityData?: AccessibilityProps;\n\n /**\n * data for the points in the line chart\n */\n lineChartData?: LineChartPoints[];\n\n /**\n * data for the points in the line chart\n */\n SankeyChartData?: SankeyChartData;\n\n /**\n * data for the points in the line chart\n */\n pointOptions?: SVGProps<SVGCircleElement>;\n\n /**\n * data for the dotted line on hovering the point\n */\n pointLineOptions?: SVGProps<SVGLineElement>;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface AccessibilityProps {\n /**\n * Accessibility aria-label\n */\n ariaLabel?: string;\n\n /**\n * Accessibility aria-labelledBy\n */\n ariaLabelledBy?: string;\n\n /**\n * Accessibility aria-describedBy\n */\n ariaDescribedBy?: string;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface VSChartDataPoint {\n /**\n * data the datapoint in the chart\n */\n data: number;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n\n /**\n * The prop used to define the culture to localized the numbers\n */\n culture?: string;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface VerticalStackedChartProps {\n /**\n * data for the points in the chart\n */\n chartData: VSChartDataPoint[];\n\n /**\n * Data for x axis label for multistacked Vertical bar chart\n */\n xAxisPoint: number | string | Date;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given, legend will take\n */\n xAxisCalloutData?: string;\n /**\n * line data to render lines on stacked bar chart\n */\n lineData?: LineDataInVerticalStackedBarChart[];\n /**\n * Accessibility data for Whole stack callout\n */\n stackCallOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineDataInVerticalStackedBarChart {\n y: number;\n color: string;\n legend: string;\n /**\n * The shape for the legend\n * default: show the rect legend\n */\n legendShape?: LegendShape;\n /**\n * Data to show in callout\n */\n data?: number;\n yAxisCalloutData?: string;\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n /**\n * options for the line drawn\n */\n lineOptions?: LineChartLineOptions;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface GVBarChartSeriesPoint {\n /**\n * Text for // need to check use of this\n */\n key: string;\n\n /**\n * Data for bar height of Grouped vertical bar chart\n */\n data: number;\n\n /**\n * Color for the legend in the chart\n */\n color: string;\n\n /**\n * Legend text in the chart\n */\n legend: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface GroupedVerticalBarChartData {\n /**\n * Data for X axis label\n */\n name: string;\n\n /**\n * Data points for Grouped vertical bar chart\n */\n series: GVBarChartSeriesPoint[];\n\n /**\n * Accessibility data for Group Bars Stack Callout\n */\n stackCallOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface GVDataPoint {\n /**\n * This interface used for - While forming datapoints from given prop \"data\" in code\n * datapoints are used for to draw graph\n */\n [key: string]: number | string;\n}\n\nexport interface GVSingleDataPoint {\n /**\n * While forming datapoints from given prop \"data\" in code.\n * These datapoints are used for to draw graph easily.\n */\n [key: string]: GVDataPoint;\n}\n\nexport interface GVForBarChart {\n /**\n * While forming datapoints from given prop \"data\"\n * These datapoints are used for to draw graph.\n */\n [key: string]: GVBarChartSeriesPoint;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface CustomizedCalloutDataPoint {\n legend: string;\n y: number;\n color: string;\n xAxisCalloutData?: string;\n yAxisCalloutData?: string | { [id: string]: number };\n}\n\n/**\n * Used for custom callout data interface. As Area chart callout data will be prepared from given props.data,\n * Those required data passing to onRenderCalloutPerDataPoint and onRenderCalloutPerStack.\n * {@docCategory ChartData}\n */\nexport interface CustomizedCalloutData {\n x: number | string | Date;\n values: CustomizedCalloutDataPoint[];\n}\n\n/**\n * {@docCategory Chart}\n */\nexport interface Chart {\n chartContainer: HTMLElement | null;\n toImage?: (opts?: ImageExportOptions) => Promise<string>;\n}\n\n/**\n * {@docCategory Chart}\n */\nexport interface ImageExportOptions {\n width?: number;\n height?: number;\n scale?: number;\n background?: string;\n}\n\nexport interface HeatMapChartDataPoint {\n x: string | Date | number;\n y: string | Date | number;\n value: number;\n /**\n * The value/ text to be rendered in the rectange\n */\n rectText?: string | number;\n /**\n * denomination to show in the callout\n */\n ratio?: [number, number];\n /**\n * description message to the callout\n */\n descriptionMessage?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface HeatMapChartData {\n /**\n * name of the legend\n */\n legend: string;\n data: HeatMapChartDataPoint[];\n /**\n * This number will be used to get the color for the legend\n */\n value: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface SankeyChartData {\n nodes: SNode[];\n links: SLink[];\n}\n\ninterface SNodeExtra {\n /**\n * A unique identifier for this node.\n */\n nodeId: number | string;\n /**\n * The display name for this node in the UX.\n */\n name: string;\n color?: string;\n borderColor?: string;\n actualValue?: number;\n layer?: number;\n}\n\ninterface SLinkExtra {\n /**\n * The index within `ISankeyChartData.nodes` of the source node.\n */\n source: number;\n /**\n * The index within `ISankeyChartData.nodes` of the target node.\n */\n target: number;\n /**\n * The weight of this link between the two nodes.\n */\n value: number;\n unnormalizedValue?: number;\n}\n\nexport type SNode = SankeyNode<SNodeExtra, SLinkExtra>;\nexport type SLink = SankeyLink<SNodeExtra, SLinkExtra>;\n\n/**\n * Specifies the ordering options for axis categories in Cartesian charts.\n *\n * - `'default'`: Uses the original order before custom ordering was supported.\n * In some charts, this behaves the same as `'data'`.\n * - `'data'`: Preserves the order of categories as provided in the input data.\n * - `string[]`: Explicitly defines the custom order of categories as an array of category names.\n * - `'category ascending' | 'category descending'`: Orders categories alphanumerically.\n * - `'total ascending' | 'total descending'`: Orders categories by the total of their associated values.\n * - `'min ascending' | 'min descending'`: Orders by the minimum value within each category.\n * - `'max ascending' | 'max descending'`: Orders by the maximum value within each category.\n * - `'sum ascending' | 'sum descending'`: Orders by the sum of values for each category (same as 'total').\n * - `'mean ascending' | 'mean descending'`: Orders by the average of values in each category.\n * - `'median ascending' | 'median descending'`: Orders by the median value of each category.\n *\n * {@docCategory CartesianChart}\n */\nexport type AxisCategoryOrder =\n | 'default'\n | 'data'\n | string[]\n | 'category ascending'\n | 'category descending'\n | 'total ascending'\n | 'total descending'\n | 'min ascending'\n | 'min descending'\n | 'max ascending'\n | 'max descending'\n | 'sum ascending'\n | 'sum descending'\n | 'mean ascending'\n | 'mean descending'\n | 'median ascending'\n | 'median descending';\n\n/**\n * {@docCategory IChartData}\n */\nexport interface GanttChartDataPoint {\n /**\n * Dependent value of the data point, rendered along the x-axis.\n */\n x: {\n start: Date | number;\n end: Date | number;\n };\n\n /**\n * Independent value of the data point, rendered along the y-axis.\n * If y is a number, then each y-coordinate is plotted at its y-coordinate.\n * If y is a string, then the data is evenly spaced along the y-axis.\n */\n y: number | string;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.\n * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.\n */\n gradient?: [string, string];\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n"],"names":[],"mappings":"AA+3BA;;CAEC,GACD,WAqDC"}
|
|
1
|
+
{"version":3,"sources":["../src/types/DataPoint.ts"],"sourcesContent":["import { SVGProps } from 'react';\nimport { LegendShape } from '../components/Legends/Legends.types';\nimport { CurveFactory } from 'd3-shape';\nimport { SankeyLink, SankeyNode } from 'd3-sankey';\n\nexport interface Basestate {\n _width?: number;\n _height?: number;\n activeLegend?: string;\n color?: string;\n dataForHoverCard?: number | string;\n isCalloutVisible: boolean;\n isLegendSelected?: boolean;\n isLegendHovered?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n refSelected?: any;\n YValueHover?: { legend?: string; y?: number | string; color?: string }[];\n hoverYValue?: string | number | null;\n hoverXValue?: string | number | null;\n xCalloutValue?: string;\n yCalloutValue?: string;\n lineColor?: string;\n hoveredLineColor?: string;\n selectedLegend?: string;\n containerWidth?: number;\n containerHeight?: number;\n}\n\nexport interface RefArrayData {\n index?: string;\n refElement?: SVGGElement;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface Margins {\n /**\n * left margin for the chart.\n */\n left?: number;\n /**\n * Right margin for the chart.\n */\n right?: number;\n /**\n * Top margin for the chart.\n */\n top?: number;\n /**\n * Bottom margin for the chart.\n */\n bottom?: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface DataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n */\n x: number | string;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n\n // NOTE: VerticalStackedBarChart, PieChart\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface VerticalStackedBarDataPoint extends Omit<DataPoint, 'x'> {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n * If data type on x is Date, then the data is spaced evenly by d3-scale.\n */\n x: number | string | Date;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface HorizontalDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n */\n x: number;\n\n /**\n * Total value of a single point bar chart.\n */\n total?: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface ChartDataPoint {\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * data the datapoint in the chart\n */\n data?: number;\n\n /**\n * data the datapoint in the chart\n */\n horizontalBarChartdata?: HorizontalDataPoint;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Color for the legend in the chart. If not provided, it will fallback on the default color palette.\n */\n color?: string;\n\n /**\n * placeholder data point\n */\n placeHolder?: boolean;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface VerticalBarChartDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n * If x is a number, then each y-coordinate is plotted at its x-coordinate.\n * If x is a string, then the data is evenly spaced along the x-axis.\n */\n x: number | string | Date;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * data to render the line along with bars\n */\n lineData?: LineDataInVerticalBarChart;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface HorizontalBarChartWithAxisDataPoint {\n /**\n * Dependent value of the data point, rendered along the x-axis.\n */\n x: number;\n\n /**\n * Independent value of the data point, rendered along the y-axis.\n * If y is a number, then each y-coordinate is plotted at its y-coordinate.\n * If y is a string, then the data is evenly spaced along the y-axis.\n */\n y: number | string;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineDataInVerticalBarChart {\n y: VerticalBarChartDataPoint['y'];\n yAxisCalloutData?: string | undefined;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n}\n\n/**\n * {@docCategory ChartData}\n */\ninterface BaseDataPoint {\n /**\n * Defines the function that is executed on clicking line\n */\n onDataPointClick?: () => void;\n\n /**\n * Callout data for x axis\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n */\n yAxisCalloutData?: string | { [id: string]: number };\n\n /**\n * Whether to hide callout data for the point.\n */\n hideCallout?: boolean;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n\n /**\n * X axis Accessibility data for callout\n */\n xAxisCalloutAccessibilityData?: AccessibilityProps;\n\n /**\n * Marker size of the points\n */\n markerSize?: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineChartDataPoint extends BaseDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n */\n x: number | Date;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n\n /**\n * text labels of marker points\n */\n text?: string;\n}\n\n/**\n * {@docCategory ChartData}\n * ScatterChartDataPoint interface.\n */\nexport interface ScatterChartDataPoint extends BaseDataPoint {\n /**\n * Independent value of the data point, rendered along the x-axis.\n */\n x: number | Date | string;\n\n /**\n * Dependent value of the data point, rendered along the y-axis.\n */\n y: number;\n\n /**\n * Marker size of the points\n */\n markerSize?: number;\n\n /**\n * text labels of marker points\n */\n text?: string;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineChartGap {\n /**\n * Starting index of the gap.\n */\n startIndex: number;\n\n /**\n * Ending index of the gap.\n */\n endIndex: number;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface LineChartLineOptions extends SVGProps<SVGPathElement> {\n /**\n * Width of the line/stroke.\n * Overrides the strokeWidth set on ICartesianChartProps level.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-width\n */\n strokeWidth?: number | string;\n\n /**\n * Pattern of dashes and gaps.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray\n */\n strokeDasharray?: string | number;\n\n /**\n * Offset on rendering of stroke dash array.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dashoffset\n */\n strokeDashoffset?: string | number;\n\n /**\n * Shape at the end of a subpath.\n * Default round.\n * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linecap\n */\n strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit';\n\n /**\n * Width of border around the line. Default no border.\n */\n lineBorderWidth?: string | number;\n\n /**\n * Color of border around the line. Default white.\n */\n lineBorderColor?: string;\n\n /**\n * Defines the type of interpolation used to render the line.\n * @default 'linear'\n */\n curve?: 'linear' | 'natural' | 'step' | 'stepAfter' | 'stepBefore' | CurveFactory;\n\n /**\n * Defines the mode of points to be rendered.\n */\n mode?:\n | 'lines'\n | 'markers'\n | 'text'\n | 'lines+markers'\n | 'text+markers'\n | 'text+lines'\n | 'text+lines+markers'\n | 'none'\n | 'gauge'\n | 'number'\n | 'delta'\n | 'number+delta'\n | 'gauge+number'\n | 'gauge+number+delta'\n | 'gauge+delta'\n | 'markers+text'\n | 'lines+text'\n | 'lines+markers+text';\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineChartPoints {\n /**\n * Legend text for the datapoint in the chart\n */\n legend: string;\n\n /**\n * The shape for the legend\n * default: show the rect legend\n */\n legendShape?: LegendShape;\n\n /**\n * dataPoints for the line chart\n */\n data: LineChartDataPoint[] | ScatterChartDataPoint[];\n\n /**\n * gaps in the line chart where a line is not drawn\n */\n gaps?: LineChartGap[];\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * opacity for chart fill color\n */\n opacity?: number;\n\n /**\n * options for the line drawn\n */\n lineOptions?: LineChartLineOptions;\n\n /**\n * hide dots for points that are not active\n */\n hideNonActiveDots?: boolean;\n\n /**\n * Defines the function that is executed on clicking this legend\n */\n onLegendClick?: (selectedLegend: string | null | string[]) => void;\n\n /**\n * Defines the function that is executed on clicking line\n */\n onLineClick?: () => void;\n\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface ChartProps {\n /**\n * chart title for the chart\n */\n chartTitle?: string;\n\n /**\n * Accessibility data for chart title\n */\n chartTitleAccessibilityData?: AccessibilityProps;\n /**\n * data for the points in the chart\n */\n chartData?: ChartDataPoint[];\n\n /**\n * Accessibility data for chart data\n */\n chartDataAccessibilityData?: AccessibilityProps;\n\n /**\n * data for the points in the line chart\n */\n lineChartData?: LineChartPoints[];\n\n /**\n * data for the points in the scatter chart\n */\n scatterChartData?: ScatterChartPoints[];\n\n /**\n * data for the points in the line chart\n */\n SankeyChartData?: SankeyChartData;\n\n /**\n * data for the points in the line chart\n */\n pointOptions?: SVGProps<SVGCircleElement>;\n\n /**\n * data for the dotted line on hovering the point\n */\n pointLineOptions?: SVGProps<SVGLineElement>;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface AccessibilityProps {\n /**\n * Accessibility aria-label\n */\n ariaLabel?: string;\n\n /**\n * Accessibility aria-labelledBy\n */\n ariaLabelledBy?: string;\n\n /**\n * Accessibility aria-describedBy\n */\n ariaDescribedBy?: string;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface VSChartDataPoint {\n /**\n * data the datapoint in the chart\n */\n data: number | string;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n\n /**\n * The prop used to define the culture to localized the numbers\n */\n culture?: string;\n}\n\n/**\n * {@docCategory ChartProps}\n */\nexport interface VerticalStackedChartProps {\n /**\n * data for the points in the chart\n */\n chartData: VSChartDataPoint[];\n\n /**\n * Data for x axis label for multistacked Vertical bar chart\n */\n xAxisPoint: number | string | Date;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given, legend will take\n */\n xAxisCalloutData?: string;\n /**\n * line data to render lines on stacked bar chart\n */\n lineData?: LineDataInVerticalStackedBarChart[];\n /**\n * Accessibility data for Whole stack callout\n */\n stackCallOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface LineDataInVerticalStackedBarChart {\n y: number | string;\n color: string;\n legend: string;\n /**\n * The shape for the legend\n * default: show the rect legend\n */\n legendShape?: LegendShape;\n /**\n * Data to show in callout\n */\n data?: number | string;\n yAxisCalloutData?: string;\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n /**\n * options for the line drawn\n */\n lineOptions?: LineChartLineOptions;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface GVBarChartSeriesPoint {\n /**\n * Text for // need to check use of this\n */\n key: string;\n\n /**\n * Data for bar height of Grouped vertical bar chart\n */\n data: number;\n\n /**\n * Color for the legend in the chart\n */\n color: string;\n\n /**\n * Legend text in the chart\n */\n legend: string;\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface GroupedVerticalBarChartData {\n /**\n * Data for X axis label\n */\n name: string;\n\n /**\n * Data points for Grouped vertical bar chart\n */\n series: GVBarChartSeriesPoint[];\n\n /**\n * Accessibility data for Group Bars Stack Callout\n */\n stackCallOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface GVDataPoint {\n /**\n * This interface used for - While forming datapoints from given prop \"data\" in code\n * datapoints are used for to draw graph\n */\n [key: string]: number | string;\n}\n\nexport interface GVSingleDataPoint {\n /**\n * While forming datapoints from given prop \"data\" in code.\n * These datapoints are used for to draw graph easily.\n */\n [key: string]: GVDataPoint;\n}\n\nexport interface GVForBarChart {\n /**\n * While forming datapoints from given prop \"data\"\n * These datapoints are used for to draw graph.\n */\n [key: string]: GVBarChartSeriesPoint;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface CustomizedCalloutDataPoint {\n legend: string;\n y: number;\n color: string;\n xAxisCalloutData?: string;\n yAxisCalloutData?: string | { [id: string]: number };\n}\n\n/**\n * Used for custom callout data interface. As Area chart callout data will be prepared from given props.data,\n * Those required data passing to onRenderCalloutPerDataPoint and onRenderCalloutPerStack.\n * {@docCategory ChartData}\n */\nexport interface CustomizedCalloutData {\n x: number | string | Date;\n values: CustomizedCalloutDataPoint[];\n}\n\n/**\n * {@docCategory Chart}\n */\nexport interface Chart {\n chartContainer: HTMLElement | null;\n toImage?: (opts?: ImageExportOptions) => Promise<string>;\n}\n\n/**\n * {@docCategory Chart}\n */\nexport interface ImageExportOptions {\n width?: number;\n height?: number;\n scale?: number;\n background?: string;\n}\n\nexport interface HeatMapChartDataPoint {\n x: string | Date | number;\n y: string | Date | number;\n value: number;\n /**\n * The value/ text to be rendered in the rectange\n */\n rectText?: string | number;\n /**\n * denomination to show in the callout\n */\n ratio?: [number, number];\n /**\n * description message to the callout\n */\n descriptionMessage?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface HeatMapChartData {\n /**\n * name of the legend\n */\n legend: string;\n data: HeatMapChartDataPoint[];\n /**\n * This number will be used to get the color for the legend\n */\n value: number;\n}\n\n/**\n * {@docCategory ChartData}\n */\nexport interface SankeyChartData {\n nodes: SNode[];\n links: SLink[];\n}\n\ninterface SNodeExtra {\n /**\n * A unique identifier for this node.\n */\n nodeId: number | string;\n /**\n * The display name for this node in the UX.\n */\n name: string;\n color?: string;\n borderColor?: string;\n actualValue?: number;\n layer?: number;\n}\n\ninterface SLinkExtra {\n /**\n * The index within `ISankeyChartData.nodes` of the source node.\n */\n source: number;\n /**\n * The index within `ISankeyChartData.nodes` of the target node.\n */\n target: number;\n /**\n * The weight of this link between the two nodes.\n */\n value: number;\n unnormalizedValue?: number;\n}\n\nexport type SNode = SankeyNode<SNodeExtra, SLinkExtra>;\nexport type SLink = SankeyLink<SNodeExtra, SLinkExtra>;\n\n/**\n * Specifies the ordering options for axis categories in Cartesian charts.\n *\n * - `'default'`: Uses the original order before custom ordering was supported.\n * In some charts, this behaves the same as `'data'`.\n * - `'data'`: Preserves the order of categories as provided in the input data.\n * - `string[]`: Explicitly defines the custom order of categories as an array of category names.\n * - `'category ascending' | 'category descending'`: Orders categories alphanumerically.\n * - `'total ascending' | 'total descending'`: Orders categories by the total of their associated values.\n * - `'min ascending' | 'min descending'`: Orders by the minimum value within each category.\n * - `'max ascending' | 'max descending'`: Orders by the maximum value within each category.\n * - `'sum ascending' | 'sum descending'`: Orders by the sum of values for each category (same as 'total').\n * - `'mean ascending' | 'mean descending'`: Orders by the average of values in each category.\n * - `'median ascending' | 'median descending'`: Orders by the median value of each category.\n *\n * {@docCategory CartesianChart}\n */\nexport type AxisCategoryOrder =\n | 'default'\n | 'data'\n | string[]\n | 'category ascending'\n | 'category descending'\n | 'total ascending'\n | 'total descending'\n | 'min ascending'\n | 'min descending'\n | 'max ascending'\n | 'max descending'\n | 'sum ascending'\n | 'sum descending'\n | 'mean ascending'\n | 'mean descending'\n | 'median ascending'\n | 'median descending';\n\n/**\n * {@docCategory IChartData}\n */\nexport interface GanttChartDataPoint {\n /**\n * Dependent value of the data point, rendered along the x-axis.\n */\n x: {\n start: Date | number;\n end: Date | number;\n };\n\n /**\n * Independent value of the data point, rendered along the y-axis.\n * If y is a number, then each y-coordinate is plotted at its y-coordinate.\n * If y is a string, then the data is evenly spaced along the y-axis.\n */\n y: number | string;\n\n /**\n * Legend text for the datapoint in the chart\n */\n legend?: string;\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.\n * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.\n */\n gradient?: [string, string];\n\n /**\n * Callout data for x axis\n * This is an optional prop, If haven't given legend will take\n */\n xAxisCalloutData?: string;\n\n /**\n * Callout data for y axis\n * This is an optional prop, If haven't given data will take\n */\n yAxisCalloutData?: string;\n\n /**\n * onClick action for each datapoint in the chart\n */\n onClick?: VoidFunction;\n\n /**\n * Accessibility data for callout\n */\n callOutAccessibilityData?: AccessibilityProps;\n}\n\n/**\n * {@docCategory IChartData}\n */\nexport interface ScatterChartPoints {\n /**\n * Legend text for the datapoint in the chart\n */\n legend: string;\n\n /**\n * The shape for the legend\n * default: show the rect legend\n */\n legendShape?: LegendShape;\n\n /**\n * dataPoints for the line chart\n */\n data: ScatterChartDataPoint[];\n\n /**\n * color for the legend in the chart\n */\n color?: string;\n\n /**\n * opacity for chart fill color\n */\n opacity?: number;\n\n /**\n * hide dots for points that are not active\n */\n hideNonActiveDots?: boolean;\n\n /**\n * Defines the function that is executed on clicking this legend\n */\n onLegendClick?: (selectedLegend: string | null | string[]) => void;\n\n /**\n * Whether to use the secondary y scale or not\n * False by default.\n */\n useSecondaryYScale?: boolean;\n}\n"],"names":[],"mappings":"AAo+BA;;CAEC,GACD,WA0CC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utilities/FocusableTooltipText.tsx"],"sourcesContent":["/* eslint-disable no-restricted-globals */\nimport * as React from 'react';\nimport { useCallback, useState, useEffect, useRef } from 'react';\nimport { Tooltip } from '@fluentui/react-tooltip';\nimport { hasOverflow } from './overflow-utils';\nimport { getAccessibleDataObject } from './index';\nimport { AccessibilityProps } from '../types/index';\nimport { Async } from './async-utils';\n\ninterface IFocusableTooltipTextProps {\n className?: string;\n content:\n | string\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n |
|
|
1
|
+
{"version":3,"sources":["../src/utilities/FocusableTooltipText.tsx"],"sourcesContent":["/* eslint-disable no-restricted-globals */\nimport * as React from 'react';\nimport { useCallback, useState, useEffect, useRef } from 'react';\nimport { Tooltip } from '@fluentui/react-tooltip';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { hasOverflow } from './overflow-utils';\nimport { getAccessibleDataObject } from './index';\nimport { AccessibilityProps } from '../types/index';\nimport { Async } from './async-utils';\n\ninterface IFocusableTooltipTextProps {\n className?: string;\n content:\n | string\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n | JSXElement\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n | JSXElement[];\n accessibilityData?: AccessibilityProps;\n}\n\nexport const FocusableTooltipText: React.FunctionComponent<IFocusableTooltipTextProps> = React.forwardRef<\n HTMLDivElement,\n IFocusableTooltipTextProps\n>((props, forwardedRef) => {\n const [textOverflow, setTextOverflow] = useState(false);\n const tooltipChild = useRef<HTMLSpanElement>(null);\n const async = useRef(new Async()).current;\n const resizeObserver = useRef<ResizeObserver>();\n\n const getTargetElement = useCallback((): HTMLElement | undefined => {\n if (!tooltipChild.current || !tooltipChild.current.parentElement) {\n return undefined;\n }\n return tooltipChild.current.parentElement;\n }, [tooltipChild]);\n\n const checkTextOverflow = useCallback(() => {\n const overflowElement = getTargetElement();\n const isTextOverflow = !!overflowElement && hasOverflow(overflowElement);\n if (isTextOverflow !== textOverflow) {\n setTextOverflow(isTextOverflow);\n }\n }, [getTargetElement, textOverflow, setTextOverflow]);\n\n useEffect(() => {\n checkTextOverflow();\n }, [checkTextOverflow]);\n\n useEffect(() => {\n // setup part executed only when the component mounts/updates\n const overflowElement = getTargetElement();\n if (window.ResizeObserver && overflowElement) {\n resizeObserver.current = new window.ResizeObserver(async.debounce(checkTextOverflow, 500));\n resizeObserver.current.observe(overflowElement);\n }\n // cleanup part executed only when the component unmounts\n return () => {\n resizeObserver.current?.disconnect();\n async.dispose();\n };\n }, [async, checkTextOverflow, getTargetElement]);\n\n return (\n <div className={props.className}>\n <Tooltip content={props.content} relationship=\"description\">\n <span {...getAccessibleDataObject(props.accessibilityData)} ref={tooltipChild} data-is-focusable={textOverflow}>\n {props.content}\n </span>\n </Tooltip>\n </div>\n );\n});\n"],"names":["React","useCallback","useState","useEffect","useRef","Tooltip","hasOverflow","getAccessibleDataObject","Async","FocusableTooltipText","forwardRef","props","forwardedRef","textOverflow","setTextOverflow","tooltipChild","async","current","resizeObserver","getTargetElement","parentElement","undefined","checkTextOverflow","overflowElement","isTextOverflow","window","ResizeObserver","debounce","observe","disconnect","dispose","div","className","content","relationship","span","accessibilityData","ref","data-is-focusable"],"mappings":"AAAA,wCAAwC,GACxC,YAAYA;;;;+BAoBCS;;;;;;;iEApBU,QAAQ;8BAEP,0BAA0B;+BAEtB,mBAAmB;uBACP,UAAU;4BAE5B,gBAAgB;AAa/B,6BAAMA,WAAAA,GAA4ET,OAAMU,UAAU,CAGvG,CAACC,OAAOC;IACR,MAAM,CAACC,cAAcC,gBAAgB,OAAGZ,eAAAA,EAAS;IACjD,MAAMa,mBAAeX,aAAAA,EAAwB;IAC7C,MAAMY,YAAQZ,aAAAA,EAAO,IAAII,iBAAAA,IAASS,OAAO;IACzC,MAAMC,qBAAiBd,aAAAA;IAEvB,MAAMe,uBAAmBlB,kBAAAA,EAAY;QACnC,IAAI,CAACc,aAAaE,OAAO,IAAI,CAACF,aAAaE,OAAO,CAACG,aAAa,EAAE;YAChE,OAAOC;QACT;QACA,OAAON,aAAaE,OAAO,CAACG,aAAa;IAC3C,GAAG;QAACL;KAAa;IAEjB,MAAMO,wBAAoBrB,kBAAAA,EAAY;QACpC,MAAMsB,kBAAkBJ;QACxB,MAAMK,iBAAiB,CAAC,CAACD,uBAAmBjB,0BAAAA,EAAYiB;QACxD,IAAIC,mBAAmBX,cAAc;YACnCC,gBAAgBU;QAClB;IACF,GAAG;QAACL;QAAkBN;QAAcC;KAAgB;QAEpDX,gBAAAA,EAAU;QACRmB;IACF,GAAG;QAACA;KAAkB;QAEtBnB,gBAAAA,EAAU;QACR,6DAA6D;QAC7D,MAAMoB,kBAAkBJ;QACxB,IAAIM,OAAOC,cAAc,IAAIH,iBAAiB;YAC5CL,eAAeD,OAAO,GAAG,IAAIQ,OAAOC,cAAc,CAACV,MAAMW,QAAQ,CAACL,mBAAmB;YACrFJ,eAAeD,OAAO,CAACW,OAAO,CAACL;QACjC;QACA,yDAAyD;QACzD,OAAO;gBACLL;aAAAA,0BAAAA,eAAeD,OAAAA,AAAO,MAAA,QAAtBC,4BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,wBAAwBW,UAAU;YAClCb,MAAMc,OAAO;QACf;IACF,GAAG;QAACd;QAAOM;QAAmBH;KAAiB;IAE/C,OAAA,WAAA,GACE,OAAA,aAAA,CAACY,OAAAA;QAAIC,WAAWrB,MAAMqB,SAAS;qBAC7B,OAAA,aAAA,CAAC3B,qBAAAA,EAAAA;QAAQ4B,SAAStB,MAAMsB,OAAO;QAAEC,cAAa;qBAC5C,OAAA,aAAA,CAACC,QAAAA;QAAM,OAAG5B,8BAAAA,EAAwBI,MAAMyB,iBAAiB,CAAC;QAAEC,KAAKtB;QAAcuB,qBAAmBzB;OAC/FF,MAAMsB,OAAO;AAKxB,GAAG"}
|
|
@@ -15,6 +15,9 @@ _export(exports, {
|
|
|
15
15
|
CustomPoints: function() {
|
|
16
16
|
return CustomPoints;
|
|
17
17
|
},
|
|
18
|
+
DEFAULT_WRAP_WIDTH: function() {
|
|
19
|
+
return DEFAULT_WRAP_WIDTH;
|
|
20
|
+
},
|
|
18
21
|
HighContrastSelector: function() {
|
|
19
22
|
return HighContrastSelector;
|
|
20
23
|
},
|
|
@@ -27,6 +30,9 @@ _export(exports, {
|
|
|
27
30
|
MIN_DOMAIN_MARGIN: function() {
|
|
28
31
|
return MIN_DOMAIN_MARGIN;
|
|
29
32
|
},
|
|
33
|
+
MIN_DONUT_RADIUS: function() {
|
|
34
|
+
return MIN_DONUT_RADIUS;
|
|
35
|
+
},
|
|
30
36
|
Points: function() {
|
|
31
37
|
return Points;
|
|
32
38
|
},
|
|
@@ -210,6 +216,7 @@ const _d3shape = require("d3-shape");
|
|
|
210
216
|
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
|
|
211
217
|
const _chartutilities = require("@fluentui/chart-utilities");
|
|
212
218
|
const MIN_DOMAIN_MARGIN = 8;
|
|
219
|
+
const MIN_DONUT_RADIUS = 1;
|
|
213
220
|
var ChartTypes = /*#__PURE__*/ function(ChartTypes) {
|
|
214
221
|
ChartTypes[ChartTypes["AreaChart"] = 0] = "AreaChart";
|
|
215
222
|
ChartTypes[ChartTypes["LineChart"] = 1] = "LineChart";
|
|
@@ -255,7 +262,7 @@ function defaultYAxisTickFormatter(value) {
|
|
|
255
262
|
return yAxisTickFormatterInternal(value);
|
|
256
263
|
}
|
|
257
264
|
function createNumericXAxis(xAxisParams, tickParams, chartType, culture) {
|
|
258
|
-
const { domainNRangeValues, showRoundOffXTickValues = false, xAxistickSize = 6, tickPadding = 10, xAxisCount, xAxisElement, hideTickOverlap } = xAxisParams;
|
|
265
|
+
const { domainNRangeValues, showRoundOffXTickValues = false, xAxistickSize = 6, tickPadding = 10, xAxisCount, xAxisElement, hideTickOverlap, calcMaxLabelWidth } = xAxisParams;
|
|
259
266
|
const xAxisScale = (0, _d3scale.scaleLinear)().domain([
|
|
260
267
|
domainNRangeValues.dStartValue,
|
|
261
268
|
domainNRangeValues.dEndValue
|
|
@@ -273,7 +280,7 @@ function createNumericXAxis(xAxisParams, tickParams, chartType, culture) {
|
|
|
273
280
|
return (0, _chartutilities.formatToLocaleString)(xAxisValue, culture);
|
|
274
281
|
};
|
|
275
282
|
if (hideTickOverlap && typeof xAxisCount === 'undefined') {
|
|
276
|
-
const longestLabelWidth =
|
|
283
|
+
const longestLabelWidth = calcMaxLabelWidth(xAxisScale.ticks().map(tickFormat)) + 20;
|
|
277
284
|
const [start, end] = xAxisScale.range();
|
|
278
285
|
tickCount = Math.min(Math.max(1, Math.floor(Math.abs(end - start) / longestLabelWidth)), 10);
|
|
279
286
|
}
|
|
@@ -482,7 +489,7 @@ function getDateFormatLevel(date, useUTC) {
|
|
|
482
489
|
return (_matchedFormat_formatLevel = matchedFormat === null || matchedFormat === void 0 ? void 0 : matchedFormat.formatLevel) !== null && _matchedFormat_formatLevel !== void 0 ? _matchedFormat_formatLevel : 7;
|
|
483
490
|
}
|
|
484
491
|
function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLocale, customDateTimeFormatter, useUTC, chartType) {
|
|
485
|
-
const { domainNRangeValues, xAxisElement, tickPadding = 6, xAxistickSize = 6, xAxisCount } = xAxisParams;
|
|
492
|
+
const { domainNRangeValues, xAxisElement, tickPadding = 6, xAxistickSize = 6, xAxisCount, calcMaxLabelWidth } = xAxisParams;
|
|
486
493
|
const isUtcSet = useUTC === true || useUTC === 'utc';
|
|
487
494
|
const xAxisScale = isUtcSet ? (0, _d3scale.scaleUtc)() : (0, _d3scale.scaleTime)();
|
|
488
495
|
xAxisScale.domain([
|
|
@@ -523,7 +530,7 @@ function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLo
|
|
|
523
530
|
}
|
|
524
531
|
return (0, _chartutilities.formatDateToLocaleString)(domainValue, culture, useUTC ? true : false, false, formatOptions);
|
|
525
532
|
};
|
|
526
|
-
const longestLabelWidth =
|
|
533
|
+
const longestLabelWidth = calcMaxLabelWidth(xAxisScale.ticks().map(tickFormat)) + 40;
|
|
527
534
|
const [start, end] = xAxisScale.range();
|
|
528
535
|
const maxPossibleTickCount = Math.min(Math.max(1, Math.floor(Math.abs(end - start) / longestLabelWidth)), 10);
|
|
529
536
|
tickCount = Math.min(maxPossibleTickCount, xAxisCount !== null && xAxisCount !== void 0 ? xAxisCount : tickCount);
|
|
@@ -545,7 +552,7 @@ function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLo
|
|
|
545
552
|
};
|
|
546
553
|
}
|
|
547
554
|
function createStringXAxis(xAxisParams, tickParams, dataset, culture) {
|
|
548
|
-
const { domainNRangeValues, xAxistickSize = 6, tickPadding = 10, xAxisPadding = 0.1, xAxisInnerPadding, xAxisOuterPadding, containerWidth, hideTickOverlap } = xAxisParams;
|
|
555
|
+
const { domainNRangeValues, xAxistickSize = 6, tickPadding = 10, xAxisPadding = 0.1, xAxisInnerPadding, xAxisOuterPadding, containerWidth, hideTickOverlap, calcMaxLabelWidth } = xAxisParams;
|
|
549
556
|
const xAxisScale = (0, _d3scale.scaleBand)().domain(dataset).range([
|
|
550
557
|
domainNRangeValues.rStartValue,
|
|
551
558
|
domainNRangeValues.rEndValue
|
|
@@ -557,9 +564,9 @@ function createStringXAxis(xAxisParams, tickParams, dataset, culture) {
|
|
|
557
564
|
};
|
|
558
565
|
if (hideTickOverlap) {
|
|
559
566
|
let nonOverlappingTickValues = [];
|
|
560
|
-
const tickSizes = tickValues.map((value
|
|
561
|
-
|
|
562
|
-
]
|
|
567
|
+
const tickSizes = tickValues.map((value)=>calcMaxLabelWidth([
|
|
568
|
+
value
|
|
569
|
+
]));
|
|
563
570
|
// for LTR
|
|
564
571
|
let start = 0;
|
|
565
572
|
let end = containerWidth;
|
|
@@ -719,14 +726,20 @@ const createStringYAxisForHorizontalBarChartWithAxis = (yAxisParams, dataPoints,
|
|
|
719
726
|
yAxisElement ? (0, _d3selection.select)(yAxisElement).call(yAxis).selectAll('text') : '';
|
|
720
727
|
return yAxisScale;
|
|
721
728
|
};
|
|
722
|
-
const createStringYAxis = (yAxisParams, dataPoints, isRtl)=>{
|
|
723
|
-
const { containerHeight, tickPadding = 12, margins, yAxisTickFormat, yAxisElement, yAxisPadding = 0 } = yAxisParams;
|
|
729
|
+
const createStringYAxis = (yAxisParams, dataPoints, isRtl, barWidth, chartType)=>{
|
|
730
|
+
const { containerHeight, tickPadding = 12, margins, yAxisTickFormat, yAxisElement, yAxisPadding = 0, containerWidth } = yAxisParams;
|
|
724
731
|
const yAxisScale = (0, _d3scale.scaleBand)().domain(dataPoints).range([
|
|
725
732
|
containerHeight - margins.bottom,
|
|
726
733
|
margins.top
|
|
727
734
|
]).padding(yAxisPadding);
|
|
735
|
+
if (chartType === 3) {
|
|
736
|
+
yAxisScale.paddingInner(1).paddingOuter(0);
|
|
737
|
+
}
|
|
728
738
|
const axis = isRtl ? (0, _d3axis.axisRight)(yAxisScale) : (0, _d3axis.axisLeft)(yAxisScale);
|
|
729
739
|
const yAxis = axis.tickPadding(tickPadding).tickValues(dataPoints).tickSize(0);
|
|
740
|
+
if (chartType === 3) {
|
|
741
|
+
axis.tickSizeInner(-(containerWidth - margins.left - margins.right));
|
|
742
|
+
}
|
|
730
743
|
if (yAxisTickFormat) {
|
|
731
744
|
yAxis.tickFormat(yAxisTickFormat);
|
|
732
745
|
}
|
|
@@ -747,6 +760,7 @@ function calloutData(values) {
|
|
|
747
760
|
combinedResult = combinedResult.concat(elements);
|
|
748
761
|
});
|
|
749
762
|
const xValToDataPoints = {};
|
|
763
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
750
764
|
combinedResult.forEach((ele)=>{
|
|
751
765
|
const xValue = ele.x instanceof Date ? ele.x.getTime() : ele.x;
|
|
752
766
|
if (xValue in xValToDataPoints) {
|
|
@@ -800,22 +814,21 @@ function silceOrAppendToArray(array, value) {
|
|
|
800
814
|
return array.slice(0, pos).concat(array.slice(pos + 1));
|
|
801
815
|
}
|
|
802
816
|
}
|
|
817
|
+
const DEFAULT_WRAP_WIDTH = 10;
|
|
803
818
|
function createWrapOfXLabels(wrapLabelProps) {
|
|
804
|
-
const { node, xAxis, noOfCharsToTruncate, showXAxisLablesTooltip } = wrapLabelProps;
|
|
819
|
+
const { node, xAxis, noOfCharsToTruncate, showXAxisLablesTooltip, width = DEFAULT_WRAP_WIDTH } = wrapLabelProps;
|
|
805
820
|
if (node === null) {
|
|
806
821
|
return;
|
|
807
822
|
}
|
|
808
823
|
const axisNode = (0, _d3selection.select)(node).call(xAxis);
|
|
809
824
|
let removeVal = 0;
|
|
810
|
-
|
|
811
|
-
const arr = [];
|
|
825
|
+
let maxLines = 1;
|
|
812
826
|
axisNode.selectAll('.tick text').each(function() {
|
|
813
827
|
const text = (0, _d3selection.select)(this);
|
|
814
828
|
const totalWord = text.text();
|
|
815
829
|
const truncatedWord = `${text.text().slice(0, noOfCharsToTruncate)}...`;
|
|
816
830
|
const totalWordLength = text.text().length;
|
|
817
831
|
const words = text.text().split(/\s+/).reverse();
|
|
818
|
-
arr.push(words.length);
|
|
819
832
|
let word = '';
|
|
820
833
|
let line = [];
|
|
821
834
|
let lineNumber = 0;
|
|
@@ -824,9 +837,9 @@ function createWrapOfXLabels(wrapLabelProps) {
|
|
|
824
837
|
const dy = parseFloat(text.attr('dy'));
|
|
825
838
|
let tspan = text.text(null).append('tspan').attr('x', 0).attr('y', y).attr('id', 'BaseSpan').attr('dy', dy + 'em').attr('data-', totalWord);
|
|
826
839
|
if (showXAxisLablesTooltip && totalWordLength > noOfCharsToTruncate) {
|
|
827
|
-
tspan = text.append('tspan').attr('id', 'showDots').attr('x', 0).attr('y', y).attr('dy',
|
|
840
|
+
tspan = text.append('tspan').attr('id', 'showDots').attr('x', 0).attr('y', y).attr('dy', dy + 'em').text(truncatedWord);
|
|
828
841
|
} else if (showXAxisLablesTooltip && totalWordLength <= noOfCharsToTruncate) {
|
|
829
|
-
tspan = text.append('tspan').attr('id', 'LessLength').attr('x', 0).attr('y', y).attr('dy',
|
|
842
|
+
tspan = text.append('tspan').attr('id', 'LessLength').attr('x', 0).attr('y', y).attr('dy', dy + 'em').text(totalWord);
|
|
830
843
|
} else {
|
|
831
844
|
while(word = words.pop()){
|
|
832
845
|
line.push(word);
|
|
@@ -840,30 +853,20 @@ function createWrapOfXLabels(wrapLabelProps) {
|
|
|
840
853
|
tspan = text.append('tspan').attr('id', 'WordBreakId').attr('x', 0).attr('y', y).attr('dy', ++lineNumber * lineHeight + dy + 'em').text(word);
|
|
841
854
|
}
|
|
842
855
|
}
|
|
843
|
-
const maxDigit = Math.max(...arr);
|
|
844
|
-
let maxHeight = 12; // intial value to render corretly first time
|
|
845
|
-
axisNode.selectAll('text').each(()=>{
|
|
846
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
847
|
-
const outerHTMLElement = document.getElementById('WordBreakId');
|
|
848
|
-
const BoxCordinates = outerHTMLElement && outerHTMLElement.getBoundingClientRect();
|
|
849
|
-
const boxHeight = BoxCordinates && BoxCordinates.height;
|
|
850
|
-
if (boxHeight > maxHeight) {
|
|
851
|
-
maxHeight = boxHeight;
|
|
852
|
-
}
|
|
853
|
-
});
|
|
854
|
-
// If we take directly maxDigit * maxheight, then it will show more height between x axis tick values and bottom.
|
|
855
|
-
// To avoid this, reducing maxDigit value by removing some digit based on legth of word.
|
|
856
|
-
let removeDigit = 4;
|
|
857
|
-
if (maxDigit <= 2) {
|
|
858
|
-
removeDigit = 1;
|
|
859
|
-
} else if (maxDigit > 2 && maxDigit <= 6) {
|
|
860
|
-
removeDigit = 2;
|
|
861
|
-
} else if (maxDigit > 6 && maxDigit <= 9) {
|
|
862
|
-
removeDigit = 3;
|
|
863
|
-
}
|
|
864
|
-
removeVal = (maxDigit - removeDigit) * maxHeight;
|
|
865
856
|
}
|
|
857
|
+
maxLines = Math.max(maxLines, lineNumber + 1);
|
|
866
858
|
});
|
|
859
|
+
if (!showXAxisLablesTooltip) {
|
|
860
|
+
let maxHeight = 12; // intial value to render corretly first time
|
|
861
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
862
|
+
const outerHTMLElement = document.getElementById('WordBreakId');
|
|
863
|
+
const BoxCordinates = outerHTMLElement && outerHTMLElement.getBoundingClientRect();
|
|
864
|
+
const boxHeight = BoxCordinates && BoxCordinates.height;
|
|
865
|
+
if (boxHeight > maxHeight) {
|
|
866
|
+
maxHeight = boxHeight;
|
|
867
|
+
}
|
|
868
|
+
removeVal = (maxLines - 1) * maxHeight;
|
|
869
|
+
}
|
|
867
870
|
return removeVal > 0 ? removeVal : 0;
|
|
868
871
|
}
|
|
869
872
|
function createYAxisLabels(node, yAxis, noOfCharsToTruncate, truncateLabel, isRtl) {
|
|
@@ -877,7 +880,7 @@ function createYAxisLabels(node, yAxis, noOfCharsToTruncate, truncateLabel, isRt
|
|
|
877
880
|
const totalWord = text.text();
|
|
878
881
|
const truncatedWord = isRtl ? `...${text.text().slice(0, noOfCharsToTruncate)}` : `${text.text().slice(0, noOfCharsToTruncate)}...`;
|
|
879
882
|
const totalWordLength = text.text().length;
|
|
880
|
-
const padding =
|
|
883
|
+
const padding = 0; // ems
|
|
881
884
|
const y = text.attr('y');
|
|
882
885
|
const x = text.attr('x');
|
|
883
886
|
const dy = parseFloat(text.attr('dy'));
|
|
@@ -885,9 +888,9 @@ function createYAxisLabels(node, yAxis, noOfCharsToTruncate, truncateLabel, isRt
|
|
|
885
888
|
const uid = tickIndex++;
|
|
886
889
|
text.text(null).append('tspan').attr('x', x).attr('y', y).attr('id', `BaseSpan-${uid}`).attr('dy', dy + 'em').attr('data-', totalWord);
|
|
887
890
|
if (truncateLabel && totalWordLength > noOfCharsToTruncate) {
|
|
888
|
-
text.append('tspan').attr('id', `showDots-${uid}`).attr('x',
|
|
891
|
+
text.append('tspan').attr('id', `showDots-${uid}`).attr('x', x).attr('y', y).attr('dy', dy + 'em').attr('dx', padding + dx + 'em').text(truncatedWord);
|
|
889
892
|
} else {
|
|
890
|
-
text.
|
|
893
|
+
text.append('tspan').attr('id', `LessLength-${uid}`).attr('x', x).attr('y', y).attr('dx', padding + dx + 'em').text(totalWord);
|
|
891
894
|
}
|
|
892
895
|
});
|
|
893
896
|
}
|