diff --git a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/controlPanel.tsx b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/controlPanel.tsx index 0a53541b42dc..5986ef44e79e 100644 --- a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/controlPanel.tsx +++ b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/controlPanel.tsx @@ -54,6 +54,7 @@ const { truncateYAxis, yAxisBounds, zoomable, + xAxisLabelRotation, } = DEFAULT_FORM_DATA; const config: ControlPanelConfig = { @@ -338,6 +339,24 @@ const config: ControlPanelConfig = { }, }, ], + [ + { + name: 'xAxisLabelRotation', + config: { + type: 'SelectControl', + freeForm: true, + clearable: false, + label: t('Rotate x axis label'), + choices: [ + [0, '0°'], + [45, '45°'], + ], + default: xAxisLabelRotation, + renderTrigger: true, + description: t('Input field supports custom rotation. e.g. 30 for 30°'), + }, + }, + ], // eslint-disable-next-line react/jsx-key [

{t('Tooltip')}

], [ diff --git a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts index dfb0a388b072..3ba12d620976 100644 --- a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts +++ b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts @@ -81,6 +81,7 @@ export default function transformProps(chartProps: ChartProps): EchartsProps { timeGrainSqla, zoomable, richTooltip, + xAxisLabelRotation, }: EchartsTimeseriesFormData = { ...DEFAULT_FORM_DATA, ...formData }; const colorScale = CategoricalColorNamespace.getScale(colorScheme as string); @@ -154,6 +155,7 @@ export default function transformProps(chartProps: ChartProps): EchartsProps { showMinLabel: xAxisShowMinLabel, showMaxLabel: xAxisShowMaxLabel, formatter: xAxisFormatter, + rotate: xAxisLabelRotation, }, }, yAxis: { diff --git a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/types.ts b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/types.ts index a2cb7885b451..c3a7ef53f496 100644 --- a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/types.ts +++ b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/Timeseries/types.ts @@ -63,6 +63,7 @@ export type EchartsTimeseriesFormData = { yAxisBounds: [number | undefined | null, number | undefined | null]; zoomable: boolean; richTooltip: boolean; + xAxisLabelRotation: number; } & EchartsLegendFormData; export const DEFAULT_FORM_DATA: EchartsTimeseriesFormData = { @@ -90,4 +91,5 @@ export const DEFAULT_FORM_DATA: EchartsTimeseriesFormData = { xAxisShowMaxLabel: true, zoomable: false, richTooltip: true, + xAxisLabelRotation: 45, };