@fluentui/react-charting 5.23.70 → 5.23.72
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.json +75 -1
- package/CHANGELOG.md +26 -2
- package/dist/react-charting.js +1 -1
- package/dist/react-charting.min.js +1 -1
- package/lib/components/DeclarativeChart/DeclarativeChart.js +1 -1
- package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +175 -82
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +29 -27
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.d.ts +1 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +59 -22
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.base.js +7 -2
- package/lib/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib/utilities/utilities.d.ts +14 -0
- package/lib/utilities/utilities.js +32 -1
- package/lib/utilities/utilities.js.map +1 -1
- package/lib-amd/components/DeclarativeChart/DeclarativeChart.js +1 -1
- package/lib-amd/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js +175 -81
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +29 -27
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.d.ts +1 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +58 -21
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -1
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js +7 -2
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib-amd/utilities/utilities.d.ts +14 -0
- package/lib-amd/utilities/utilities.js +35 -2
- package/lib-amd/utilities/utilities.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +1 -1
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +174 -81
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +29 -27
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.d.ts +1 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +58 -21
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js +7 -2
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib-commonjs/utilities/utilities.d.ts +14 -0
- package/lib-commonjs/utilities/utilities.js +36 -2
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/package.json +4 -4
|
@@ -143,7 +143,7 @@ export var DeclarativeChart = React.forwardRef(function (props, forwardedRef) {
|
|
|
143
143
|
case 'line':
|
|
144
144
|
case 'fallback':
|
|
145
145
|
// Need recheck for area chart as we don't have ability to check for valid months in previous step
|
|
146
|
-
var isAreaChart = plotlyInputWithValidData.data.some(function (series) { return series.fill === 'tonexty' || series.fill === 'tozeroy'; });
|
|
146
|
+
var isAreaChart = plotlyInputWithValidData.data.some(function (series) { return series.fill === 'tonexty' || series.fill === 'tozeroy' || !!series.stackgroup; });
|
|
147
147
|
return checkAndRenderChart(isAreaChart);
|
|
148
148
|
default:
|
|
149
149
|
throw new Error("Unsupported chart type :".concat((_b = plotlyInputWithValidData.data[0]) === null || _b === void 0 ? void 0 : _b.type));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DeclarativeChart.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/DeclarativeChart.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport { useTheme } from '@fluentui/react';\nimport { IRefObject } from '@fluentui/react/lib/Utilities';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { decodeBase64Fields } from '@fluentui/chart-utilities';\nimport type { Data, PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport {\n isArrayOrTypedArray,\n isDateArray,\n isNumberArray,\n mapFluentChart,\n sanitizeJson,\n} from '@fluentui/chart-utilities';\n\nimport {\n isMonthArray,\n correctYearMonth,\n transformPlotlyJsonToDonutProps,\n transformPlotlyJsonToVSBCProps,\n transformPlotlyJsonToScatterChartProps,\n transformPlotlyJsonToHorizontalBarWithAxisProps,\n transformPlotlyJsonToHeatmapProps,\n transformPlotlyJsonToSankeyProps,\n transformPlotlyJsonToGaugeProps,\n transformPlotlyJsonToGVBCProps,\n transformPlotlyJsonToVBCProps,\n} from './PlotlySchemaAdapter';\nimport { LineChart, ILineChartProps } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart, IAreaChartProps } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { IChart, IImageExportOptions } from '../../types/index';\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\n\n/**\n * DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n */\nexport interface Schema {\n /**\n * Plotly schema represented as JSON object\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n plotlySchema: any;\n}\n\n/**\n * DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n */\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n /**\n * The schema representing the chart data, layout and configuration\n */\n chartSchema: Schema;\n\n /**\n * Callback when an event occurs\n */\n onSchemaChange?: (eventData: Schema) => void;\n\n /**\n * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: IRefObject<IDeclarativeChart>;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n exportAsImage: (opts?: IImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n const colorMap = React.useRef(new Map<string, string>());\n return colorMap;\n};\n\n/**\n * DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n HTMLDivElement,\n DeclarativeChartProps\n>((props, forwardedRef) => {\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n const chart: OutputChartType = mapFluentChart(plotlySchema);\n if (!chart.isValid) {\n throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n }\n let plotlyInput = plotlySchema as PlotlySchema;\n try {\n plotlyInput = decodeBase64Fields(plotlyInput);\n } catch (error) {\n throw new Error(`Failed to decode plotly schema: ${error}`);\n }\n const plotlyInputWithValidData: PlotlySchema = {\n ...plotlyInput,\n data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace[0]]),\n };\n\n let { selectedLegends } = plotlySchema;\n const colorMap = useColorMapping();\n const theme = useTheme();\n const isDarkTheme = theme?.isInverted ?? false;\n const chartRef = React.useRef<IChart>(null);\n\n if (!isArrayOrTypedArray(selectedLegends)) {\n selectedLegends = [];\n }\n\n const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n const onActiveLegendsChange = (keys: string[]) => {\n setActiveLegends(keys);\n if (props.onSchemaChange) {\n props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n }\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { selectedLegends } = plotlySchema;\n setActiveLegends(selectedLegends ?? []);\n }, [props.chartSchema]);\n\n const multiSelectLegendProps = {\n canSelectMultipleLegends: true,\n onChange: onActiveLegendsChange,\n selectedLegends: activeLegends,\n };\n\n const commonProps = {\n legendProps: multiSelectLegendProps,\n componentRef: chartRef,\n calloutProps: { layerProps: { eventBubblingEnabled: true } },\n };\n\n const renderLineArea = (plotlyData: Data[], isAreaChart: boolean): JSX.Element => {\n const isScatterMarkers = (plotlyData[0] as PlotData)?.mode === 'markers';\n const chartProps: ILineChartProps | IAreaChartProps = {\n ...transformPlotlyJsonToScatterChartProps(\n { data: plotlyData, layout: plotlyInput.layout },\n isAreaChart,\n colorMap,\n isDarkTheme,\n ),\n ...commonProps,\n };\n if (isAreaChart) {\n return <ResponsiveAreaChart {...chartProps} />;\n }\n return <ResponsiveLineChart {...chartProps} lineMode={isScatterMarkers ? 'scatter' : 'default'} />;\n };\n\n const checkAndRenderChart = (isAreaChart: boolean = false) => {\n let fallbackVSBC = false;\n const xValues = (plotlyInputWithValidData.data[0] as PlotData).x;\n const isXDate = isDateArray(xValues);\n const isXNumber = isNumberArray(xValues);\n const isXMonth = isMonthArray(xValues);\n if (isXDate || isXNumber) {\n return renderLineArea(plotlyInputWithValidData.data, isAreaChart);\n } else if (isXMonth) {\n const updatedData = plotlyInputWithValidData.data.map((dataPoint: PlotData) => ({\n ...dataPoint,\n x: correctYearMonth(dataPoint.x),\n }));\n return renderLineArea(updatedData, isAreaChart);\n }\n // Unsupported schema, render as VerticalStackedBarChart\n fallbackVSBC = true;\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme, fallbackVSBC)}\n {...commonProps}\n />\n );\n };\n\n const exportAsImage = React.useCallback(\n (opts?: IImageExportOptions): Promise<string> => {\n return new Promise((resolve, reject) => {\n if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {\n return reject(Error('Chart cannot be exported as image'));\n }\n\n chartRef.current\n .toImage({\n background: theme.semanticColors.bodyBackground,\n scale: 5,\n ...opts,\n })\n .then(resolve)\n .catch(reject);\n });\n },\n [theme],\n );\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n exportAsImage,\n }),\n [exportAsImage],\n );\n\n switch (chart.type) {\n case 'donut':\n return (\n <ResponsiveDonutChart\n {...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'horizontalbar':\n return (\n <ResponsiveHorizontalBarChartWithAxis\n {...transformPlotlyJsonToHorizontalBarWithAxisProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'groupedverticalbar':\n return (\n <ResponsiveGroupedVerticalBarChart\n {...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalstackedbar':\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'heatmap':\n return (\n <ResponsiveHeatMapChart\n {...transformPlotlyJsonToHeatmapProps(plotlyInputWithValidData)}\n {...commonProps}\n legendProps={{}}\n />\n );\n case 'sankey':\n return (\n <ResponsiveSankeyChart\n {...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'gauge':\n return (\n <ResponsiveGaugeChart\n {...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalbar':\n return (\n <ResponsiveVerticalBarChart\n {...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'area':\n case 'line':\n case 'fallback':\n // Need recheck for area chart as we don't have ability to check for valid months in previous step\n const isAreaChart = plotlyInputWithValidData.data.some(\n (series: PlotData) => series.fill === 'tonexty' || series.fill === 'tozeroy',\n );\n return checkAndRenderChart(isAreaChart);\n default:\n throw new Error(`Unsupported chart type :${plotlyInputWithValidData.data[0]?.type}`);\n }\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\n"]}
|
|
1
|
+
{"version":3,"file":"DeclarativeChart.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/DeclarativeChart.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport { useTheme } from '@fluentui/react';\nimport { IRefObject } from '@fluentui/react/lib/Utilities';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { decodeBase64Fields } from '@fluentui/chart-utilities';\nimport type { Data, PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport {\n isArrayOrTypedArray,\n isDateArray,\n isNumberArray,\n mapFluentChart,\n sanitizeJson,\n} from '@fluentui/chart-utilities';\n\nimport {\n isMonthArray,\n correctYearMonth,\n transformPlotlyJsonToDonutProps,\n transformPlotlyJsonToVSBCProps,\n transformPlotlyJsonToScatterChartProps,\n transformPlotlyJsonToHorizontalBarWithAxisProps,\n transformPlotlyJsonToHeatmapProps,\n transformPlotlyJsonToSankeyProps,\n transformPlotlyJsonToGaugeProps,\n transformPlotlyJsonToGVBCProps,\n transformPlotlyJsonToVBCProps,\n} from './PlotlySchemaAdapter';\nimport { LineChart, ILineChartProps } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart, IAreaChartProps } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { IChart, IImageExportOptions } from '../../types/index';\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\n\n/**\n * DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n */\nexport interface Schema {\n /**\n * Plotly schema represented as JSON object\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n plotlySchema: any;\n}\n\n/**\n * DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n */\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n /**\n * The schema representing the chart data, layout and configuration\n */\n chartSchema: Schema;\n\n /**\n * Callback when an event occurs\n */\n onSchemaChange?: (eventData: Schema) => void;\n\n /**\n * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: IRefObject<IDeclarativeChart>;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n exportAsImage: (opts?: IImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n const colorMap = React.useRef(new Map<string, string>());\n return colorMap;\n};\n\n/**\n * DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n HTMLDivElement,\n DeclarativeChartProps\n>((props, forwardedRef) => {\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n const chart: OutputChartType = mapFluentChart(plotlySchema);\n if (!chart.isValid) {\n throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n }\n let plotlyInput = plotlySchema as PlotlySchema;\n try {\n plotlyInput = decodeBase64Fields(plotlyInput);\n } catch (error) {\n throw new Error(`Failed to decode plotly schema: ${error}`);\n }\n const plotlyInputWithValidData: PlotlySchema = {\n ...plotlyInput,\n data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace[0]]),\n };\n\n let { selectedLegends } = plotlySchema;\n const colorMap = useColorMapping();\n const theme = useTheme();\n const isDarkTheme = theme?.isInverted ?? false;\n const chartRef = React.useRef<IChart>(null);\n\n if (!isArrayOrTypedArray(selectedLegends)) {\n selectedLegends = [];\n }\n\n const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n const onActiveLegendsChange = (keys: string[]) => {\n setActiveLegends(keys);\n if (props.onSchemaChange) {\n props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n }\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { selectedLegends } = plotlySchema;\n setActiveLegends(selectedLegends ?? []);\n }, [props.chartSchema]);\n\n const multiSelectLegendProps = {\n canSelectMultipleLegends: true,\n onChange: onActiveLegendsChange,\n selectedLegends: activeLegends,\n };\n\n const commonProps = {\n legendProps: multiSelectLegendProps,\n componentRef: chartRef,\n calloutProps: { layerProps: { eventBubblingEnabled: true } },\n };\n\n const renderLineArea = (plotlyData: Data[], isAreaChart: boolean): JSX.Element => {\n const isScatterMarkers = (plotlyData[0] as PlotData)?.mode === 'markers';\n const chartProps: ILineChartProps | IAreaChartProps = {\n ...transformPlotlyJsonToScatterChartProps(\n { data: plotlyData, layout: plotlyInput.layout },\n isAreaChart,\n colorMap,\n isDarkTheme,\n ),\n ...commonProps,\n };\n if (isAreaChart) {\n return <ResponsiveAreaChart {...chartProps} />;\n }\n return <ResponsiveLineChart {...chartProps} lineMode={isScatterMarkers ? 'scatter' : 'default'} />;\n };\n\n const checkAndRenderChart = (isAreaChart: boolean = false) => {\n let fallbackVSBC = false;\n const xValues = (plotlyInputWithValidData.data[0] as PlotData).x;\n const isXDate = isDateArray(xValues);\n const isXNumber = isNumberArray(xValues);\n const isXMonth = isMonthArray(xValues);\n if (isXDate || isXNumber) {\n return renderLineArea(plotlyInputWithValidData.data, isAreaChart);\n } else if (isXMonth) {\n const updatedData = plotlyInputWithValidData.data.map((dataPoint: PlotData) => ({\n ...dataPoint,\n x: correctYearMonth(dataPoint.x),\n }));\n return renderLineArea(updatedData, isAreaChart);\n }\n // Unsupported schema, render as VerticalStackedBarChart\n fallbackVSBC = true;\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme, fallbackVSBC)}\n {...commonProps}\n />\n );\n };\n\n const exportAsImage = React.useCallback(\n (opts?: IImageExportOptions): Promise<string> => {\n return new Promise((resolve, reject) => {\n if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {\n return reject(Error('Chart cannot be exported as image'));\n }\n\n chartRef.current\n .toImage({\n background: theme.semanticColors.bodyBackground,\n scale: 5,\n ...opts,\n })\n .then(resolve)\n .catch(reject);\n });\n },\n [theme],\n );\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n exportAsImage,\n }),\n [exportAsImage],\n );\n\n switch (chart.type) {\n case 'donut':\n return (\n <ResponsiveDonutChart\n {...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'horizontalbar':\n return (\n <ResponsiveHorizontalBarChartWithAxis\n {...transformPlotlyJsonToHorizontalBarWithAxisProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'groupedverticalbar':\n return (\n <ResponsiveGroupedVerticalBarChart\n {...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalstackedbar':\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'heatmap':\n return (\n <ResponsiveHeatMapChart\n {...transformPlotlyJsonToHeatmapProps(plotlyInputWithValidData)}\n {...commonProps}\n legendProps={{}}\n />\n );\n case 'sankey':\n return (\n <ResponsiveSankeyChart\n {...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'gauge':\n return (\n <ResponsiveGaugeChart\n {...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalbar':\n return (\n <ResponsiveVerticalBarChart\n {...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'area':\n case 'line':\n case 'fallback':\n // Need recheck for area chart as we don't have ability to check for valid months in previous step\n const isAreaChart = plotlyInputWithValidData.data.some(\n (series: PlotData) => series.fill === 'tonexty' || series.fill === 'tozeroy' || !!series.stackgroup,\n );\n return checkAndRenderChart(isAreaChart);\n default:\n throw new Error(`Unsupported chart type :${plotlyInputWithValidData.data[0]?.type}`);\n }\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\n"]}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { __assign } from "tslib";
|
|
2
|
-
import { bin as d3Bin, extent as d3Extent, sum as d3Sum, min as d3Min, max as d3Max,
|
|
2
|
+
import { bin as d3Bin, extent as d3Extent, sum as d3Sum, min as d3Min, max as d3Max, range as d3Range, } from 'd3-array';
|
|
3
3
|
import { scaleLinear as d3ScaleLinear } from 'd3-scale';
|
|
4
|
-
import { format as d3Format, precisionFixed as d3PrecisionFixed } from 'd3-format';
|
|
5
4
|
import { DataVizPalette, getColorFromToken, getNextColor } from '../../utilities/colors';
|
|
6
5
|
import { GaugeChartVariant } from '../GaugeChart/index';
|
|
7
6
|
import { findNumericMinMaxOfY } from '../../utilities/utilities';
|
|
@@ -268,69 +267,34 @@ export var transformPlotlyJsonToGVBCProps = function (input, colorMap, isDarkThe
|
|
|
268
267
|
export var transformPlotlyJsonToVBCProps = function (input, colorMap, isDarkTheme) {
|
|
269
268
|
var _a, _b, _c;
|
|
270
269
|
var vbcData = [];
|
|
271
|
-
input.data.forEach(function (series,
|
|
270
|
+
input.data.forEach(function (series, seriesIdx) {
|
|
272
271
|
var _a, _b, _c;
|
|
273
272
|
if (!series.x) {
|
|
274
273
|
return;
|
|
275
274
|
}
|
|
276
|
-
var
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
var
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
var th = xMin;
|
|
286
|
-
var precision = d3PrecisionFixed(series.xbins.size);
|
|
287
|
-
var format = d3Format(".".concat(precision, "f"));
|
|
288
|
-
while (th < xMax + series.xbins.size) {
|
|
289
|
-
thresholds.push(parseFloat(format(th)));
|
|
290
|
-
th += series.xbins.size;
|
|
275
|
+
var isXString = isStringArray(series.x);
|
|
276
|
+
var xBins = createBins(series.x, (_a = series.xbins) === null || _a === void 0 ? void 0 : _a.start, (_b = series.xbins) === null || _b === void 0 ? void 0 : _b.end, (_c = series.xbins) === null || _c === void 0 ? void 0 : _c.size);
|
|
277
|
+
var yBins = xBins.map(function () { return []; });
|
|
278
|
+
var total = 0;
|
|
279
|
+
series.x.forEach(function (xVal, index) {
|
|
280
|
+
var _a, _b;
|
|
281
|
+
var binIdx = findBinIndex(xBins, xVal, isXString);
|
|
282
|
+
if (binIdx !== -1) {
|
|
283
|
+
yBins[binIdx].push((_b = (_a = series.y) === null || _a === void 0 ? void 0 : _a[index]) !== null && _b !== void 0 ? _b : 1);
|
|
291
284
|
}
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
var legend = getLegend(series, index);
|
|
285
|
+
});
|
|
286
|
+
var y = yBins.map(function (bin) {
|
|
287
|
+
var yVal = calculateHistFunc(series.histfunc, bin);
|
|
288
|
+
total += yVal;
|
|
289
|
+
return yVal;
|
|
290
|
+
});
|
|
291
|
+
xBins.forEach(function (bin, index) {
|
|
292
|
+
var legend = getLegend(series, seriesIdx);
|
|
301
293
|
var color = getColor(legend, colorMap, isDarkTheme);
|
|
302
|
-
var
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
else if (series.histnorm === 'probability') {
|
|
307
|
-
y = bucket.length / totalDataPoints;
|
|
308
|
-
}
|
|
309
|
-
else if (series.histnorm === 'density') {
|
|
310
|
-
y = bucket.x0 === bucket.x1 ? 0 : bucket.length / (bucket.x1 - bucket.x0);
|
|
311
|
-
}
|
|
312
|
-
else if (series.histnorm === 'probability density') {
|
|
313
|
-
y = bucket.x0 === bucket.x1 ? 0 : bucket.length / (totalDataPoints * (bucket.x1 - bucket.x0));
|
|
314
|
-
}
|
|
315
|
-
else if (series.histfunc === 'sum') {
|
|
316
|
-
y = d3Sum(bucket);
|
|
317
|
-
}
|
|
318
|
-
else if (series.histfunc === 'avg') {
|
|
319
|
-
y = bucket.length === 0 ? 0 : d3Sum(bucket) / bucket.length;
|
|
320
|
-
}
|
|
321
|
-
else if (series.histfunc === 'min') {
|
|
322
|
-
y = d3Min(bucket);
|
|
323
|
-
}
|
|
324
|
-
else if (series.histfunc === 'max') {
|
|
325
|
-
y = d3Max(bucket);
|
|
326
|
-
}
|
|
327
|
-
vbcData.push({
|
|
328
|
-
x: (bucket.x1 + bucket.x0) / 2,
|
|
329
|
-
y: y,
|
|
330
|
-
legend: legend,
|
|
331
|
-
color: color,
|
|
332
|
-
xAxisCalloutData: "[".concat(bucket.x0, " - ").concat(bucket.x1, ")"),
|
|
333
|
-
});
|
|
294
|
+
var yVal = calculateHistNorm(series.histnorm, y[index], total, isXString ? bin.length : getBinSize(bin));
|
|
295
|
+
vbcData.push(__assign({ x: isXString ? bin.join(', ') : getBinCenter(bin), y: yVal, legend: legend, color: color }, (isXString
|
|
296
|
+
? {}
|
|
297
|
+
: { xAxisCalloutData: "[".concat(bin.x0, " - ").concat(bin.x1, ")") })));
|
|
334
298
|
});
|
|
335
299
|
});
|
|
336
300
|
var _d = getTitles(input.layout), chartTitle = _d.chartTitle, xAxisTitle = _d.xAxisTitle, yAxisTitle = _d.yAxisTitle;
|
|
@@ -412,11 +376,13 @@ export var transformPlotlyJsonToHorizontalBarWithAxisProps = function (input, co
|
|
|
412
376
|
var chartData = input.data
|
|
413
377
|
.map(function (series, index) {
|
|
414
378
|
return series.y.map(function (yValue, i) {
|
|
415
|
-
var
|
|
379
|
+
var _a;
|
|
380
|
+
var legendName = (_a = series.name) !== null && _a !== void 0 ? _a : yValue;
|
|
381
|
+
var color = getColor(legendName, colorMap, isDarkTheme);
|
|
416
382
|
return {
|
|
417
383
|
x: series.x[i],
|
|
418
384
|
y: yValue,
|
|
419
|
-
legend:
|
|
385
|
+
legend: legendName,
|
|
420
386
|
color: color,
|
|
421
387
|
};
|
|
422
388
|
});
|
|
@@ -428,7 +394,10 @@ export var transformPlotlyJsonToHorizontalBarWithAxisProps = function (input, co
|
|
|
428
394
|
var margin = (_e = (_d = (_c = input.layout) === null || _c === void 0 ? void 0 : _c.margin) === null || _d === void 0 ? void 0 : _d.l) !== null && _e !== void 0 ? _e : 0;
|
|
429
395
|
var padding = (_h = (_g = (_f = input.layout) === null || _f === void 0 ? void 0 : _f.margin) === null || _g === void 0 ? void 0 : _g.pad) !== null && _h !== void 0 ? _h : 0;
|
|
430
396
|
var availableHeight = chartHeight - margin - padding;
|
|
431
|
-
var numberOfBars = input.data
|
|
397
|
+
var numberOfBars = input.data.reduce(function (total, item) {
|
|
398
|
+
var _a;
|
|
399
|
+
return total + (((_a = item.y) === null || _a === void 0 ? void 0 : _a.length) || 0);
|
|
400
|
+
}, 0);
|
|
432
401
|
var scalingFactor = 0.01;
|
|
433
402
|
var gapFactor = 1 / (1 + scalingFactor * numberOfBars);
|
|
434
403
|
var barHeight = availableHeight / (numberOfBars * (1 + gapFactor));
|
|
@@ -449,30 +418,70 @@ export var transformPlotlyJsonToHorizontalBarWithAxisProps = function (input, co
|
|
|
449
418
|
};
|
|
450
419
|
};
|
|
451
420
|
export var transformPlotlyJsonToHeatmapProps = function (input) {
|
|
452
|
-
var _a, _b, _c, _d;
|
|
421
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
453
422
|
var firstData = input.data[0];
|
|
454
423
|
var heatmapDataPoints = [];
|
|
455
424
|
var zMin = Number.POSITIVE_INFINITY;
|
|
456
425
|
var zMax = Number.NEGATIVE_INFINITY;
|
|
457
|
-
(
|
|
458
|
-
var
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
if (
|
|
469
|
-
|
|
470
|
-
zMax = Math.max(zMax, zVal);
|
|
426
|
+
if (firstData.type === 'histogram2d') {
|
|
427
|
+
var isXString_1 = isStringArray(firstData.x);
|
|
428
|
+
var isYString_1 = isStringArray(firstData.y);
|
|
429
|
+
var xBins_1 = createBins(firstData.x, (_a = firstData.xbins) === null || _a === void 0 ? void 0 : _a.start, (_b = firstData.xbins) === null || _b === void 0 ? void 0 : _b.end, (_c = firstData.xbins) === null || _c === void 0 ? void 0 : _c.size);
|
|
430
|
+
var yBins_1 = createBins(firstData.y, (_d = firstData.ybins) === null || _d === void 0 ? void 0 : _d.start, (_e = firstData.ybins) === null || _e === void 0 ? void 0 : _e.end, (_f = firstData.ybins) === null || _f === void 0 ? void 0 : _f.size);
|
|
431
|
+
var zBins_1 = yBins_1.map(function () { return xBins_1.map(function () { return []; }); });
|
|
432
|
+
var total_1 = 0;
|
|
433
|
+
(_g = firstData.x) === null || _g === void 0 ? void 0 : _g.forEach(function (xVal, index) {
|
|
434
|
+
var _a, _b, _c;
|
|
435
|
+
var xBinIdx = findBinIndex(xBins_1, xVal, isXString_1);
|
|
436
|
+
var yBinIdx = findBinIndex(yBins_1, (_a = firstData.y) === null || _a === void 0 ? void 0 : _a[index], isYString_1);
|
|
437
|
+
if (xBinIdx !== -1 && yBinIdx !== -1) {
|
|
438
|
+
zBins_1[yBinIdx][xBinIdx].push((_c = (_b = firstData.z) === null || _b === void 0 ? void 0 : _b[index]) !== null && _c !== void 0 ? _c : 1);
|
|
471
439
|
}
|
|
472
440
|
});
|
|
473
|
-
|
|
441
|
+
var z_1 = zBins_1.map(function (row) {
|
|
442
|
+
return row.map(function (bin) {
|
|
443
|
+
var zVal = calculateHistFunc(firstData.histfunc, bin);
|
|
444
|
+
total_1 += zVal;
|
|
445
|
+
return zVal;
|
|
446
|
+
});
|
|
447
|
+
});
|
|
448
|
+
xBins_1.forEach(function (xBin, xIdx) {
|
|
449
|
+
yBins_1.forEach(function (yBin, yIdx) {
|
|
450
|
+
var zVal = calculateHistNorm(firstData.histnorm, z_1[yIdx][xIdx], total_1, isXString_1 ? xBin.length : getBinSize(xBin), isYString_1 ? yBin.length : getBinSize(yBin));
|
|
451
|
+
heatmapDataPoints.push({
|
|
452
|
+
x: isXString_1 ? xBin.join(', ') : getBinCenter(xBin),
|
|
453
|
+
y: isYString_1 ? yBin.join(', ') : getBinCenter(yBin),
|
|
454
|
+
value: zVal,
|
|
455
|
+
rectText: zVal,
|
|
456
|
+
});
|
|
457
|
+
if (typeof zVal === 'number') {
|
|
458
|
+
zMin = Math.min(zMin, zVal);
|
|
459
|
+
zMax = Math.max(zMax, zVal);
|
|
460
|
+
}
|
|
461
|
+
});
|
|
462
|
+
});
|
|
463
|
+
}
|
|
464
|
+
else {
|
|
465
|
+
(_h = firstData.x) === null || _h === void 0 ? void 0 : _h.forEach(function (xVal, xIdx) {
|
|
466
|
+
var _a;
|
|
467
|
+
(_a = firstData.y) === null || _a === void 0 ? void 0 : _a.forEach(function (yVal, yIdx) {
|
|
468
|
+
var _a, _b, _c, _d, _e, _f;
|
|
469
|
+
var zVal = (_b = (_a = firstData.z) === null || _a === void 0 ? void 0 : _a[yIdx]) === null || _b === void 0 ? void 0 : _b[xIdx];
|
|
470
|
+
heatmapDataPoints.push({
|
|
471
|
+
x: ((_d = (_c = input.layout) === null || _c === void 0 ? void 0 : _c.xaxis) === null || _d === void 0 ? void 0 : _d.type) === 'date' ? xVal : xVal !== null && xVal !== void 0 ? xVal : 0,
|
|
472
|
+
y: ((_f = (_e = input.layout) === null || _e === void 0 ? void 0 : _e.yaxis) === null || _f === void 0 ? void 0 : _f.type) === 'date' ? yVal : yVal,
|
|
473
|
+
value: zVal,
|
|
474
|
+
rectText: zVal,
|
|
475
|
+
});
|
|
476
|
+
if (typeof zVal === 'number') {
|
|
477
|
+
zMin = Math.min(zMin, zVal);
|
|
478
|
+
zMax = Math.max(zMax, zVal);
|
|
479
|
+
}
|
|
480
|
+
});
|
|
481
|
+
});
|
|
482
|
+
}
|
|
474
483
|
var heatmapData = {
|
|
475
|
-
legend: firstData.name,
|
|
484
|
+
legend: (_j = firstData.name) !== null && _j !== void 0 ? _j : '',
|
|
476
485
|
data: heatmapDataPoints,
|
|
477
486
|
value: 0,
|
|
478
487
|
};
|
|
@@ -489,7 +498,7 @@ export var transformPlotlyJsonToHeatmapProps = function (input) {
|
|
|
489
498
|
var rangeValuesForColorScale = Array.isArray(firstData.colorscale)
|
|
490
499
|
? firstData.colorscale.map(function (arr) { return arr[1]; })
|
|
491
500
|
: defaultRange;
|
|
492
|
-
var
|
|
501
|
+
var _o = getTitles(input.layout), chartTitle = _o.chartTitle, xAxisTitle = _o.xAxisTitle, yAxisTitle = _o.yAxisTitle;
|
|
493
502
|
return {
|
|
494
503
|
data: [heatmapData],
|
|
495
504
|
domainValuesForColorScale: domainValuesForColorScale,
|
|
@@ -500,8 +509,8 @@ export var transformPlotlyJsonToHeatmapProps = function (input) {
|
|
|
500
509
|
xAxisTitle: xAxisTitle,
|
|
501
510
|
yAxisTitle: yAxisTitle,
|
|
502
511
|
sortOrder: 'none',
|
|
503
|
-
width: (
|
|
504
|
-
height: (
|
|
512
|
+
width: (_k = input.layout) === null || _k === void 0 ? void 0 : _k.width,
|
|
513
|
+
height: (_m = (_l = input.layout) === null || _l === void 0 ? void 0 : _l.height) !== null && _m !== void 0 ? _m : 350,
|
|
505
514
|
hideTickOverlap: true,
|
|
506
515
|
};
|
|
507
516
|
};
|
|
@@ -677,4 +686,88 @@ function getLineOptions(line) {
|
|
|
677
686
|
}
|
|
678
687
|
return Object.keys(lineOptions).length > 0 ? lineOptions : undefined;
|
|
679
688
|
}
|
|
689
|
+
var isStringArray = function (arr) {
|
|
690
|
+
return isArrayOfType(arr, function (value) { return typeof value === 'string'; });
|
|
691
|
+
};
|
|
692
|
+
// TODO: Use binary search to find the appropriate bin for numeric value.
|
|
693
|
+
var findBinIndex = function (bins, value, isString) {
|
|
694
|
+
if (typeof value === 'undefined' || value === null) {
|
|
695
|
+
return -1;
|
|
696
|
+
}
|
|
697
|
+
return isString
|
|
698
|
+
? bins.findIndex(function (bin) { return bin.includes(value); })
|
|
699
|
+
: bins.findIndex(function (bin) { return value >= bin.x0 && value < bin.x1; });
|
|
700
|
+
};
|
|
701
|
+
var getBinSize = function (bin) {
|
|
702
|
+
return bin.x1 - bin.x0;
|
|
703
|
+
};
|
|
704
|
+
var getBinCenter = function (bin) {
|
|
705
|
+
return (bin.x1 + bin.x0) / 2;
|
|
706
|
+
};
|
|
707
|
+
// TODO: Add support for date axes
|
|
708
|
+
var createBins = function (data, binStart, binEnd, binSize) {
|
|
709
|
+
var _a, _b;
|
|
710
|
+
if (!data || data.length === 0) {
|
|
711
|
+
return [];
|
|
712
|
+
}
|
|
713
|
+
if (isStringArray(data)) {
|
|
714
|
+
var categories_1 = Array.from(new Set(data));
|
|
715
|
+
var start = typeof binStart === 'number' ? Math.ceil(binStart) : 0;
|
|
716
|
+
var stop_1 = typeof binEnd === 'number' ? Math.floor(binEnd) + 1 : categories_1.length;
|
|
717
|
+
var step_1 = typeof binSize === 'number' ? binSize : 1;
|
|
718
|
+
return d3Range(start, stop_1, step_1).map(function (i) { return categories_1.slice(i, i + step_1); });
|
|
719
|
+
}
|
|
720
|
+
var scale = d3ScaleLinear()
|
|
721
|
+
.domain(d3Extent(data))
|
|
722
|
+
.nice();
|
|
723
|
+
var _c = scale.domain(), minVal = _c[0], maxVal = _c[1];
|
|
724
|
+
minVal = typeof binStart === 'number' ? binStart : minVal;
|
|
725
|
+
maxVal = typeof binEnd === 'number' ? binEnd : maxVal;
|
|
726
|
+
var binGenerator = d3Bin().domain([minVal, maxVal]);
|
|
727
|
+
if (typeof binSize === 'number') {
|
|
728
|
+
var thresholds = [];
|
|
729
|
+
var th = minVal;
|
|
730
|
+
var tolerance = 1 / Math.pow(10, (_b = (_a = binSize.toString().split('.')[1]) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0);
|
|
731
|
+
while (maxVal + binSize - th > tolerance) {
|
|
732
|
+
thresholds.push(th);
|
|
733
|
+
th += binSize;
|
|
734
|
+
}
|
|
735
|
+
minVal = thresholds[0];
|
|
736
|
+
maxVal = thresholds[thresholds.length - 1];
|
|
737
|
+
binGenerator.domain([minVal, maxVal]).thresholds(thresholds);
|
|
738
|
+
}
|
|
739
|
+
// NOTE: The last bin generated by d3Bin often has identical x0 and x1 values (both inclusive) and
|
|
740
|
+
// can be ignored if the highest value is already included in the previous bin.
|
|
741
|
+
return binGenerator(data);
|
|
742
|
+
};
|
|
743
|
+
var calculateHistFunc = function (histfunc, bin) {
|
|
744
|
+
var _a, _b;
|
|
745
|
+
switch (histfunc) {
|
|
746
|
+
case 'sum':
|
|
747
|
+
return d3Sum(bin);
|
|
748
|
+
case 'avg':
|
|
749
|
+
return bin.length === 0 ? 0 : d3Sum(bin) / bin.length;
|
|
750
|
+
case 'min':
|
|
751
|
+
return (_a = d3Min(bin)) !== null && _a !== void 0 ? _a : 0;
|
|
752
|
+
case 'max':
|
|
753
|
+
return (_b = d3Max(bin)) !== null && _b !== void 0 ? _b : 0;
|
|
754
|
+
default:
|
|
755
|
+
return bin.length;
|
|
756
|
+
}
|
|
757
|
+
};
|
|
758
|
+
var calculateHistNorm = function (histnorm, value, total, dx, dy) {
|
|
759
|
+
if (dy === void 0) { dy = 1; }
|
|
760
|
+
switch (histnorm) {
|
|
761
|
+
case 'percent':
|
|
762
|
+
return total === 0 ? 0 : (value / total) * 100;
|
|
763
|
+
case 'probability':
|
|
764
|
+
return total === 0 ? 0 : value / total;
|
|
765
|
+
case 'density':
|
|
766
|
+
return dx * dy === 0 ? 0 : value / (dx * dy);
|
|
767
|
+
case 'probability density':
|
|
768
|
+
return total * dx * dy === 0 ? 0 : value / (total * dx * dy);
|
|
769
|
+
default:
|
|
770
|
+
return value;
|
|
771
|
+
}
|
|
772
|
+
};
|
|
680
773
|
//# sourceMappingURL=PlotlySchemaAdapter.js.map
|