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,
};