From cbc5bed6fe37469f2cd03ef114204abf4f4a94fe Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 12 Jul 2023 20:51:03 +0000 Subject: [PATCH] Fix line to vega conversion bug (#4554) * Fix line to vega conversion bug Signed-off-by: Ashish Agrawal * Update CHANGELOG and release notes Signed-off-by: Ashish Agrawal * Address comments Signed-off-by: Ashish Agrawal * Add more details to comment Signed-off-by: Ashish Agrawal * Not a released changed, so no need to document Signed-off-by: Ashish Agrawal --------- Signed-off-by: Ashish Agrawal (cherry picked from commit b94a62f2b9f1a9c01e1d03fe8d36f8e46fac3b5c) Signed-off-by: github-actions[bot] --- .../public/expressions/helpers.test.js | 2 + .../public/expressions/helpers.ts | 59 ++++++++++--------- 2 files changed, 34 insertions(+), 27 deletions(-) diff --git a/src/plugins/vis_type_vega/public/expressions/helpers.test.js b/src/plugins/vis_type_vega/public/expressions/helpers.test.js index 8630b3c69ada..bf8bf28e9ca6 100644 --- a/src/plugins/vis_type_vega/public/expressions/helpers.test.js +++ b/src/plugins/vis_type_vega/public/expressions/helpers.test.js @@ -194,6 +194,8 @@ describe('helpers', function () { describe('createSpecFromXYChartDatatable()', function () { // Following 3 tests fail since they are persisting temporal data // which can cause snapshots to fail depending on the test env they are run on. + // Tracking issue: https://github.com/opensearch-project/OpenSearch-Dashboards/issues/4555 + // TODO: Add a test for the fix in this PR: https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4554 it.skip('build simple line chart"', function () { expect( JSON.stringify( diff --git a/src/plugins/vis_type_vega/public/expressions/helpers.ts b/src/plugins/vis_type_vega/public/expressions/helpers.ts index 1fffd91b0bdb..5f65fe5f5bd7 100644 --- a/src/plugins/vis_type_vega/public/expressions/helpers.ts +++ b/src/plugins/vis_type_vega/public/expressions/helpers.ts @@ -198,35 +198,40 @@ export const createSpecFromXYChartDatatable = ( if (datatable.rows.length > 0 && dimensions.x !== null) { const xAxisId = getXAxisId(dimensions, datatable.columns); const xAxisTitle = cleanString(dimensions.x.label); - let seriesParamSkipCount = 0; datatable.columns.forEach((column, index) => { - // Don't add a layer for x axis column - if (isXAxisColumn(column)) { - seriesParamSkipCount++; - // Don't add a layer for vis layer column - } else if (!isVisLayerColumn(column)) { - const currentSeriesParams = visParams.seriesParams[index - seriesParamSkipCount]; - const currentValueAxis = valueAxis.get(currentSeriesParams.valueAxis.toString()); - let tooltip: Array<{ field: string; type: string; title: string }> = []; - if (visParams.addTooltip) { - tooltip = [ - { field: xAxisId, type: 'temporal', title: xAxisTitle }, - { field: column.id, type: 'quantitative', title: column.name }, - ]; - } - spec.layer.push({ - mark: buildLayerMark(currentSeriesParams), - encoding: { - x: buildXAxis(xAxisTitle, xAxisId, visParams), - y: buildYAxis(column, currentValueAxis, visParams), - tooltip, - color: { - // This ensures all the different metrics have their own distinct and unique color - datum: column.name, - }, - }, - }); + // Ignore columns that are for the x-axis and visLayers + if (isXAxisColumn(column) || isVisLayerColumn(column)) return; + // Get the series param id which is the 2nd value in the column id + // Example: 'col-1-3', the seriesParamId is 3. 'col-1-2-6', the seriesParamId is 2. + const seriesParamsId = column.id.split('-')[2]; + const currentSeriesParams = visParams.seriesParams.find( + (param: { data: { id: string } }) => param?.data?.id === seriesParamsId + ); + if (!currentSeriesParams) { + // eslint-disable-next-line no-console + console.error(`Failed to find matching series param for column of id: ${column.id}`); + return; + } + const currentValueAxis = valueAxis.get(currentSeriesParams.valueAxis.toString()); + let tooltip: Array<{ field: string; type: string; title: string }> = []; + if (visParams.addTooltip) { + tooltip = [ + { field: xAxisId, type: 'temporal', title: xAxisTitle }, + { field: column.id, type: 'quantitative', title: column.name }, + ]; } + spec.layer.push({ + mark: buildLayerMark(currentSeriesParams), + encoding: { + x: buildXAxis(xAxisTitle, xAxisId, visParams), + y: buildYAxis(column, currentValueAxis, visParams), + tooltip, + color: { + // This ensures all the different metrics have their own distinct and unique color + datum: column.name, + }, + }, + }); }); }