diff --git a/packages/visualizations-react/stories/Chart/AxisAssemblages/AxisAssemblages.stories.tsx b/packages/visualizations-react/stories/Chart/AxisAssemblages/AxisAssemblages.stories.tsx index 015f6625..387717dd 100644 --- a/packages/visualizations-react/stories/Chart/AxisAssemblages/AxisAssemblages.stories.tsx +++ b/packages/visualizations-react/stories/Chart/AxisAssemblages/AxisAssemblages.stories.tsx @@ -705,8 +705,8 @@ const ScatterPlotChartArgs: Props = { data: { loading: false, value: [ - {label: 'id-0', x: -10, y: 20}, - {label: 'id-1', x: 20, y: -10}, + {label: 'id-0', x: -10, y: 20}, + {label: 'id-1', x: 20, y: -10}, {label: 'id-2', x: 5, y: 2}, {label: 'id-3', x: 7, y: 3} ], @@ -760,7 +760,7 @@ function generateNormalDistribution(n: number, xMean = 0, xStdDev = 1, yMean = 0 const points = []; for (let i = 0; i < n; i++) { points.push({ - label: `id-${i}`, + label: `id-${i}`, x: randomNormal(xMean, xStdDev), y: randomNormal(yMean, yStdDev), }); @@ -779,8 +779,8 @@ const ScatterplotNormalDistribChartArgs: Props = { { label: "Serie 1", type: ChartSeriesType.Scatter, - valueColumn:"x", - indexAxis:"y", + valueColumn:"y", + indexAxis:"x", backgroundColor: COLORS.blue, }, ], @@ -790,7 +790,7 @@ const ScatterplotNormalDistribChartArgs: Props = { title: { display: true, text: "Horizontal axis" - }, + }, beginAtZero: true }, y: { @@ -808,6 +808,6 @@ const ScatterplotNormalDistribChartArgs: Props = { }, }; export const ScatterplotNormalDistribChart = { - args: ScatterplotNormalDistribChartArgs, + args: ScatterplotNormalDistribChartArgs, parameters: {chromatic: { disableSnapshot: true }} }; diff --git a/packages/visualizations/src/components/Chart/datasets.ts b/packages/visualizations/src/components/Chart/datasets.ts index 507e8822..38c0f16f 100644 --- a/packages/visualizations/src/components/Chart/datasets.ts +++ b/packages/visualizations/src/components/Chart/datasets.ts @@ -114,7 +114,7 @@ export default function toDataset(df: DataFrame, s: ChartSeries): ChartDataset { return { type: 'scatter', label: defaultValue(s.label, ''), - data: df.map((entry) => ({ x: entry[s.indexAxis], y: entry[s.valueColumn] })), + data: df.map((entry) => ({ x: entry[defaultValue(s.indexAxis, 'x')], y: entry[defaultValue(s.valueColumn, 'y')] })), datalabels: chartJsDataLabels(s.dataLabels), backgroundColor: singleChartJsColor(s.backgroundColor), pointRadius: defaultValue(s.pointRadius, 5), diff --git a/packages/visualizations/src/components/Chart/types.ts b/packages/visualizations/src/components/Chart/types.ts index 349a87c9..ebc21f10 100644 --- a/packages/visualizations/src/components/Chart/types.ts +++ b/packages/visualizations/src/components/Chart/types.ts @@ -223,7 +223,7 @@ export interface Scatter { type: ChartSeriesType.Scatter; valueColumn: string; label?: string; - indexAxis: string; + indexAxis?: 'x' | 'y'; /** Point color */ backgroundColor?: Color | Color[]; pointRadius?: number;