diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/__snapshots__/xy_visualization.test.ts.snap b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/__snapshots__/xy_visualization.test.ts.snap index 12902f548e45b..76af8328673ad 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/__snapshots__/xy_visualization.test.ts.snap +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/__snapshots__/xy_visualization.test.ts.snap @@ -5,9 +5,6 @@ Object { "chain": Array [ Object { "arguments": Object { - "isHorizontal": Array [ - false, - ], "layers": Array [ Object { "chain": Array [ diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/state_helpers.ts b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/state_helpers.ts new file mode 100644 index 0000000000000..eb7fd688bab5a --- /dev/null +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/state_helpers.ts @@ -0,0 +1,26 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { EuiIconType } from '@elastic/eui/src/components/icon/icon'; +import { SeriesType, visualizationTypes } from './types'; + +export function isHorizontalSeries(seriesType: SeriesType) { + return seriesType === 'bar_horizontal' || seriesType === 'bar_horizontal_stacked'; +} + +export function isHorizontalChart(layers: Array<{ seriesType: SeriesType }>) { + return layers.every(l => isHorizontalSeries(l.seriesType)); +} + +export function getIconForSeries(type: SeriesType): EuiIconType { + const definition = visualizationTypes.find(t => t.id === type); + + if (!definition) { + throw new Error(`Unknown series type ${type}`); + } + + return (definition.icon as EuiIconType) || 'empty'; +} diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/to_expression.ts b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/to_expression.ts index ff5f7eb08f2db..f0e932d14f281 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/to_expression.ts +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/to_expression.ts @@ -131,7 +131,6 @@ export const buildExpression = ( arguments: { xTitle: [xTitle], yTitle: [yTitle], - isHorizontal: [state.isHorizontal], legend: [ { type: 'expression', diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/types.ts b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/types.ts index 742cc36be4ea6..28f72f60c3a2d 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/types.ts +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/types.ts @@ -175,7 +175,14 @@ export const layerConfig: ExpressionFunction< }, }; -export type SeriesType = 'bar' | 'line' | 'area' | 'bar_stacked' | 'area_stacked'; +export type SeriesType = + | 'bar' + | 'bar_horizontal' + | 'line' + | 'area' + | 'bar_stacked' + | 'bar_horizontal_stacked' + | 'area_stacked'; export interface LayerConfig { hide?: boolean; @@ -199,7 +206,6 @@ export interface XYArgs { yTitle: string; legend: LegendConfig; layers: LayerArgs[]; - isHorizontal: boolean; } // Persisted parts of the state @@ -207,7 +213,6 @@ export interface XYState { preferredSeriesType: SeriesType; legend: LegendConfig; layers: LayerConfig[]; - isHorizontal: boolean; } export type State = XYState; @@ -221,13 +226,27 @@ export const visualizationTypes: VisualizationType[] = [ defaultMessage: 'Bar', }), }, + { + id: 'bar_horizontal', + icon: 'visBarHorizontal', + label: i18n.translate('xpack.lens.xyVisualization.barHorizontalLabel', { + defaultMessage: 'Horizontal Bar', + }), + }, { id: 'bar_stacked', icon: 'visBarVertical', - label: i18n.translate('xpack.lens.xyVisualization.stackedBarLabel', { + label: i18n.translate('xpack.lens.xyVisualization.stackedBar', { defaultMessage: 'Stacked Bar', }), }, + { + id: 'bar_horizontal_stacked', + icon: 'visBarHorizontal', + label: i18n.translate('xpack.lens.xyVisualization.stackedBarHorizontalLabel', { + defaultMessage: 'Stacked Horizontal Bar', + }), + }, { id: 'line', icon: 'visLine', diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.test.tsx b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.test.tsx index ad08b8949f3b9..5cdf1031a22b0 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.test.tsx +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.test.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { FormEvent } from 'react'; +import React from 'react'; import { ReactWrapper } from 'enzyme'; import { mountWithIntl as mount } from 'test_utils/enzyme_helpers'; import { EuiButtonGroupProps } from '@elastic/eui'; @@ -15,7 +15,6 @@ import { Position } from '@elastic/charts'; import { NativeRendererProps } from '../native_renderer'; import { generateId } from '../id_generator'; import { createMockFramePublicAPI, createMockDatasource } from '../editor_frame_plugin/mocks'; -import { act } from 'react-test-renderer'; jest.mock('../id_generator'); @@ -28,7 +27,6 @@ describe('XYConfigPanel', () => { return { legend: { isVisible: true, position: Position.Right }, preferredSeriesType: 'bar', - isHorizontal: false, layers: [ { seriesType: 'bar', @@ -64,50 +62,48 @@ describe('XYConfigPanel', () => { }; }); - test.skip('toggles axis position when going from horizontal bar to any other type', () => {}); test.skip('allows toggling of legend visibility', () => {}); test.skip('allows changing legend position', () => {}); test.skip('allows toggling the y axis gridlines', () => {}); test.skip('allows toggling the x axis gridlines', () => {}); - test('puts the horizontal toggle in a popover', () => { + test('enables stacked chart types even when there is no split series', () => { const state = testState(); - const setState = jest.fn(); const component = mount( ); - component - .find(`[data-test-subj="lnsXY_chart_settings"]`) + openComponentPopover(component, 'first'); + + const options = component + .find('[data-test-subj="lnsXY_seriesType"]') .first() - .simulate('click'); + .prop('options') as EuiButtonGroupProps['options']; - act(() => { - component - .find('[data-test-subj="lnsXY_chart_horizontal"]') - .first() - .prop('onChange')!({} as FormEvent); - }); + expect(options!.map(({ id }) => id)).toEqual([ + 'bar', + 'bar_stacked', + 'line', + 'area', + 'area_stacked', + ]); - expect(setState).toHaveBeenCalledWith({ - ...state, - isHorizontal: true, - }); + expect(options!.filter(({ isDisabled }) => isDisabled).map(({ id }) => id)).toEqual([]); }); - test('enables stacked chart types even when there is no split series', () => { + test('shows only horizontal bar options when in horizontal mode', () => { const state = testState(); const component = mount( ); @@ -118,14 +114,7 @@ describe('XYConfigPanel', () => { .first() .prop('options') as EuiButtonGroupProps['options']; - expect(options!.map(({ id }) => id)).toEqual([ - 'bar', - 'bar_stacked', - 'line', - 'area', - 'area_stacked', - ]); - + expect(options!.map(({ id }) => id)).toEqual(['bar_horizontal', 'bar_horizontal_stacked']); expect(options!.filter(({ isDisabled }) => isDisabled).map(({ id }) => id)).toEqual([]); }); diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.tsx b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.tsx index 7170a41a16880..e268c099ddc24 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.tsx +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.tsx @@ -17,7 +17,6 @@ import { EuiPanel, EuiButtonIcon, EuiPopover, - EuiSwitch, EuiSpacer, EuiButtonEmpty, EuiPopoverFooter, @@ -27,6 +26,7 @@ import { VisualizationProps, OperationMetadata } from '../types'; import { NativeRenderer } from '../native_renderer'; import { MultiColumnEditor } from '../multi_column_editor'; import { generateId } from '../id_generator'; +import { isHorizontalChart, isHorizontalSeries } from './state_helpers'; const isNumericMetric = (op: OperationMetadata) => !op.isBucketed && op.dataType === 'number'; const isBucketed = (op: OperationMetadata) => op.isBucketed; @@ -55,10 +55,12 @@ function newLayerState(seriesType: SeriesType, layerId: string): LayerConfig { function LayerSettings({ layer, + horizontalOnly, setSeriesType, removeLayer, }: { layer: LayerConfig; + horizontalOnly: boolean; setSeriesType: (seriesType: SeriesType) => void; removeLayer: () => void; }) { @@ -96,10 +98,12 @@ function LayerSettings({ name="chartType" className="eui-displayInlineBlock" data-test-subj="lnsXY_seriesType" - options={visualizationTypes.map(t => ({ - ...t, - iconType: t.icon || 'empty', - }))} + options={visualizationTypes + .filter(t => isHorizontalSeries(t.id as SeriesType) === horizontalOnly) + .map(t => ({ + ...t, + iconType: t.icon || 'empty', + }))} idSelected={layer.seriesType} onChange={seriesType => setSeriesType(seriesType as SeriesType)} isIconOnly @@ -124,44 +128,10 @@ function LayerSettings({ export function XYConfigPanel(props: VisualizationProps) { const { state, setState, frame } = props; - const [isChartOptionsOpen, setIsChartOptionsOpen] = useState(false); + const horizontalOnly = isHorizontalChart(state.layers); return ( - setIsChartOptionsOpen(false)} - button={ - setIsChartOptionsOpen(!isChartOptionsOpen)} - aria-label={i18n.translate('xpack.lens.xyChart.chartSettings', { - defaultMessage: 'Chart Settings', - })} - title={i18n.translate('xpack.lens.xyChart.chartSettings', { - defaultMessage: 'Chart Settings', - })} - /> - } - > - { - setState({ - ...state, - isHorizontal: !state.isHorizontal, - }); - }} - data-test-subj="lnsXY_chart_horizontal" - /> - - {state.layers.map((layer, index) => ( ) { setState(updateLayer(state, { ...layer, seriesType }, index)) } diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.test.tsx b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.test.tsx index 0ac286c7bb83c..8770ee5b5e1c9 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.test.tsx +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.test.tsx @@ -35,7 +35,6 @@ function sampleArgs() { const args: XYArgs = { xTitle: '', yTitle: '', - isHorizontal: false, legend: { isVisible: false, position: Position.Top, @@ -161,7 +160,7 @@ describe('xy_expression', () => { const component = shallow( @@ -208,8 +207,7 @@ describe('xy_expression', () => { data={data} args={{ ...args, - isHorizontal: true, - layers: [{ ...args.layers[0], seriesType: 'bar_stacked' }], + layers: [{ ...args.layers[0], seriesType: 'bar_horizontal_stacked' }], }} formatFactory={getFormatSpy} timeZone="UTC" diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.tsx b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.tsx index e559cdd514bc6..43452ff432767 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.tsx +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_expression.tsx @@ -27,6 +27,7 @@ import { IInterpreterRenderFunction } from '../../../../../../src/legacy/core_pl import { LensMultiTable } from '../types'; import { XYArgs, SeriesType, visualizationTypes } from './types'; import { VisualizationContainer } from '../visualization_container'; +import { isHorizontalChart } from './state_helpers'; export interface XYChartProps { data: LensMultiTable; @@ -75,10 +76,6 @@ export const xyChart: ExpressionFunction<'lens_xy_chart', LensMultiTable, XYArgs help: 'Layers of visual series', multi: true, }, - isHorizontal: { - types: ['boolean'], - help: 'Render horizontally', - }, }, context: { types: ['lens_multitable'], @@ -140,7 +137,7 @@ export function XYChartReportable(props: XYChartRenderProps) { } export function XYChart({ data, args, formatFactory, timeZone }: XYChartRenderProps) { - const { legend, layers, isHorizontal } = args; + const { legend, layers } = args; if (Object.values(data.tables).every(table => table.rows.length === 0)) { const icon: IconType = layers.length > 0 ? getIconForSeriesType(layers[0].seriesType) : 'bar'; @@ -176,18 +173,20 @@ export function XYChart({ data, args, formatFactory, timeZone }: XYChartRenderPr } } + const shouldRotate = isHorizontalChart(layers); + return ( - ) : seriesType === 'bar' || seriesType === 'bar_stacked' ? ( + ) : seriesType === 'bar' || + seriesType === 'bar_stacked' || + seriesType === 'bar_horizontal' || + seriesType === 'bar_horizontal_stacked' ? ( ) : ( diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.test.ts b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.test.ts index ed44c74123316..a205fe433106a 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.test.ts +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.test.ts @@ -199,7 +199,6 @@ describe('xy_suggestions', () => { changeType: 'reduced', }, state: { - isHorizontal: false, legend: { isVisible: true, position: 'bottom' }, preferredSeriesType: 'bar', layers: [ @@ -235,7 +234,6 @@ describe('xy_suggestions', () => { test('only makes a seriesType suggestion for unchanged table without split', () => { (generateId as jest.Mock).mockReturnValueOnce('dummyCol'); const currentState: XYState = { - isHorizontal: false, legend: { isVisible: true, position: 'bottom' }, preferredSeriesType: 'bar', layers: [ @@ -270,7 +268,6 @@ describe('xy_suggestions', () => { test('suggests seriesType and stacking when there is a split', () => { const currentState: XYState = { - isHorizontal: false, legend: { isVisible: true, position: 'bottom' }, preferredSeriesType: 'bar', layers: [ @@ -311,7 +308,6 @@ describe('xy_suggestions', () => { test('suggests a flipped chart for unchanged table and existing bar chart on ordinal x axis', () => { (generateId as jest.Mock).mockReturnValueOnce('dummyCol'); const currentState: XYState = { - isHorizontal: false, legend: { isVisible: true, position: 'bottom' }, preferredSeriesType: 'bar', layers: [ @@ -335,16 +331,13 @@ describe('xy_suggestions', () => { }); expect(rest).toHaveLength(0); - expect(suggestion.state).toEqual({ - ...currentState, - isHorizontal: true, - }); + expect(suggestion.state.preferredSeriesType).toEqual('bar_horizontal'); + expect(suggestion.state.layers.every(l => l.seriesType === 'bar_horizontal')).toBeTruthy(); expect(suggestion.title).toEqual('Flip'); }); test('suggests stacking for unchanged table that has a split', () => { const currentState: XYState = { - isHorizontal: false, legend: { isVisible: true, position: 'bottom' }, preferredSeriesType: 'bar', layers: [ @@ -379,7 +372,6 @@ describe('xy_suggestions', () => { test('keeps column to dimension mappings on extended tables', () => { const currentState: XYState = { - isHorizontal: false, legend: { isVisible: true, position: 'bottom' }, preferredSeriesType: 'bar', layers: [ @@ -418,7 +410,6 @@ describe('xy_suggestions', () => { test('overwrites column to dimension mappings if a date dimension is added', () => { (generateId as jest.Mock).mockReturnValueOnce('dummyCol'); const currentState: XYState = { - isHorizontal: false, legend: { isVisible: true, position: 'bottom' }, preferredSeriesType: 'bar', layers: [ diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.ts b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.ts index 2f28e20ebd274..7c7e9caddd31b 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.ts +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_suggestions.ts @@ -7,7 +7,6 @@ import { i18n } from '@kbn/i18n'; import { partition } from 'lodash'; import { Position } from '@elastic/charts'; -import { EuiIconType } from '@elastic/eui/src/components/icon/icon'; import { SuggestionRequest, VisualizationSuggestion, @@ -17,6 +16,7 @@ import { } from '../types'; import { State, SeriesType, XYState } from './types'; import { generateId } from '../id_generator'; +import { getIconForSeries } from './state_helpers'; const columnSortOrder = { date: 0, @@ -26,21 +26,6 @@ const columnSortOrder = { number: 4, }; -function getIconForSeries(type: SeriesType): EuiIconType { - switch (type) { - case 'area': - case 'area_stacked': - return 'visArea'; - case 'bar': - case 'bar_stacked': - return 'visBarVertical'; - case 'line': - return 'visLine'; - default: - throw new Error('unknown series type'); - } -} - /** * Generate suggestions for the xy chart. * @@ -163,10 +148,8 @@ function getSuggestionsForLayer( ): VisualizationSuggestion | Array> { const title = getSuggestionTitle(yValues, xValue, tableLabel); const seriesType: SeriesType = getSeriesType(currentState, layerId, xValue, changeType); - const isHorizontal = currentState ? currentState.isHorizontal : false; const options = { - isHorizontal, currentState, seriesType, layerId, @@ -186,14 +169,18 @@ function getSuggestionsForLayer( const sameStateSuggestions: Array> = []; // if current state is using the same data, suggest same chart with different presentational configuration - if (seriesType !== 'line' && xValue.operation.scale === 'ordinal') { // flip between horizontal/vertical for ordinal scales sameStateSuggestions.push( buildSuggestion({ ...options, title: i18n.translate('xpack.lens.xySuggestions.flipTitle', { defaultMessage: 'Flip' }), - isHorizontal: !options.isHorizontal, + seriesType: + seriesType === 'bar_horizontal' + ? 'bar' + : seriesType === 'bar_horizontal_stacked' + ? 'bar_stacked' + : 'bar_horizontal', }) ); } else { @@ -328,7 +315,6 @@ function getSuggestionTitle( } function buildSuggestion({ - isHorizontal, currentState, seriesType, layerId, @@ -339,7 +325,6 @@ function buildSuggestion({ xValue, }: { currentState: XYState | undefined; - isHorizontal: boolean; seriesType: SeriesType; title: string; yValues: TableSuggestionColumn[]; @@ -358,7 +343,6 @@ function buildSuggestion({ }; const state: State = { - isHorizontal, legend: currentState ? currentState.legend : { isVisible: true, position: Position.Right }, preferredSeriesType: seriesType, layers: [ diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.test.ts b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.test.ts index 8bc7b0c9116f7..5cd0791ae3da9 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.test.ts +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.test.ts @@ -7,7 +7,7 @@ import { xyVisualization } from './xy_visualization'; import { Position } from '@elastic/charts'; import { Operation } from '../types'; -import { State } from './types'; +import { State, SeriesType } from './types'; import { createMockDatasource, createMockFramePublicAPI } from '../editor_frame_plugin/mocks'; import { generateId } from '../id_generator'; import { Ast } from '@kbn/interpreter/target/common'; @@ -16,7 +16,6 @@ jest.mock('../id_generator'); function exampleState(): State { return { - isHorizontal: false, legend: { position: Position.Bottom, isVisible: true }, preferredSeriesType: 'bar', layers: [ @@ -32,6 +31,51 @@ function exampleState(): State { } describe('xy_visualization', () => { + describe('getDescription', () => { + function mixedState(...types: SeriesType[]) { + const state = exampleState(); + return { + ...state, + layers: types.map((t, i) => ({ + ...state.layers[0], + layerId: `layer_${i}`, + seriesType: t, + })), + }; + } + + it('should show mixed xy chart when multilple series types', () => { + const desc = xyVisualization.getDescription(mixedState('bar', 'line')); + + expect(desc.label).toEqual('Mixed XY Chart'); + }); + + it('should show mixed horizontal bar chart when multiple horizontal bar types', () => { + const desc = xyVisualization.getDescription( + mixedState('bar_horizontal', 'bar_horizontal_stacked') + ); + + expect(desc.label).toEqual('Mixed Horizontal Bar Chart'); + }); + + it('should show bar chart when bar only', () => { + const desc = xyVisualization.getDescription(mixedState('bar_horizontal', 'bar_horizontal')); + + expect(desc.label).toEqual('Horizontal Bar Chart'); + }); + + it('should show the chart description if not mixed', () => { + expect(xyVisualization.getDescription(mixedState('area')).label).toEqual('Area Chart'); + expect(xyVisualization.getDescription(mixedState('line')).label).toEqual('Line Chart'); + expect(xyVisualization.getDescription(mixedState('area_stacked')).label).toEqual( + 'Stacked Area Chart' + ); + expect(xyVisualization.getDescription(mixedState('bar_horizontal_stacked')).label).toEqual( + 'Stacked Horizontal Bar Chart' + ); + }); + }); + describe('#initialize', () => { it('loads default state', () => { (generateId as jest.Mock) @@ -48,7 +92,6 @@ describe('xy_visualization', () => { expect(initialState).toMatchInlineSnapshot(` Object { - "isHorizontal": false, "layers": Array [ Object { "accessors": Array [ diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.tsx b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.tsx index 69cb93bb1903d..29c5e5d5e4297 100644 --- a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.tsx +++ b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_visualization.tsx @@ -16,6 +16,7 @@ import { Visualization } from '../types'; import { State, PersistableState, SeriesType, visualizationTypes } from './types'; import { toExpression, toPreviewExpression } from './to_expression'; import { generateId } from '../id_generator'; +import { isHorizontalChart } from './state_helpers'; const defaultIcon = 'visBarVertical'; const defaultSeriesType = 'bar_stacked'; @@ -25,7 +26,7 @@ function getDescription(state?: State) { return { icon: defaultIcon, label: i18n.translate('xpack.lens.xyVisualization.xyLabel', { - defaultMessage: 'XY Chart', + defaultMessage: 'XY', }), }; } @@ -42,8 +43,12 @@ function getDescription(state?: State) { label: seriesTypes.length === 1 ? visualizationType.label + : isHorizontalChart(state.layers) + ? i18n.translate('xpack.lens.xyVisualization.mixedBarHorizontalLabel', { + defaultMessage: 'Mixed Horizontal Bar', + }) : i18n.translate('xpack.lens.xyVisualization.mixedLabel', { - defaultMessage: 'Mixed XY Chart', + defaultMessage: 'Mixed XY', }), }; } @@ -55,9 +60,14 @@ export const xyVisualization: Visualization = { getDescription(state) { const { icon, label } = getDescription(state); + const chartLabel = i18n.translate('xpack.lens.xyVisualization.chartLabel', { + defaultMessage: '{label} Chart', + values: { label }, + }); + return { icon: icon || defaultIcon, - label, + label: chartLabel, }; }, @@ -75,7 +85,6 @@ export const xyVisualization: Visualization = { return ( state || { title: 'Empty XY Chart', - isHorizontal: false, legend: { isVisible: true, position: Position.Right }, preferredSeriesType: defaultSeriesType, layers: [ diff --git a/x-pack/test/functional/es_archives/lens/reporting/data.json.gz b/x-pack/test/functional/es_archives/lens/reporting/data.json.gz index b59717330488a..93ceaf3d8f6f5 100644 Binary files a/x-pack/test/functional/es_archives/lens/reporting/data.json.gz and b/x-pack/test/functional/es_archives/lens/reporting/data.json.gz differ