feat: Add show axis to timeseries

desktop.ini

@@ -0,0 +1,4 @@
+[ViewState]
+Mode=
+Vid=
+FolderType=Generic

superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts

@@ -247,6 +247,7 @@ export default function transformProps(
     legendOrientation,
     addYAxisTitleOffset,
     false,
+    true,
     null,
     addXAxisTitleOffset,
     yAxisTitlePosition,

superset-frontend/plugins/plugin-chart-echarts/src/Bubble/transformProps.ts

@@ -151,6 +151,7 @@ export default function transformProps(chartProps: EchartsBubbleChartProps) {
     legendOrientation,
     true,
     false,
+    true,
     legendMargin,
     true,
     'Left',

superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts

@@ -476,6 +476,7 @@ export default function transformProps(
     legendOrientation,
     addYAxisTitleOffset,
     zoomable,
+    true,
     null,
     addXAxisTitleOffset,
     yAxisTitlePosition,

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx

@@ -54,6 +54,7 @@ const {
   yAxisBounds,
   zoomable,
   orientation,
+  showAxis,
 } = DEFAULT_FORM_DATA;
 
 function createAxisTitleControl(axis: 'x' | 'y'): ControlSetRow[] {
@@ -174,6 +175,20 @@ function createAxisControl(axis: 'x' | 'y'): ControlSetRow[] {
         },
       },
     ],
+    [
+      {
+        name: 'showAxis',
+        config: {
+          type: 'CheckboxControl',
+          label: t('Show Axis'),
+          renderTrigger: true,
+          default: showAxis,
+          description: t('Changing this control takes effect instantly'),
+          visibility: ({ controls }: ControlPanelsContainerProps) =>
+            isXAxis ? isHorizontal(controls) : isVertical(controls),
+        },
+      },
+    ],
     [
       {
         name: 'y_axis_format',

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/constants.ts

@@ -72,6 +72,7 @@ export const DEFAULT_FORM_DATA: EchartsTimeseriesFormData = {
   orientation: OrientationType.vertical,
   sort_series_type: 'sum',
   sort_series_ascending: false,
+  showAxis: true,
 };
 
 export const TIME_SERIES_DESCRIPTION_TEXT: string = t(

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts

@@ -160,6 +160,7 @@ export default function transformProps(
     sortSeriesAscending,
     timeGrainSqla,
     timeCompare,
+    showAxis,
     stack,
     tooltipTimeFormat,
     tooltipSortByMetric,
@@ -432,6 +433,7 @@ export default function transformProps(
     legendOrientation,
     addYAxisLabelOffset,
     zoomable,
+    showAxis,
     legendMargin,
     addXAxisLabelOffset,
     yAxisTitlePosition,
@@ -487,6 +489,7 @@ export default function transformProps(
         defaultFormatter,
       ),
     },
+    show: showAxis,
     scale: truncateYAxis,
     name: yAxisTitle,
     nameGap: convertInteger(yAxisTitleMargin),

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformers.ts

@@ -545,6 +545,7 @@
   legendOrientation: LegendOrientation,
   addYAxisTitleOffset: boolean,
   zoomable: boolean,
+  showAxis: boolean,
   margin?: string | number | null,
   addXAxisTitleOffset?: boolean,
   yAxisTitlePosition?: string,
@@ -559,6 +560,25 @@
   const yAxisOffset = addYAxisTitleOffset
     ? TIMESERIES_CONSTANTS.yAxisLabelTopOffset
     : 0;
+  // When the Y-axis is hidden, move the graph to the left to try to keep the graph centered
+  const yAxisLeftOffset = showAxis
+    ? 0
+    : TIMESERIES_CONSTANTS.yAxisLabelLeftOffset;
+  let leftOffset: number;
+  if (yAxisTitlePosition === 'Left' && showAxis) {
+    leftOffset =
+      TIMESERIES_CONSTANTS.gridOffsetLeft + (Number(yAxisTitleMargin) || 0);
+  } else if (yAxisTitlePosition === 'Left' && !showAxis) {
+    leftOffset =
+      TIMESERIES_CONSTANTS.gridOffsetLeft +
+      (Number(yAxisTitleMargin) || 0) -
+      (Number(yAxisLeftOffset) || 0);
+  } else if (yAxisTitlePosition !== 'Left' && !showAxis) {
+    leftOffset =
+      TIMESERIES_CONSTANTS.gridOffsetLeft - (Number(yAxisLeftOffset) || 0);
+  } else {
+    leftOffset = TIMESERIES_CONSTANTS.gridOffsetLeft;
+  }
   const xAxisOffset = addXAxisTitleOffset ? Number(xAxisTitleMargin) || 0 : 0;
   return getChartPadding(showLegend, legendOrientation, margin, {
     top:
@@ -568,10 +588,7 @@
     bottom: zoomable
       ? TIMESERIES_CONSTANTS.gridOffsetBottomZoomable + xAxisOffset
       : TIMESERIES_CONSTANTS.gridOffsetBottom + xAxisOffset,
-    left:
-      yAxisTitlePosition === 'Left'
-        ? TIMESERIES_CONSTANTS.gridOffsetLeft + (Number(yAxisTitleMargin) || 0)
-        : TIMESERIES_CONSTANTS.gridOffsetLeft,
+    left: leftOffset,
     right:
       showLegend && legendOrientation === LegendOrientation.Right
         ? 0

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/types.ts

@@ -93,6 +93,7 @@ export type EchartsTimeseriesFormData = QueryFormData & {
   showExtraControls: boolean;
   percentageThreshold: number;
   orientation?: OrientationType;
+  showAxis: boolean;
 } & LegendFormData &
   TitleFormData;
 

superset-frontend/plugins/plugin-chart-echarts/src/constants.ts

@@ -44,6 +44,7 @@ export const TIMESERIES_CONSTANTS = {
   dataZoomStart: 0,
   dataZoomEnd: 100,
   yAxisLabelTopOffset: 20,
+  yAxisLabelLeftOffset: 40,
   extraControlsOffset: 22,
 };