@fluentui/react-charts 0.0.0-nightly-20251105-0406.1 → 0.0.0-nightly-20251107-0407.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +31 -13
- package/dist/index.d.ts +2 -2
- package/lib/components/ChartTable/ChartTable.js +3 -1
- package/lib/components/ChartTable/ChartTable.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.js +25 -21
- package/lib/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js +8 -4
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +34 -17
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.js +12 -7
- package/lib/components/DonutChart/DonutChart.js.map +1 -1
- package/lib/components/FunnelChart/FunnelChart.js +5 -5
- package/lib/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib/components/GaugeChart/GaugeChart.js +3 -1
- package/lib/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib/components/HeatMapChart/HeatMapChart.js +5 -5
- package/lib/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.js +3 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib/components/Legends/Legends.js +3 -1
- package/lib/components/Legends/Legends.js.map +1 -1
- package/lib/components/Legends/Legends.types.js.map +1 -1
- package/lib/components/LineChart/LineChart.js +5 -4
- package/lib/components/LineChart/LineChart.js.map +1 -1
- package/lib/components/LineChart/eventAnnotation/Textbox.js.map +1 -1
- package/lib/components/ResponsiveContainer/ResponsiveContainer.js +1 -1
- package/lib/components/ResponsiveContainer/ResponsiveContainer.js.map +1 -1
- package/lib/components/SankeyChart/SankeyChart.js +1 -1
- package/lib/components/SankeyChart/SankeyChart.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.js +3 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js +12 -4
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib/utilities/FocusableTooltipText.js +1 -1
- package/lib/utilities/FocusableTooltipText.js.map +1 -1
- package/lib/utilities/SVGTooltipText.js +8 -8
- package/lib/utilities/SVGTooltipText.js.map +1 -1
- package/lib-commonjs/components/ChartTable/ChartTable.js +3 -1
- package/lib-commonjs/components/ChartTable/ChartTable.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.js +25 -21
- 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/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.js +12 -7
- package/lib-commonjs/components/DonutChart/DonutChart.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/FunnelChart.js +5 -5
- package/lib-commonjs/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/GaugeChart.js +3 -1
- package/lib-commonjs/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js +5 -5
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js +3 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib-commonjs/components/Legends/Legends.js +3 -1
- package/lib-commonjs/components/Legends/Legends.js.map +1 -1
- package/lib-commonjs/components/Legends/Legends.types.js.map +1 -1
- package/lib-commonjs/components/LineChart/LineChart.js +5 -4
- package/lib-commonjs/components/LineChart/LineChart.js.map +1 -1
- package/lib-commonjs/components/LineChart/eventAnnotation/Textbox.js.map +1 -1
- package/lib-commonjs/components/ResponsiveContainer/ResponsiveContainer.js +1 -1
- package/lib-commonjs/components/ResponsiveContainer/ResponsiveContainer.js.map +1 -1
- package/lib-commonjs/components/SankeyChart/SankeyChart.js +1 -1
- package/lib-commonjs/components/SankeyChart/SankeyChart.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js +3 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js +12 -4
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib-commonjs/utilities/FocusableTooltipText.js +1 -1
- package/lib-commonjs/utilities/FocusableTooltipText.js.map +1 -1
- package/lib-commonjs/utilities/SVGTooltipText.js +8 -8
- package/lib-commonjs/utilities/SVGTooltipText.js.map +1 -1
- package/package.json +12 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { LegendsProps } from '../Legends/index';\nimport {\n AccessibilityProps,\n Chart,\n Margins,\n DataPoint,\n HorizontalBarChartWithAxisDataPoint,\n GroupedVerticalBarChartData,\n HeatMapChartDataPoint,\n LineChartPoints,\n VerticalBarChartDataPoint,\n VerticalStackedBarDataPoint,\n ScatterChartPoints,\n GanttChartDataPoint,\n AxisCategoryOrder,\n AxisProps,\n AxisScaleType,\n} from '../../types/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\nimport { ChartTypes, IAxisData, IDomainNRange, IYAxisParams, XAxisTypes, YAxisType } from '../../utilities/utilities';\nimport { ScaleBand, ScaleLinear } from 'd3-scale';\n/**\n * Cartesian Chart style properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyleProps {\n /**\n * Additional CSS class(es) to apply to the Chart.\n */\n className?: string;\n\n /**\n * Width of the chart.\n */\n width?: number;\n\n /**\n * Height of the chart.\n */\n height?: number;\n\n /**\n * Color of the chart.\n */\n color?: string;\n\n /**\n * Link to redirect if click action for graph\n */\n href?: string;\n\n /**\n * prop to check if the chart is selected or hovered upon to determine opacity\n */\n shouldHighlight?: boolean;\n\n /**\n * prop to check if the Page is in Rtl\n */\n useRtl?: boolean;\n\n /**\n * color of the line\n */\n lineColor?: string;\n\n /**\n * boolean flag which determines if shape is drawn in callout\n */\n toDrawShape?: boolean;\n\n /**\n * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n * @deprecated Use `reflowProps` instead.\n */\n enableReflow?: boolean;\n}\n\n/**\n * Cartesian Chart styles\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyles {\n /**\n * Style for the root element.\n */\n root?: string;\n\n /**\n * Style for the element containing the x-axis.\n */\n xAxis?: string;\n\n /**\n * Style for the element containing the y-axis.\n */\n yAxis?: string;\n\n /**\n * Style for legend container\n */\n legendContainer?: string;\n\n /**\n * line hover box css\n */\n hover?: string;\n\n /**\n * styles for description message\n */\n descriptionMessage?: string;\n\n /**\n * styles for tooltip\n */\n tooltip?: string;\n\n /**\n * styles for axis title\n */\n axisTitle?: string;\n\n /**\n * styles for axis annotation\n */\n axisAnnotation?: string;\n\n /**\n * Style for the chart Title.\n */\n chartTitle?: string;\n\n /**\n * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n */\n opacityChangeOnHover?: string;\n\n /**\n * styles for the shape object in the callout\n */\n shapeStyles?: string;\n\n /**\n * Styles for the chart wrapper div\n */\n chartWrapper?: string;\n\n /**\n * Styles for the svg tooltip\n */\n svgTooltip?: string;\n\n /**\n * Styles for the chart svg element\n */\n chart?: string;\n}\n\n/**\n * Cartesian Chart properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartProps {\n /**\n * Below height used for resizing of the chart\n * Wrap chart in your container and send the updated height and width to these props.\n * These values decide wheather chart re render or not. Please check examples for reference\n */\n height?: number;\n\n /**\n * Below width used for resizing of the chart\n * Wrap chart in your container and send the updated height and width to these props.\n * These values decide wheather chart re render or not. Please check examples for reference\n */\n width?: number;\n\n /**\n * this prop takes its parent as a HTML element to define the width and height of the chart\n */\n parentRef?: HTMLElement | null;\n\n /**\n * Additional CSS class(es) to apply to the Chart.\n */\n className?: string;\n\n /**\n * Margins for the chart\n * @default `{ top: 20, bottom: 35, left: 40, right: 20 }`\n * To avoid edge cuttings to the chart, we recommend you use default values or greater then default values\n */\n margins?: Margins;\n\n /** decides wether to show/hide legends\n * @defaultvalue false\n */\n hideLegend?: boolean;\n\n /**\n * Do not show tooltips in chart\n * @default false\n */\n hideTooltip?: boolean;\n\n /**\n * this prop takes values that you want the chart to render on x-axis\n * This is a optional parameter if not specified D3 will decide which values appear on the x-axis for you\n * Please look at https://github.com/d3/d3-scale for more information on how D3 decides what data to appear on the axis of chart\n */\n tickValues?: number[] | Date[] | string[] | undefined;\n\n /**\n * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'\n * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis\n * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.\n */\n tickFormat?: string;\n\n /**\n * Width of line stroke\n */\n strokeWidth?: number;\n\n /**\n * x Axis labels tick padding. This defines the gap between tick labels and tick lines.\n * @default 10\n */\n xAxisTickPadding?: number;\n\n /**\n * the format in for the data on y-axis. For data object this can be specified to your requirement.\n * Eg: d3.format(\".0%\")(0.123),d3.format(\"+20\")(42);\n * Please look at https://github.com/d3/d3-format for all the formats supported\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n yAxisTickFormat?: any;\n\n /**\n * Secondary y-scale options\n * By default this is not defined, meaning there will be no secondary y-scale.\n */\n secondaryYScaleOptions?: {\n /** Minimum value (0 by default) */\n yMinValue?: number;\n /** Maximum value (100 by default) */\n yMaxValue?: number;\n };\n\n /**\n * minimum data value point in y-axis\n */\n yMinValue?: number;\n\n /**\n * maximum data value point in y-axis\n */\n yMaxValue?: number;\n\n /**\n * maximum data value point in x-axis\n */\n xMaxValue?: number;\n\n /**\n * Number of ticks on the y-axis.\n * Tick count should be factor of difference between (yMinValue, yMaxValue)?\n * @default 4\n */\n yAxisTickCount?: number;\n\n /**\n * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.\n * Does not work for string axis.\n * @default 6\n */\n xAxisTickCount?: number;\n\n /**\n * define the size of the tick lines on the x-axis\n * @default 10\n */\n xAxistickSize?: number;\n\n /**\n * defines the space between the tick line and the data label\n * @default 10\n */\n tickPadding?: number;\n\n /**\n * Url that the data-viz needs to redirect to upon clicking on it\n */\n href?: string;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n legendsOverflowText?: any;\n\n /**\n * Enable the legends to wrap lines if there is not enough space to show all legends on a single line\n */\n enabledLegendsWrapLines?: boolean;\n\n /*\n * props for the legends in the chart\n */\n legendProps?: Partial<LegendsProps>;\n\n /**\n *@default false\n *Used for to elipse x axis labes and show tooltip on x axis labels\n */\n showXAxisLablesTooltip?: boolean;\n\n /**\n * @default 4\n * Used for X axis labels\n * While Giving showXAxisLablesTooltip prop, need to define after how many chars, we need to truncate the word.\n */\n noOfCharsToTruncate?: number;\n\n /**\n * @default false\n * Used to wrap x axis labels values (whole value)\n */\n wrapXAxisLables?: boolean;\n\n /**\n * @default false\n * Used to rotate x axis labels by 45 degrees\n */\n rotateXAxisLables?: boolean;\n\n /**\n * The prop used to define the date time localization options\n */\n dateLocalizeOptions?: Intl.DateTimeFormatOptions;\n\n /**\n * The prop used to define a custom locale for the date time format.\n */\n timeFormatLocale?: TimeLocaleDefinition;\n\n /**\n * The prop used to define a custom datetime formatter for date axis.\n */\n customDateTimeFormatter?: (dateTime: Date) => string;\n\n /**\n * Call to provide customized styling that will layer on top of the variant rules.\n */\n styles?: CartesianChartStyles;\n\n /**\n * Callout customization props\n */\n calloutProps?: Partial<ChartPopoverProps>;\n\n /**\n * props for the svg; use this to include aria-* or other attributes on the tag\n */\n svgProps?: React.SVGProps<SVGSVGElement>;\n\n /**\n * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n * @deprecated Use `reflowProps` instead.\n */\n enableReflow?: boolean;\n\n /**\n * Props related to reflow behavior of the chart\n */\n reflowProps?: {\n /**\n * Determines the reflow behavior of the chart.\n * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.\n * @default 'none'\n */\n mode: 'none' | 'min-width';\n };\n\n /**\n * Prop to set the x axis title\n * @default undefined\n * Minimum bottom margin required for x axis title is 55px\n */\n\n xAxisTitle?: string;\n\n /**\n * Prop to set the y axis title\n * @default undefined\n * Minimum left margin required for y axis title is 60px and for RTL is 40px\n * Minimum right margin required for y axis title is 40px and for RTL is 60px\n */\n yAxisTitle?: string;\n\n /**\n * Prop to set the secondary y axis title\n * @default undefined\n * If RTL is enabled, minimum left and right margins required for secondary y axis title is 60px\n */\n secondaryYAxistitle?: string;\n\n /**\n * Whether to use UTC time for axis scale, ticks, and the time display in callouts.\n * When set to `true`, time is displayed equally, regardless of the user's timezone settings.\n * @default true\n */\n useUTC?: string | boolean;\n\n /**\n * @default false\n * The prop used to decide rounded ticks on y axis\n */\n roundedTicks?: boolean;\n\n /**\n * Determines whether overlapping x-axis tick labels should be hidden.\n * @default true\n */\n hideTickOverlap?: boolean;\n\n /**\n * Define a custom callout props override\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n calloutPropsPerDataPoint?: (dataPointCalloutProps: any) => ChartPopoverProps;\n\n /**\n * Optional callback to access the Chart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: React.RefObject<Chart>;\n\n /**\n * Prop to set the x axis annotation. Used to display additional information on the x-axis.\n * This is shown on the top of the chart.\n * @default undefined\n */\n xAxisAnnotation?: string;\n\n /**\n * Prop to set the y axis annotation. Used to display additional information on the y-axis.\n * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.\n * @default undefined\n */\n yAxisAnnotation?: string;\n\n /**\n * Specifies the ordering logic for categories (or string tick labels) on the x-axis.\n * @default 'default'\n */\n xAxisCategoryOrder?: AxisCategoryOrder;\n\n /**\n * Specifies the ordering logic for categories (or string tick labels) on the y-axis.\n * @default 'default'\n */\n yAxisCategoryOrder?: AxisCategoryOrder;\n\n /**\n * Defines the scale type for the x-axis.\n * @default 'default'\n */\n xScaleType?: AxisScaleType;\n\n /**\n * Defines the scale type for the primary y-axis.\n * @default 'default'\n */\n yScaleType?: AxisScaleType;\n\n /**\n * Defines the scale type for the secondary y-axis.\n * @default 'default'\n */\n secondaryYScaleType?: AxisScaleType;\n\n /**\n * Explicit set of tick values for the y-axis.\n * If provided, these values override automatic tick generation.\n */\n yAxisTickValues?: number[] | Date[] | string[];\n\n /**\n * Configuration for the x-axis.\n * Use this to control `tickStep`, `tick0`, etc.\n */\n xAxis?: AxisProps;\n\n /**\n * Configuration for the y-axis.\n * Use this to control `tickStep`, `tick0`, etc.\n */\n yAxis?: AxisProps;\n}\n\nexport interface YValueHover {\n legend?: string;\n y?: number | string;\n color?: string;\n data?: string | number;\n shouldDrawBorderBottom?: boolean;\n yAxisCalloutData?: string | { [id: string]: number };\n index?: number;\n callOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface ChildProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n xScale?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n yScalePrimary?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n yScaleSecondary?: any;\n containerHeight?: number;\n containerWidth?: number;\n optimizeLargeData?: boolean;\n}\n\n// Only used for Cartesian chart base\nexport interface ModifiedCartesianChartProps extends CartesianChartProps {\n /**\n * Define the chart title\n */\n chartTitle?: string;\n\n /**\n * Only used for Area chart\n * Value used to draw y axis of that chart.\n */\n maxOfYVal?: number;\n\n /**\n * Data of the chart\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n points: any;\n\n /**\n * Define type of the chart\n */\n chartType: ChartTypes;\n\n /** X axis type */\n xAxisType: XAxisTypes;\n\n /** Y axis type */\n yAxisType?: YAxisType;\n\n /**\n * Legends of the chart.\n */\n legendBars: JSXElement | null;\n\n /**\n * Callout props\n */\n calloutProps?: ChartPopoverProps;\n\n /**\n * Callback method used for to get margins to the chart.\n */\n getmargins?: (margins: Margins) => void;\n\n /**\n * This is a call back method to the chart from cartesian chart.\n * params are xScale, yScale, containerHeight, containerWidth. These values were used to draw the graph.\n * It also contians an optional param xAxisElement - defines as x axis scale element.\n * This param used to enable feature word wrap of Xaxis.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n getGraphData?: any;\n\n /**\n * Used for bar chart graphs.\n * To define width of the bar\n */\n barwidth?: number;\n\n /**\n * Used for tick styles of the x axis of the chart\n * Tick params are applicable for date axis only.\n */\n tickParams?: {\n tickValues?: number[] | Date[] | string[];\n tickFormat?: string;\n };\n\n /**\n * it's padding between bar's or lines in the graph\n */\n xAxisPadding?: number;\n\n /**\n * it's padding between bar's or lines in the graph\n */\n yAxisPadding?: number;\n\n /**\n * Children elements specific to derived chart types.\n */\n children(props: ChildProps): React.ReactNode;\n\n /**\n * To enable callout for individual bar or complete stack. Using for only Vertical stacked bar chart.\n * @default false\n * @type \\{boolean \\}\n */\n isCalloutForStack?: boolean;\n\n /** dataset values to find out domain of the String axis\n * Present using for only vertical stacked bar chart and grouped vertical bar chart\n */\n datasetForXAxisDomain?: string[];\n\n /** Own callout design */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n customizedCallout?: any;\n\n /**\n * if the data points for the y-axis is of type string, then we need to give this\n * prop to construct the y-axis\n */\n stringDatasetForYAxisDomain?: string[];\n\n /**\n * The prop used to define the culture to localize the numbers and date\n */\n culture?: string;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n getAxisData?: any;\n\n /**\n * Callback method used when mouse leaves the chart boundary.\n */\n onChartMouseLeave?: () => void;\n\n /** Callback method to get extra margins for domain */\n getDomainMargins?: (containerWidth: number) => Margins;\n\n /** Callback method to get extra margins for Y-axis domain */\n getYDomainMargins?: (containerHeight: number) => Margins;\n\n /** Padding between each bar/line-point */\n xAxisInnerPadding?: number;\n\n /** Padding before first bar/line-point and after last bar/line-point */\n xAxisOuterPadding?: number;\n\n /**\n *@default false\n *Used for to elipse y axis labes and show tooltip on x axis labels\n */\n showYAxisLablesTooltip?: boolean;\n\n /**\n *@default false\n *Used for showing complete y axis lables */\n showYAxisLables?: boolean;\n\n /**\n * @default false\n * Used to control the first render cycle Performance optimization code.\n */\n enableFirstRenderOptimization?: boolean;\n\n /**\n * Get the min and max values of the y-axis\n */\n getMinMaxOfYAxis: (\n points:\n | LineChartPoints[]\n | HorizontalBarChartWithAxisDataPoint[]\n | VerticalBarChartDataPoint[]\n | DataPoint[]\n | ScatterChartPoints[]\n | GanttChartDataPoint[],\n yAxisType: YAxisType | undefined,\n useSecondaryYScale?: boolean,\n ) => { startValue: number; endValue: number };\n\n /**\n * Create the y-axis\n */\n createYAxis: (\n yAxisParams: IYAxisParams,\n isRtl: boolean,\n axisData: IAxisData,\n isIntegralDataset: boolean,\n chartType: ChartTypes,\n useSecondaryYScale?: boolean,\n roundedTicks?: boolean,\n scaleType?: AxisScaleType,\n _useRtl?: boolean,\n ) => ScaleLinear<number, number, never>;\n\n /**\n * Get the domain and range values\n */\n getDomainNRangeValues: (\n points:\n | LineChartPoints[]\n | VerticalBarChartDataPoint[]\n | VerticalStackedBarDataPoint[]\n | HorizontalBarChartWithAxisDataPoint[]\n | GroupedVerticalBarChartData[]\n | HeatMapChartDataPoint[]\n | GanttChartDataPoint[],\n margins: Margins,\n width: number,\n chartType: ChartTypes,\n isRTL: boolean,\n xAxisType: XAxisTypes,\n barWidth: number,\n tickValues: Date[] | number[] | string[] | undefined,\n shiftX: number,\n ) => IDomainNRange;\n\n /**\n * Create the string y-axis\n */\n createStringYAxis: (\n yAxisParams: IYAxisParams,\n dataPoints: string[],\n isRtl: boolean,\n barWidth: number | undefined,\n chartType?: ChartTypes,\n ) => ScaleBand<string>;\n\n /**\n * Controls whether the numeric x-axis domain should be extended to start and end at nice rounded values.\n * @default true\n */\n showRoundOffXTickValues?: boolean;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
|
|
1
|
+
{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { LegendsProps } from '../Legends/index';\nimport {\n AccessibilityProps,\n Chart,\n Margins,\n DataPoint,\n HorizontalBarChartWithAxisDataPoint,\n GroupedVerticalBarChartData,\n HeatMapChartDataPoint,\n LineChartPoints,\n VerticalBarChartDataPoint,\n VerticalStackedBarDataPoint,\n ScatterChartPoints,\n GanttChartDataPoint,\n AxisCategoryOrder,\n AxisProps,\n AxisScaleType,\n} from '../../types/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\nimport { ChartTypes, IAxisData, IDomainNRange, IYAxisParams, XAxisTypes, YAxisType } from '../../utilities/utilities';\nimport { ScaleBand, ScaleLinear } from 'd3-scale';\n/**\n * Cartesian Chart style properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyleProps {\n /**\n * Additional CSS class(es) to apply to the Chart.\n */\n className?: string;\n\n /**\n * Width of the chart.\n */\n width?: number;\n\n /**\n * Height of the chart.\n */\n height?: number;\n\n /**\n * Color of the chart.\n */\n color?: string;\n\n /**\n * Link to redirect if click action for graph\n */\n href?: string;\n\n /**\n * prop to check if the chart is selected or hovered upon to determine opacity\n */\n shouldHighlight?: boolean;\n\n /**\n * prop to check if the Page is in Rtl\n */\n useRtl?: boolean;\n\n /**\n * color of the line\n */\n lineColor?: string;\n\n /**\n * boolean flag which determines if shape is drawn in callout\n */\n toDrawShape?: boolean;\n\n /**\n * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n * @deprecated Use `reflowProps` instead.\n */\n enableReflow?: boolean;\n}\n\n/**\n * Cartesian Chart styles\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyles {\n /**\n * Style for the root element.\n */\n root?: string;\n\n /**\n * Style for the element containing the x-axis.\n */\n xAxis?: string;\n\n /**\n * Style for the element containing the y-axis.\n */\n yAxis?: string;\n\n /**\n * Style for legend container\n */\n legendContainer?: string;\n\n /**\n * line hover box css\n */\n hover?: string;\n\n /**\n * styles for description message\n */\n descriptionMessage?: string;\n\n /**\n * styles for tooltip\n */\n tooltip?: string;\n\n /**\n * styles for axis title\n */\n axisTitle?: string;\n\n /**\n * styles for axis annotation\n */\n axisAnnotation?: string;\n\n /**\n * Style for the chart Title.\n */\n chartTitle?: string;\n\n /**\n * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n */\n opacityChangeOnHover?: string;\n\n /**\n * styles for the shape object in the callout\n */\n shapeStyles?: string;\n\n /**\n * Styles for the chart wrapper div\n */\n chartWrapper?: string;\n\n /**\n * Styles for the svg tooltip\n */\n svgTooltip?: string;\n\n /**\n * Styles for the chart svg element\n */\n chart?: string;\n}\n\n/**\n * Cartesian Chart properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartProps {\n /**\n * Below height used for resizing of the chart\n * Wrap chart in your container and send the updated height and width to these props.\n * These values decide wheather chart re render or not. Please check examples for reference\n */\n height?: number;\n\n /**\n * Below width used for resizing of the chart\n * Wrap chart in your container and send the updated height and width to these props.\n * These values decide wheather chart re render or not. Please check examples for reference\n */\n width?: number;\n\n /**\n * this prop takes its parent as a HTML element to define the width and height of the chart\n */\n parentRef?: HTMLElement | null;\n\n /**\n * Additional CSS class(es) to apply to the Chart.\n */\n className?: string;\n\n /**\n * Margins for the chart\n * @default `{ top: 20, bottom: 35, left: 40, right: 20 }`\n * To avoid edge cuttings to the chart, we recommend you use default values or greater then default values\n */\n margins?: Margins;\n\n /** decides wether to show/hide legends\n * @defaultvalue false\n */\n hideLegend?: boolean;\n\n /**\n * Do not show tooltips in chart\n * @default false\n */\n hideTooltip?: boolean;\n\n /**\n * this prop takes values that you want the chart to render on x-axis\n * This is a optional parameter if not specified D3 will decide which values appear on the x-axis for you\n * Please look at https://github.com/d3/d3-scale for more information on how D3 decides what data to appear on the axis of chart\n */\n tickValues?: number[] | Date[] | string[] | undefined;\n\n /**\n * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'\n * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis\n * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.\n */\n tickFormat?: string;\n\n /**\n * Width of line stroke\n */\n strokeWidth?: number;\n\n /**\n * x Axis labels tick padding. This defines the gap between tick labels and tick lines.\n * @default 10\n */\n xAxisTickPadding?: number;\n\n /**\n * the format in for the data on y-axis. For data object this can be specified to your requirement.\n * Eg: d3.format(\".0%\")(0.123),d3.format(\"+20\")(42);\n * Please look at https://github.com/d3/d3-format for all the formats supported\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n yAxisTickFormat?: any;\n\n /**\n * Secondary y-scale options\n * By default this is not defined, meaning there will be no secondary y-scale.\n */\n secondaryYScaleOptions?: {\n /** Minimum value (0 by default) */\n yMinValue?: number;\n /** Maximum value (100 by default) */\n yMaxValue?: number;\n };\n\n /**\n * minimum data value point in y-axis\n */\n yMinValue?: number;\n\n /**\n * maximum data value point in y-axis\n */\n yMaxValue?: number;\n\n /**\n * maximum data value point in x-axis\n */\n xMaxValue?: number;\n\n /**\n * Number of ticks on the y-axis.\n * Tick count should be factor of difference between (yMinValue, yMaxValue)?\n * @default 4\n */\n yAxisTickCount?: number;\n\n /**\n * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.\n * Does not work for string axis.\n * @default 6\n */\n xAxisTickCount?: number;\n\n /**\n * define the size of the tick lines on the x-axis\n * @default 10\n */\n xAxistickSize?: number;\n\n /**\n * defines the space between the tick line and the data label\n * @default 10\n */\n tickPadding?: number;\n\n /**\n * Url that the data-viz needs to redirect to upon clicking on it\n */\n href?: string;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n legendsOverflowText?: any;\n\n /**\n * Enable the legends to wrap lines if there is not enough space to show all legends on a single line\n */\n enabledLegendsWrapLines?: boolean;\n\n /*\n * props for the legends in the chart\n */\n legendProps?: Partial<LegendsProps>;\n\n /**\n *@default false\n *Used for to elipse x axis labes and show tooltip on x axis labels\n */\n showXAxisLablesTooltip?: boolean;\n\n /**\n * @default 4\n * Used for X axis labels\n * While Giving showXAxisLablesTooltip prop, need to define after how many chars, we need to truncate the word.\n */\n noOfCharsToTruncate?: number;\n\n /**\n * @default false\n * Used to wrap x axis labels values (whole value)\n */\n wrapXAxisLables?: boolean;\n\n /**\n * @default false\n * Used to rotate x axis labels by 45 degrees\n */\n rotateXAxisLables?: boolean;\n\n /**\n * The prop used to define the date time localization options\n */\n dateLocalizeOptions?: Intl.DateTimeFormatOptions;\n\n /**\n * The prop used to define a custom locale for the date time format.\n */\n timeFormatLocale?: TimeLocaleDefinition;\n\n /**\n * The prop used to define a custom datetime formatter for date axis.\n */\n customDateTimeFormatter?: (dateTime: Date) => string;\n\n /**\n * Call to provide customized styling that will layer on top of the variant rules.\n */\n styles?: CartesianChartStyles;\n\n /**\n * Callout customization props\n */\n calloutProps?: Partial<ChartPopoverProps>;\n\n /**\n * props for the svg; use this to include aria-* or other attributes on the tag\n */\n svgProps?: React.SVGProps<SVGSVGElement>;\n\n /**\n * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n * @deprecated Use `reflowProps` instead.\n */\n enableReflow?: boolean;\n\n /**\n * Props related to reflow behavior of the chart\n */\n reflowProps?: {\n /**\n * Determines the reflow behavior of the chart.\n * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.\n * @default 'none'\n */\n mode: 'none' | 'min-width';\n };\n\n /**\n * Prop to set the x axis title\n * @default undefined\n * Minimum bottom margin required for x axis title is 55px\n */\n\n xAxisTitle?: string;\n\n /**\n * Prop to set the y axis title\n * @default undefined\n * Minimum left margin required for y axis title is 60px and for RTL is 40px\n * Minimum right margin required for y axis title is 40px and for RTL is 60px\n */\n yAxisTitle?: string;\n\n /**\n * Prop to set the secondary y axis title\n * @default undefined\n * If RTL is enabled, minimum left and right margins required for secondary y axis title is 60px\n */\n secondaryYAxistitle?: string;\n\n /**\n * Whether to use UTC time for axis scale, ticks, and the time display in callouts.\n * When set to `true`, time is displayed equally, regardless of the user's timezone settings.\n * @default true\n */\n useUTC?: string | boolean;\n\n /**\n * @default false\n * The prop used to decide rounded ticks on y axis\n */\n roundedTicks?: boolean;\n\n /**\n * Determines whether overlapping x-axis tick labels should be hidden.\n * @default true\n */\n hideTickOverlap?: boolean;\n\n /**\n * Define a custom callout props override\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n calloutPropsPerDataPoint?: (dataPointCalloutProps: any) => ChartPopoverProps;\n\n /**\n * Optional callback to access the Chart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: React.RefObject<Chart | null>;\n\n /**\n * Prop to set the x axis annotation. Used to display additional information on the x-axis.\n * This is shown on the top of the chart.\n * @default undefined\n */\n xAxisAnnotation?: string;\n\n /**\n * Prop to set the y axis annotation. Used to display additional information on the y-axis.\n * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.\n * @default undefined\n */\n yAxisAnnotation?: string;\n\n /**\n * Specifies the ordering logic for categories (or string tick labels) on the x-axis.\n * @default 'default'\n */\n xAxisCategoryOrder?: AxisCategoryOrder;\n\n /**\n * Specifies the ordering logic for categories (or string tick labels) on the y-axis.\n * @default 'default'\n */\n yAxisCategoryOrder?: AxisCategoryOrder;\n\n /**\n * Defines the scale type for the x-axis.\n * @default 'default'\n */\n xScaleType?: AxisScaleType;\n\n /**\n * Defines the scale type for the primary y-axis.\n * @default 'default'\n */\n yScaleType?: AxisScaleType;\n\n /**\n * Defines the scale type for the secondary y-axis.\n * @default 'default'\n */\n secondaryYScaleType?: AxisScaleType;\n\n /**\n * Explicit set of tick values for the y-axis.\n * If provided, these values override automatic tick generation.\n */\n yAxisTickValues?: number[] | Date[] | string[];\n\n /**\n * Configuration for the x-axis.\n * Use this to control `tickStep`, `tick0`, etc.\n */\n xAxis?: AxisProps;\n\n /**\n * Configuration for the y-axis.\n * Use this to control `tickStep`, `tick0`, etc.\n */\n yAxis?: AxisProps;\n}\n\nexport interface YValueHover {\n legend?: string;\n y?: number | string;\n color?: string;\n data?: string | number;\n shouldDrawBorderBottom?: boolean;\n yAxisCalloutData?: string | { [id: string]: number };\n index?: number;\n callOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface ChildProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n xScale?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n yScalePrimary?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n yScaleSecondary?: any;\n containerHeight?: number;\n containerWidth?: number;\n optimizeLargeData?: boolean;\n}\n\n// Only used for Cartesian chart base\nexport interface ModifiedCartesianChartProps extends CartesianChartProps {\n /**\n * Define the chart title\n */\n chartTitle?: string;\n\n /**\n * Only used for Area chart\n * Value used to draw y axis of that chart.\n */\n maxOfYVal?: number;\n\n /**\n * Data of the chart\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n points: any;\n\n /**\n * Define type of the chart\n */\n chartType: ChartTypes;\n\n /** X axis type */\n xAxisType: XAxisTypes;\n\n /** Y axis type */\n yAxisType?: YAxisType;\n\n /**\n * Legends of the chart.\n */\n legendBars: JSXElement | null;\n\n /**\n * Callout props\n */\n calloutProps?: ChartPopoverProps;\n\n /**\n * Callback method used for to get margins to the chart.\n */\n getmargins?: (margins: Margins) => void;\n\n /**\n * This is a call back method to the chart from cartesian chart.\n * params are xScale, yScale, containerHeight, containerWidth. These values were used to draw the graph.\n * It also contians an optional param xAxisElement - defines as x axis scale element.\n * This param used to enable feature word wrap of Xaxis.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n getGraphData?: any;\n\n /**\n * Used for bar chart graphs.\n * To define width of the bar\n */\n barwidth?: number;\n\n /**\n * Used for tick styles of the x axis of the chart\n * Tick params are applicable for date axis only.\n */\n tickParams?: {\n tickValues?: number[] | Date[] | string[];\n tickFormat?: string;\n };\n\n /**\n * it's padding between bar's or lines in the graph\n */\n xAxisPadding?: number;\n\n /**\n * it's padding between bar's or lines in the graph\n */\n yAxisPadding?: number;\n\n /**\n * Children elements specific to derived chart types.\n */\n children(props: ChildProps): React.ReactNode;\n\n /**\n * To enable callout for individual bar or complete stack. Using for only Vertical stacked bar chart.\n * @default false\n * @type \\{boolean \\}\n */\n isCalloutForStack?: boolean;\n\n /** dataset values to find out domain of the String axis\n * Present using for only vertical stacked bar chart and grouped vertical bar chart\n */\n datasetForXAxisDomain?: string[];\n\n /** Own callout design */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n customizedCallout?: any;\n\n /**\n * if the data points for the y-axis is of type string, then we need to give this\n * prop to construct the y-axis\n */\n stringDatasetForYAxisDomain?: string[];\n\n /**\n * The prop used to define the culture to localize the numbers and date\n */\n culture?: string;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n getAxisData?: any;\n\n /**\n * Callback method used when mouse leaves the chart boundary.\n */\n onChartMouseLeave?: () => void;\n\n /** Callback method to get extra margins for domain */\n getDomainMargins?: (containerWidth: number) => Margins;\n\n /** Callback method to get extra margins for Y-axis domain */\n getYDomainMargins?: (containerHeight: number) => Margins;\n\n /** Padding between each bar/line-point */\n xAxisInnerPadding?: number;\n\n /** Padding before first bar/line-point and after last bar/line-point */\n xAxisOuterPadding?: number;\n\n /**\n *@default false\n *Used for to elipse y axis labes and show tooltip on x axis labels\n */\n showYAxisLablesTooltip?: boolean;\n\n /**\n *@default false\n *Used for showing complete y axis lables */\n showYAxisLables?: boolean;\n\n /**\n * @default false\n * Used to control the first render cycle Performance optimization code.\n */\n enableFirstRenderOptimization?: boolean;\n\n /**\n * Get the min and max values of the y-axis\n */\n getMinMaxOfYAxis: (\n points:\n | LineChartPoints[]\n | HorizontalBarChartWithAxisDataPoint[]\n | VerticalBarChartDataPoint[]\n | DataPoint[]\n | ScatterChartPoints[]\n | GanttChartDataPoint[],\n yAxisType: YAxisType | undefined,\n useSecondaryYScale?: boolean,\n ) => { startValue: number; endValue: number };\n\n /**\n * Create the y-axis\n */\n createYAxis: (\n yAxisParams: IYAxisParams,\n isRtl: boolean,\n axisData: IAxisData,\n isIntegralDataset: boolean,\n chartType: ChartTypes,\n useSecondaryYScale?: boolean,\n roundedTicks?: boolean,\n scaleType?: AxisScaleType,\n _useRtl?: boolean,\n ) => ScaleLinear<number, number, never>;\n\n /**\n * Get the domain and range values\n */\n getDomainNRangeValues: (\n points:\n | LineChartPoints[]\n | VerticalBarChartDataPoint[]\n | VerticalStackedBarDataPoint[]\n | HorizontalBarChartWithAxisDataPoint[]\n | GroupedVerticalBarChartData[]\n | HeatMapChartDataPoint[]\n | GanttChartDataPoint[],\n margins: Margins,\n width: number,\n chartType: ChartTypes,\n isRTL: boolean,\n xAxisType: XAxisTypes,\n barWidth: number,\n tickValues: Date[] | number[] | string[] | undefined,\n shiftX: number,\n ) => IDomainNRange;\n\n /**\n * Create the string y-axis\n */\n createStringYAxis: (\n yAxisParams: IYAxisParams,\n dataPoints: string[],\n isRtl: boolean,\n barWidth: number | undefined,\n chartType?: ChartTypes,\n ) => ScaleBand<string>;\n\n /**\n * Controls whether the numeric x-axis domain should be extended to start and end at nice rounded values.\n * @default true\n */\n showRoundOffXTickValues?: boolean;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
|
|
@@ -85,7 +85,8 @@ function tryMapFluentDataViz(hexColor, templateColorway, isDarkTheme, isDonut) {
|
|
|
85
85
|
}
|
|
86
86
|
return hexColor;
|
|
87
87
|
}
|
|
88
|
-
export const getColor = (legendLabel,
|
|
88
|
+
export const getColor = (legendLabel, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
89
|
+
colorMap, templateColorway, isDarkTheme, isDonut)=>{
|
|
89
90
|
if (!colorMap.current.has(legendLabel)) {
|
|
90
91
|
let nextColor;
|
|
91
92
|
const defaultColorMapping = isDonut ? templateColorway === 'plotly' ? PLOTLY_FLUENTVIZ_COLORWAY_MAPPING : D3_FLUENTVIZ_COLORWAY_MAPPING : PLOTLY_FLUENTVIZ_COLORWAY_MAPPING;
|
|
@@ -100,7 +101,8 @@ export const getColor = (legendLabel, colorMap, templateColorway, isDarkTheme, i
|
|
|
100
101
|
}
|
|
101
102
|
return colorMap.current.get(legendLabel);
|
|
102
103
|
};
|
|
103
|
-
export const getSchemaColors = (colorway, colors,
|
|
104
|
+
export const getSchemaColors = (colorway, colors, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
105
|
+
colorMap, isDarkTheme, isDonut)=>{
|
|
104
106
|
const hexColors = [];
|
|
105
107
|
if (!colors) {
|
|
106
108
|
return undefined;
|
|
@@ -124,10 +126,12 @@ export const getSchemaColors = (colorway, colors, colorMap, isDarkTheme, isDonut
|
|
|
124
126
|
}
|
|
125
127
|
return hexColors;
|
|
126
128
|
};
|
|
127
|
-
export const extractColor = (colorway, colorwayType, colors,
|
|
129
|
+
export const extractColor = (colorway, colorwayType, colors, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
130
|
+
colorMap, isDarkTheme, isDonut)=>{
|
|
128
131
|
return colorwayType === 'default' && colors ? getSchemaColors(colorway, colors, colorMap, isDarkTheme, isDonut) : undefined;
|
|
129
132
|
};
|
|
130
|
-
export const resolveColor = (extractedColors, index, legend,
|
|
133
|
+
export const resolveColor = (extractedColors, index, legend, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
134
|
+
colorMap, colorway, isDarkTheme, isDonut)=>{
|
|
131
135
|
let color = '';
|
|
132
136
|
const templateColorway = getPlotlyColorway(colorway, isDonut);
|
|
133
137
|
if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors.length > 0) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/DeclarativeChart/PlotlyColorAdapter.ts"],"sourcesContent":["import * as React from 'react';\nimport { color as d3Color } from 'd3-color';\nimport type { PieColors, Color, PlotData, Layout } from '@fluentui/chart-utilities';\nimport { isArrayOrTypedArray } from '@fluentui/chart-utilities';\nimport { areArraysEqual } from '../../utilities/utilities';\nimport { DataVizPalette, getColorFromToken, getNextColor } from '../../utilities/colors';\nimport { scaleLinear as d3ScaleLinear } from 'd3-scale';\n\ntype PlotlyColorway = 'plotly' | 'd3' | 'others';\n\n// The color sequences in plotly express are defined here:\n// https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport type ColorwayType = 'default' | 'builtin' | 'others' | undefined;\n\nconst DEFAULT_PLOTLY_COLORWAY = [\n '#636efa', //1\n '#ef553b', //2\n '#00cc96', //3\n '#ab63fa', //4\n '#ffa15a', //5\n '#19d3f3', //6\n '#ff6692', //7\n '#b6e880', //8\n '#ff97ff', //9\n '#fecb52', //10\n];\n\n// Default D3 qualitative colorway (Category10), matching Plotly Express px.colors.qualitative.D3\n// Source: https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport const DEFAULT_D3_COLORWAY = [\n '#1f77b4', //1\n '#ff7f0e', //2\n '#2ca02c', //3\n '#d62728', //4\n '#9467bd', //5\n '#8c564b', //6\n '#e377c2', //7\n '#7f7f7f', //8\n '#bcbd22', //9\n '#17becf', //10\n];\n\nconst PLOTLY_FLUENTVIZ_COLORWAY_MAPPING = [\n DataVizPalette.color1, //1\n DataVizPalette.warning, //2\n DataVizPalette.color8, //3\n DataVizPalette.color4, //4\n DataVizPalette.color7, //5\n DataVizPalette.color6, //6\n DataVizPalette.color2, //7\n DataVizPalette.color5, //8\n DataVizPalette.color9, //9\n DataVizPalette.color10, //10\n];\n\n// Mapping from D3 Category10 order to Fluent DataViz tokens (light/dark handled via getColorFromToken)\n// D3: [blue, orange, green, red, purple, brown, pink, gray, olive, cyan]\nexport const D3_FLUENTVIZ_COLORWAY_MAPPING: string[] = [\n DataVizPalette.color26, // blue -> lightBlue.shade10\n DataVizPalette.warning, // orange -> semantic warning\n DataVizPalette.color5, // green -> lightGreen.primary\n DataVizPalette.error, // red -> semantic error\n DataVizPalette.color4, // purple -> orchid.tint10\n DataVizPalette.color17, // brown -> pumpkin.shade20\n DataVizPalette.color22, // pink -> hotPink.tint20\n DataVizPalette.disabled, // gray -> semantic disabled\n DataVizPalette.color10, // olive/yellow-green -> gold.shade10\n DataVizPalette.color3, // cyan/teal -> teal.tint20\n];\n\nfunction getPlotlyColorway(colorway: string[] | undefined, isDonut: boolean = false): PlotlyColorway {\n if (!colorway || !isArrayOrTypedArray(colorway)) {\n return 'others';\n }\n const lower = colorway.map(c => c.toLowerCase());\n if (isDonut && areArraysEqual(lower, D3_FLUENTVIZ_COLORWAY_MAPPING)) {\n return 'd3';\n }\n if (areArraysEqual(lower, DEFAULT_PLOTLY_COLORWAY)) {\n return 'plotly';\n }\n return 'others';\n}\n\nfunction tryMapFluentDataViz(\n hexColor: string,\n templateColorway: PlotlyColorway,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string {\n if (templateColorway !== 'plotly') {\n return hexColor;\n }\n let defaultColorway: string[] = DEFAULT_PLOTLY_COLORWAY;\n let defaultMapping: string[] = PLOTLY_FLUENTVIZ_COLORWAY_MAPPING;\n if (isDonut) {\n defaultColorway = templateColorway === 'plotly' ? DEFAULT_PLOTLY_COLORWAY : DEFAULT_D3_COLORWAY;\n defaultMapping = templateColorway === 'plotly' ? PLOTLY_FLUENTVIZ_COLORWAY_MAPPING : D3_FLUENTVIZ_COLORWAY_MAPPING;\n }\n const idx = defaultColorway.indexOf(hexColor.toLowerCase());\n if (idx !== -1) {\n return getColorFromToken(defaultMapping[idx], !!isDarkTheme);\n }\n return hexColor;\n}\n\nexport const getColor = (\n legendLabel: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n templateColorway: PlotlyColorway,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string => {\n if (!colorMap.current.has(legendLabel)) {\n let nextColor: string;\n const defaultColorMapping = isDonut\n ? templateColorway === 'plotly'\n ? PLOTLY_FLUENTVIZ_COLORWAY_MAPPING\n : D3_FLUENTVIZ_COLORWAY_MAPPING\n : PLOTLY_FLUENTVIZ_COLORWAY_MAPPING;\n if (colorMap.current.size < defaultColorMapping.length) {\n // Get first 10 colors from plotly-fluentviz colorway mapping\n nextColor = getColorFromToken(defaultColorMapping[colorMap.current.size], isDarkTheme);\n } else {\n nextColor = getNextColor(colorMap.current.size, 0, isDarkTheme);\n }\n colorMap.current.set(legendLabel, nextColor);\n return nextColor;\n }\n\n return colorMap.current.get(legendLabel) as string;\n};\n\nexport const getSchemaColors = (\n colorway: string[] | undefined,\n colors: PieColors | Color | Color[] | string | null | undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string[] | string | undefined => {\n const hexColors: string[] = [];\n if (!colors) {\n return undefined;\n }\n const templateColorway = getPlotlyColorway(colorway, isDonut);\n if (isArrayOrTypedArray(colors)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (colors as any[]).forEach((element, index) => {\n const colorString = element?.toString().trim();\n const nextFluentColor = getColor(`Label_${index}`, colorMap, templateColorway, isDarkTheme, isDonut);\n if (colorString) {\n const parsedColor = d3Color(colorString);\n hexColors.push(\n parsedColor ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme) : nextFluentColor,\n );\n } else {\n hexColors.push(nextFluentColor);\n }\n });\n } else if (typeof colors === 'string') {\n const parsedColor = d3Color(colors);\n return parsedColor\n ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme)\n : getColor('Label_0', colorMap, templateColorway, isDarkTheme, isDonut);\n }\n return hexColors;\n};\n\nexport const extractColor = (\n colorway: string[] | undefined,\n colorwayType: ColorwayType,\n colors: PieColors | Color | Color[] | string | null | undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string | string[] | undefined => {\n return colorwayType === 'default' && colors\n ? getSchemaColors(colorway, colors, colorMap, isDarkTheme, isDonut)\n : undefined;\n};\n\nexport const resolveColor = (\n extractedColors: string[] | string | null | undefined,\n index: number,\n legend: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n colorway: string[] | undefined,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string => {\n let color = '';\n const templateColorway = getPlotlyColorway(colorway, isDonut);\n if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors.length > 0) {\n color = extractedColors[index % extractedColors.length];\n } else if (typeof extractedColors === 'string') {\n color = extractedColors;\n } else {\n color = getColor(legend, colorMap, templateColorway, isDarkTheme, isDonut);\n }\n return color;\n};\n\nexport const getOpacity = (series: Partial<PlotData>, index: number): number => {\n return series.marker?.opacity\n ? isArrayOrTypedArray(series.marker?.opacity)\n ? (series.marker?.opacity as number[])[index % (series.marker?.opacity as number[]).length]\n : (series.marker?.opacity as number)\n : series.opacity ?? 1;\n};\n\nexport const createColorScale = (\n layout: Partial<Layout> | undefined,\n series: Partial<PlotData>,\n currentColorScale: ((value: number) => string) | undefined,\n): ((value: number) => string) | undefined => {\n if (\n layout?.coloraxis?.colorscale?.length &&\n isArrayOrTypedArray(series.marker?.color) &&\n (series.marker?.color as Color[]).length > 0 &&\n typeof (series.marker?.color as Color[])?.[0] === 'number'\n ) {\n const scale = layout?.coloraxis?.colorscale as Array<[number, string]>;\n const colorValues = series.marker?.color as number[];\n const [dMin, dMax] = [\n layout?.coloraxis?.cmin ?? Math.min(...colorValues),\n layout?.coloraxis?.cmax ?? Math.max(...colorValues),\n ];\n\n // Normalize colorscale domain to actual data domain\n const scaleDomain = scale.map(([pos]) => dMin + pos * (dMax - dMin));\n const scaleColors = scale.map(item => item[1]);\n\n return d3ScaleLinear<string>().domain(scaleDomain).range(scaleColors);\n }\n return currentColorScale;\n};\n"],"names":["React","color","d3Color","isArrayOrTypedArray","areArraysEqual","DataVizPalette","getColorFromToken","getNextColor","scaleLinear","d3ScaleLinear","DEFAULT_PLOTLY_COLORWAY","DEFAULT_D3_COLORWAY","PLOTLY_FLUENTVIZ_COLORWAY_MAPPING","color1","warning","color8","color4","color7","color6","color2","color5","color9","color10","D3_FLUENTVIZ_COLORWAY_MAPPING","color26","error","color17","color22","disabled","color3","getPlotlyColorway","colorway","isDonut","lower","map","c","toLowerCase","tryMapFluentDataViz","hexColor","templateColorway","isDarkTheme","defaultColorway","defaultMapping","idx","indexOf","getColor","legendLabel","colorMap","current","has","nextColor","defaultColorMapping","size","length","set","get","getSchemaColors","colors","hexColors","undefined","forEach","element","index","colorString","toString","trim","nextFluentColor","parsedColor","push","formatHex","extractColor","colorwayType","resolveColor","extractedColors","legend","getOpacity","series","marker","opacity","createColorScale","layout","currentColorScale","coloraxis","colorscale","scale","colorValues","dMin","dMax","cmin","Math","min","cmax","max","scaleDomain","pos","scaleColors","item","domain","range"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/components/DeclarativeChart/PlotlyColorAdapter.ts"],"sourcesContent":["import * as React from 'react';\nimport { color as d3Color } from 'd3-color';\nimport type { PieColors, Color, PlotData, Layout } from '@fluentui/chart-utilities';\nimport { isArrayOrTypedArray } from '@fluentui/chart-utilities';\nimport { areArraysEqual } from '../../utilities/utilities';\nimport { DataVizPalette, getColorFromToken, getNextColor } from '../../utilities/colors';\nimport { scaleLinear as d3ScaleLinear } from 'd3-scale';\n\ntype PlotlyColorway = 'plotly' | 'd3' | 'others';\n\n// The color sequences in plotly express are defined here:\n// https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport type ColorwayType = 'default' | 'builtin' | 'others' | undefined;\n\nconst DEFAULT_PLOTLY_COLORWAY = [\n '#636efa', //1\n '#ef553b', //2\n '#00cc96', //3\n '#ab63fa', //4\n '#ffa15a', //5\n '#19d3f3', //6\n '#ff6692', //7\n '#b6e880', //8\n '#ff97ff', //9\n '#fecb52', //10\n];\n\n// Default D3 qualitative colorway (Category10), matching Plotly Express px.colors.qualitative.D3\n// Source: https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport const DEFAULT_D3_COLORWAY = [\n '#1f77b4', //1\n '#ff7f0e', //2\n '#2ca02c', //3\n '#d62728', //4\n '#9467bd', //5\n '#8c564b', //6\n '#e377c2', //7\n '#7f7f7f', //8\n '#bcbd22', //9\n '#17becf', //10\n];\n\nconst PLOTLY_FLUENTVIZ_COLORWAY_MAPPING = [\n DataVizPalette.color1, //1\n DataVizPalette.warning, //2\n DataVizPalette.color8, //3\n DataVizPalette.color4, //4\n DataVizPalette.color7, //5\n DataVizPalette.color6, //6\n DataVizPalette.color2, //7\n DataVizPalette.color5, //8\n DataVizPalette.color9, //9\n DataVizPalette.color10, //10\n];\n\n// Mapping from D3 Category10 order to Fluent DataViz tokens (light/dark handled via getColorFromToken)\n// D3: [blue, orange, green, red, purple, brown, pink, gray, olive, cyan]\nexport const D3_FLUENTVIZ_COLORWAY_MAPPING: string[] = [\n DataVizPalette.color26, // blue -> lightBlue.shade10\n DataVizPalette.warning, // orange -> semantic warning\n DataVizPalette.color5, // green -> lightGreen.primary\n DataVizPalette.error, // red -> semantic error\n DataVizPalette.color4, // purple -> orchid.tint10\n DataVizPalette.color17, // brown -> pumpkin.shade20\n DataVizPalette.color22, // pink -> hotPink.tint20\n DataVizPalette.disabled, // gray -> semantic disabled\n DataVizPalette.color10, // olive/yellow-green -> gold.shade10\n DataVizPalette.color3, // cyan/teal -> teal.tint20\n];\n\nfunction getPlotlyColorway(colorway: string[] | undefined, isDonut: boolean = false): PlotlyColorway {\n if (!colorway || !isArrayOrTypedArray(colorway)) {\n return 'others';\n }\n const lower = colorway.map(c => c.toLowerCase());\n if (isDonut && areArraysEqual(lower, D3_FLUENTVIZ_COLORWAY_MAPPING)) {\n return 'd3';\n }\n if (areArraysEqual(lower, DEFAULT_PLOTLY_COLORWAY)) {\n return 'plotly';\n }\n return 'others';\n}\n\nfunction tryMapFluentDataViz(\n hexColor: string,\n templateColorway: PlotlyColorway,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string {\n if (templateColorway !== 'plotly') {\n return hexColor;\n }\n let defaultColorway: string[] = DEFAULT_PLOTLY_COLORWAY;\n let defaultMapping: string[] = PLOTLY_FLUENTVIZ_COLORWAY_MAPPING;\n if (isDonut) {\n defaultColorway = templateColorway === 'plotly' ? DEFAULT_PLOTLY_COLORWAY : DEFAULT_D3_COLORWAY;\n defaultMapping = templateColorway === 'plotly' ? PLOTLY_FLUENTVIZ_COLORWAY_MAPPING : D3_FLUENTVIZ_COLORWAY_MAPPING;\n }\n const idx = defaultColorway.indexOf(hexColor.toLowerCase());\n if (idx !== -1) {\n return getColorFromToken(defaultMapping[idx], !!isDarkTheme);\n }\n return hexColor;\n}\n\nexport const getColor = (\n legendLabel: string,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n colorMap: React.MutableRefObject<Map<string, string>>,\n templateColorway: PlotlyColorway,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string => {\n if (!colorMap.current.has(legendLabel)) {\n let nextColor: string;\n const defaultColorMapping = isDonut\n ? templateColorway === 'plotly'\n ? PLOTLY_FLUENTVIZ_COLORWAY_MAPPING\n : D3_FLUENTVIZ_COLORWAY_MAPPING\n : PLOTLY_FLUENTVIZ_COLORWAY_MAPPING;\n if (colorMap.current.size < defaultColorMapping.length) {\n // Get first 10 colors from plotly-fluentviz colorway mapping\n nextColor = getColorFromToken(defaultColorMapping[colorMap.current.size], isDarkTheme);\n } else {\n nextColor = getNextColor(colorMap.current.size, 0, isDarkTheme);\n }\n colorMap.current.set(legendLabel, nextColor);\n return nextColor;\n }\n\n return colorMap.current.get(legendLabel) as string;\n};\n\nexport const getSchemaColors = (\n colorway: string[] | undefined,\n colors: PieColors | Color | Color[] | string | null | undefined,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string[] | string | undefined => {\n const hexColors: string[] = [];\n if (!colors) {\n return undefined;\n }\n const templateColorway = getPlotlyColorway(colorway, isDonut);\n if (isArrayOrTypedArray(colors)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (colors as any[]).forEach((element, index) => {\n const colorString = element?.toString().trim();\n const nextFluentColor = getColor(`Label_${index}`, colorMap, templateColorway, isDarkTheme, isDonut);\n if (colorString) {\n const parsedColor = d3Color(colorString);\n hexColors.push(\n parsedColor ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme) : nextFluentColor,\n );\n } else {\n hexColors.push(nextFluentColor);\n }\n });\n } else if (typeof colors === 'string') {\n const parsedColor = d3Color(colors);\n return parsedColor\n ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme)\n : getColor('Label_0', colorMap, templateColorway, isDarkTheme, isDonut);\n }\n return hexColors;\n};\n\nexport const extractColor = (\n colorway: string[] | undefined,\n colorwayType: ColorwayType,\n colors: PieColors | Color | Color[] | string | null | undefined,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string | string[] | undefined => {\n return colorwayType === 'default' && colors\n ? getSchemaColors(colorway, colors, colorMap, isDarkTheme, isDonut)\n : undefined;\n};\n\nexport const resolveColor = (\n extractedColors: string[] | string | null | undefined,\n index: number,\n legend: string,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n colorMap: React.MutableRefObject<Map<string, string>>,\n colorway: string[] | undefined,\n isDarkTheme?: boolean,\n isDonut?: boolean,\n): string => {\n let color = '';\n const templateColorway = getPlotlyColorway(colorway, isDonut);\n if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors.length > 0) {\n color = extractedColors[index % extractedColors.length];\n } else if (typeof extractedColors === 'string') {\n color = extractedColors;\n } else {\n color = getColor(legend, colorMap, templateColorway, isDarkTheme, isDonut);\n }\n return color;\n};\n\nexport const getOpacity = (series: Partial<PlotData>, index: number): number => {\n return series.marker?.opacity\n ? isArrayOrTypedArray(series.marker?.opacity)\n ? (series.marker?.opacity as number[])[index % (series.marker?.opacity as number[]).length]\n : (series.marker?.opacity as number)\n : series.opacity ?? 1;\n};\n\nexport const createColorScale = (\n layout: Partial<Layout> | undefined,\n series: Partial<PlotData>,\n currentColorScale: ((value: number) => string) | undefined,\n): ((value: number) => string) | undefined => {\n if (\n layout?.coloraxis?.colorscale?.length &&\n isArrayOrTypedArray(series.marker?.color) &&\n (series.marker?.color as Color[]).length > 0 &&\n typeof (series.marker?.color as Color[])?.[0] === 'number'\n ) {\n const scale = layout?.coloraxis?.colorscale as Array<[number, string]>;\n const colorValues = series.marker?.color as number[];\n const [dMin, dMax] = [\n layout?.coloraxis?.cmin ?? Math.min(...colorValues),\n layout?.coloraxis?.cmax ?? Math.max(...colorValues),\n ];\n\n // Normalize colorscale domain to actual data domain\n const scaleDomain = scale.map(([pos]) => dMin + pos * (dMax - dMin));\n const scaleColors = scale.map(item => item[1]);\n\n return d3ScaleLinear<string>().domain(scaleDomain).range(scaleColors);\n }\n return currentColorScale;\n};\n"],"names":["React","color","d3Color","isArrayOrTypedArray","areArraysEqual","DataVizPalette","getColorFromToken","getNextColor","scaleLinear","d3ScaleLinear","DEFAULT_PLOTLY_COLORWAY","DEFAULT_D3_COLORWAY","PLOTLY_FLUENTVIZ_COLORWAY_MAPPING","color1","warning","color8","color4","color7","color6","color2","color5","color9","color10","D3_FLUENTVIZ_COLORWAY_MAPPING","color26","error","color17","color22","disabled","color3","getPlotlyColorway","colorway","isDonut","lower","map","c","toLowerCase","tryMapFluentDataViz","hexColor","templateColorway","isDarkTheme","defaultColorway","defaultMapping","idx","indexOf","getColor","legendLabel","colorMap","current","has","nextColor","defaultColorMapping","size","length","set","get","getSchemaColors","colors","hexColors","undefined","forEach","element","index","colorString","toString","trim","nextFluentColor","parsedColor","push","formatHex","extractColor","colorwayType","resolveColor","extractedColors","legend","getOpacity","series","marker","opacity","createColorScale","layout","currentColorScale","coloraxis","colorscale","scale","colorValues","dMin","dMax","cmin","Math","min","cmax","max","scaleDomain","pos","scaleColors","item","domain","range"],"mappings":"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"}
|
|
@@ -182,7 +182,8 @@ const getSecondaryYAxisValues = (data, layout)=>{
|
|
|
182
182
|
}
|
|
183
183
|
};
|
|
184
184
|
};
|
|
185
|
-
export const _getGaugeAxisColor = (colorway, colorwayType, color,
|
|
185
|
+
export const _getGaugeAxisColor = (colorway, colorwayType, color, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
186
|
+
colorMap, isDarkTheme)=>{
|
|
186
187
|
const extractedColors = extractColor(colorway, colorwayType, color, colorMap, isDarkTheme);
|
|
187
188
|
return resolveColor(extractedColors, 0, '', colorMap, colorway, isDarkTheme);
|
|
188
189
|
};
|
|
@@ -319,7 +320,8 @@ export const resolveXAxisPoint = (x, isXYearCategory, isXString, isXDate, isXNum
|
|
|
319
320
|
x
|
|
320
321
|
};
|
|
321
322
|
};
|
|
322
|
-
export const transformPlotlyJsonToDonutProps = (input, isMultiPlot,
|
|
323
|
+
export const transformPlotlyJsonToDonutProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
324
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
323
325
|
var _input_layout, _input_layout_template_layout, _input_layout_template, _input_layout1, _input_layout2, _firstData_marker, _input_layout3, _input_layout4, _input_layout5, _input_layout6;
|
|
324
326
|
const firstData = input.data[0];
|
|
325
327
|
var _input_layout_piecolorway, _input_layout_piecolorway1;
|
|
@@ -408,7 +410,8 @@ export const transformPlotlyJsonToDonutProps = (input, isMultiPlot, colorMap, co
|
|
|
408
410
|
order: 'sorted'
|
|
409
411
|
};
|
|
410
412
|
};
|
|
411
|
-
export const transformPlotlyJsonToVSBCProps = (input, isMultiPlot,
|
|
413
|
+
export const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
414
|
+
colorMap, colorwayType, isDarkTheme, fallbackVSBC)=>{
|
|
412
415
|
var _input_layout, _input_layout1, _input_layout2, _vsbcData_;
|
|
413
416
|
const mapXToDataPoints = {};
|
|
414
417
|
let yMaxValue = 0;
|
|
@@ -585,7 +588,8 @@ export const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, colorMap, col
|
|
|
585
588
|
...getAxisTickProps(input.data, input.layout)
|
|
586
589
|
};
|
|
587
590
|
};
|
|
588
|
-
export const transformPlotlyJsonToGVBCProps = (input, isMultiPlot,
|
|
591
|
+
export const transformPlotlyJsonToGVBCProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
592
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
589
593
|
var _processedInput_layout, _processedInput_layout1;
|
|
590
594
|
// Handle object arrays in y values by normalizing the data first
|
|
591
595
|
let processedInput = {
|
|
@@ -710,7 +714,8 @@ export const transformPlotlyJsonToGVBCProps = (input, isMultiPlot, colorMap, col
|
|
|
710
714
|
...getAxisTickProps(processedInput.data, processedInput.layout)
|
|
711
715
|
};
|
|
712
716
|
};
|
|
713
|
-
export const transformPlotlyJsonToVBCProps = (input, isMultiPlot,
|
|
717
|
+
export const transformPlotlyJsonToVBCProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
718
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
714
719
|
var _input_layout, _input_layout1, _vbcData_;
|
|
715
720
|
const vbcData = [];
|
|
716
721
|
const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
|
|
@@ -788,13 +793,16 @@ export const transformPlotlyJsonToVBCProps = (input, isMultiPlot, colorMap, colo
|
|
|
788
793
|
...getAxisCategoryOrderProps(input.data, input.layout)
|
|
789
794
|
};
|
|
790
795
|
};
|
|
791
|
-
export const transformPlotlyJsonToAreaChartProps = (input, isMultiPlot,
|
|
796
|
+
export const transformPlotlyJsonToAreaChartProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
797
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
792
798
|
return transformPlotlyJsonToScatterTraceProps(input, isMultiPlot, 'area', colorMap, colorwayType, isDarkTheme);
|
|
793
799
|
};
|
|
794
|
-
export const transformPlotlyJsonToLineChartProps = (input, isMultiPlot,
|
|
800
|
+
export const transformPlotlyJsonToLineChartProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
801
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
795
802
|
return transformPlotlyJsonToScatterTraceProps(input, isMultiPlot, 'line', colorMap, colorwayType, isDarkTheme);
|
|
796
803
|
};
|
|
797
|
-
export const transformPlotlyJsonToScatterChartProps = (input, isMultiPlot,
|
|
804
|
+
export const transformPlotlyJsonToScatterChartProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
805
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
798
806
|
return transformPlotlyJsonToScatterTraceProps(input, isMultiPlot, 'scatter', colorMap, colorwayType, isDarkTheme);
|
|
799
807
|
};
|
|
800
808
|
const mapColorFillBars = (layout)=>{
|
|
@@ -818,7 +826,8 @@ const mapColorFillBars = (layout)=>{
|
|
|
818
826
|
};
|
|
819
827
|
});
|
|
820
828
|
};
|
|
821
|
-
const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType,
|
|
829
|
+
const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
830
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
822
831
|
var _input_data_, _chartData__data_, _chartData_, _chartData__data_1, _chartData_1, _chartData__data_2, _chartData_2, _chartData__data_3, _chartData_3, _input_layout, _input_layout1, _input_layout2;
|
|
823
832
|
const isScatterMarkers = [
|
|
824
833
|
'text',
|
|
@@ -1018,7 +1027,8 @@ const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, c
|
|
|
1018
1027
|
};
|
|
1019
1028
|
}
|
|
1020
1029
|
};
|
|
1021
|
-
export const transformPlotlyJsonToHorizontalBarWithAxisProps = (input, isMultiPlot,
|
|
1030
|
+
export const transformPlotlyJsonToHorizontalBarWithAxisProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
1031
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
1022
1032
|
var _input_layout, _input_layout_margin, _input_layout1, _input_layout_margin1, _input_layout2, _input_layout_yaxis2, _input_layout3, _input_layout_yaxis21, _input_layout4, _input_layout_yaxis2_title, _input_layout_yaxis22, _input_layout5, _input_layout6;
|
|
1023
1033
|
const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
|
|
1024
1034
|
let colorScale = undefined;
|
|
@@ -1076,7 +1086,8 @@ export const transformPlotlyJsonToHorizontalBarWithAxisProps = (input, isMultiPl
|
|
|
1076
1086
|
...getAxisTickProps(input.data, input.layout)
|
|
1077
1087
|
};
|
|
1078
1088
|
};
|
|
1079
|
-
export const transformPlotlyJsonToGanttChartProps = (input, isMultiPlot,
|
|
1089
|
+
export const transformPlotlyJsonToGanttChartProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
1090
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
1080
1091
|
var _input_layout, _input_layout1;
|
|
1081
1092
|
const data = input.data.filter((series)=>series.type !== 'scatter' || series.mode !== 'markers');
|
|
1082
1093
|
const { legends, hideLegend } = getLegendProps(data, input.layout, isMultiPlot);
|
|
@@ -1158,7 +1169,8 @@ export const transformPlotlyJsonToGanttChartProps = (input, isMultiPlot, colorMa
|
|
|
1158
1169
|
...getAxisTickProps(data, input.layout)
|
|
1159
1170
|
};
|
|
1160
1171
|
};
|
|
1161
|
-
export const transformPlotlyJsonToHeatmapProps = (input, isMultiPlot,
|
|
1172
|
+
export const transformPlotlyJsonToHeatmapProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
1173
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
1162
1174
|
var _input_layout, _input_layout_coloraxis, _input_layout1, _input_layout_template_layout, _input_layout_template, _input_layout2, _input_layout_template_data_histogram2d_, _input_layout_template_data_histogram2d, _input_layout_template_data, _input_layout_template1, _input_layout3, _input_layout_template_data_heatmap_, _input_layout_template_data_heatmap, _input_layout_template_data1, _input_layout_template2, _input_layout4, _input_layout5, _input_layout6;
|
|
1163
1175
|
const firstData = input.data[0];
|
|
1164
1176
|
const heatmapDataPoints = [];
|
|
@@ -1293,7 +1305,8 @@ export const transformPlotlyJsonToHeatmapProps = (input, isMultiPlot, colorMap,
|
|
|
1293
1305
|
...getAxisTickProps(input.data, input.layout)
|
|
1294
1306
|
};
|
|
1295
1307
|
};
|
|
1296
|
-
export const transformPlotlyJsonToSankeyProps = (input, isMultiPlot,
|
|
1308
|
+
export const transformPlotlyJsonToSankeyProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
1309
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
1297
1310
|
var _input_layout_template_layout, _input_layout_template, _input_layout, _node_label, _input_layout1, _input_layout2;
|
|
1298
1311
|
const { link, node } = input.data[0];
|
|
1299
1312
|
var _link_value;
|
|
@@ -1343,7 +1356,8 @@ export const transformPlotlyJsonToSankeyProps = (input, isMultiPlot, colorMap, c
|
|
|
1343
1356
|
height: (_input_layout_height = (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 468
|
|
1344
1357
|
};
|
|
1345
1358
|
};
|
|
1346
|
-
export const transformPlotlyJsonToGaugeProps = (input, isMultiPlot,
|
|
1359
|
+
export const transformPlotlyJsonToGaugeProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
1360
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
1347
1361
|
var _firstData_gauge, _input_layout_template_layout, _input_layout_template, _input_layout, _firstData_gauge_steps, _firstData_gauge1, _firstData_gauge_axis_range, _firstData_gauge_axis, _firstData_gauge2, _input_layout_template_layout1, _input_layout_template1, _input_layout1, _firstData_gauge_axis1, _firstData_gauge3, _firstData_gauge_axis_range1, _firstData_gauge_axis2, _firstData_gauge4, _firstData_delta, _firstData_gauge_axis_range2, _firstData_gauge_axis3, _firstData_gauge5, _firstData_gauge_axis_range3, _firstData_gauge_axis4, _firstData_gauge6, _firstData_gauge_axis_range4, _firstData_gauge_axis5, _firstData_gauge7, _firstData_gauge_axis_range5, _firstData_gauge_axis6, _firstData_gauge8, _input_layout2, _input_layout3, _firstData_gauge_steps1, _firstData_gauge9;
|
|
1348
1362
|
const firstData = input.data[0];
|
|
1349
1363
|
const stepsColors = ((_firstData_gauge = firstData.gauge) === null || _firstData_gauge === void 0 ? void 0 : _firstData_gauge.steps) ? firstData.gauge.steps.map((step)=>step.color) : undefined;
|
|
@@ -1469,7 +1483,8 @@ function mergeCells(tableCells, templateCells) {
|
|
|
1469
1483
|
suffix: (_tableCells_suffix = tableCells === null || tableCells === void 0 ? void 0 : tableCells.suffix) !== null && _tableCells_suffix !== void 0 ? _tableCells_suffix : templateCells === null || templateCells === void 0 ? void 0 : templateCells.suffix
|
|
1470
1484
|
};
|
|
1471
1485
|
}
|
|
1472
|
-
export const transformPlotlyJsonToChartTableProps = (input, isMultiPlot,
|
|
1486
|
+
export const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
1487
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
1473
1488
|
var _tableData_cells, _input_layout_template_data_table_, _input_layout_template_data_table, _input_layout_template_data, _input_layout_template, _input_layout, _input_layout_font, _input_layout1, _input_layout_template_data_table_1, _input_layout_template_data_table1, _input_layout_template_data1, _input_layout_template1, _input_layout2, _tableData_header, _input_layout3, _input_layout4;
|
|
1474
1489
|
const tableData = input.data[0];
|
|
1475
1490
|
const normalizeHeaders = (values, header)=>{
|
|
@@ -1622,7 +1637,8 @@ function getCategoriesAndValues(series) {
|
|
|
1622
1637
|
}
|
|
1623
1638
|
}
|
|
1624
1639
|
}
|
|
1625
|
-
export const transformPlotlyJsonToFunnelChartProps = (input, isMultiPlot,
|
|
1640
|
+
export const transformPlotlyJsonToFunnelChartProps = (input, isMultiPlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
1641
|
+
colorMap, colorwayType, isDarkTheme)=>{
|
|
1626
1642
|
var _input_layout, _input_layout1, _input_data_, _input_layout2;
|
|
1627
1643
|
const funnelData = [];
|
|
1628
1644
|
// Determine if data is stacked based on multiple series with multiple values per series
|
|
@@ -2019,7 +2035,8 @@ const getLegendShape = (series)=>{
|
|
|
2019
2035
|
}
|
|
2020
2036
|
return 'default';
|
|
2021
2037
|
};
|
|
2022
|
-
export const getAllupLegendsProps = (input,
|
|
2038
|
+
export const getAllupLegendsProps = (input, // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
2039
|
+
colorMap, colorwayType, traceInfo, isDarkTheme)=>{
|
|
2023
2040
|
const allupLegends = [];
|
|
2024
2041
|
// reduce on showlegend boolean propperty. reduce should return true if at least one series has showlegend true
|
|
2025
2042
|
const toShowLegend = input.data.reduce((acc, series)=>{
|