feat: Floating Point Formatting for Scatter Point Chart (#35915)

Co-authored-by: Vincent <vincent.trung4@gmail.com>
This commit is contained in:
Alex Yang
2025-11-14 14:37:44 -05:00
committed by GitHub
parent f3e620cd0f
commit 001b6cb801
7 changed files with 418 additions and 1 deletions

View File

@@ -112,6 +112,53 @@ const config: ControlPanelConfig = {
...sharedControls.x_axis_time_format,
default: 'smart_date',
description: `${D3_TIME_FORMAT_DOCS}. ${TIME_SERIES_DESCRIPTION_TEXT}`,
visibility: ({ controls }: ControlPanelsContainerProps) => {
// check if x axis is a time column
const xAxisColumn = controls?.x_axis?.value;
const xAxisOptions = controls?.x_axis?.options;
if (!xAxisColumn || !Array.isArray(xAxisOptions)) {
return false;
}
const xAxisType = xAxisOptions.find(
option => option.column_name === xAxisColumn,
)?.type;
return (
typeof xAxisType === 'string' &&
xAxisType.toUpperCase().includes('TIME')
);
},
},
},
{
name: 'x_axis_number_format',
config: {
...sharedControls.x_axis_number_format,
visibility: ({ controls }: ControlPanelsContainerProps) => {
// check if x axis is a floating-point column
const xAxisColumn = controls?.x_axis?.value;
const xAxisOptions = controls?.x_axis?.options;
if (!xAxisColumn || !Array.isArray(xAxisOptions)) {
return false;
}
const xAxisType = xAxisOptions.find(
option => option.column_name === xAxisColumn,
)?.type;
if (typeof xAxisType !== 'string') {
return false;
}
const typeUpper = xAxisType.toUpperCase();
return ['FLOAT', 'DOUBLE', 'REAL', 'NUMERIC', 'DECIMAL'].some(
t => typeUpper.includes(t),
);
},
},
},
],

View File

@@ -72,6 +72,7 @@ export const DEFAULT_FORM_DATA: EchartsTimeseriesFormData = {
stack: false,
tooltipTimeFormat: 'smart_date',
xAxisTimeFormat: 'smart_date',
xAxisNumberFormat: 'SMART_NUMBER',
truncateXAxis: true,
truncateYAxis: false,
yAxisBounds: [null, null],

View File

@@ -189,6 +189,7 @@ export default function transformProps(
xAxisSort,
xAxisSortAsc,
xAxisTimeFormat,
xAxisNumberFormat,
xAxisTitle,
xAxisTitleMargin,
yAxisBounds,
@@ -485,7 +486,9 @@ export default function transformProps(
const xAxisFormatter =
xAxisDataType === GenericDataType.Temporal
? getXAxisFormatter(xAxisTimeFormat)
: String;
: xAxisDataType === GenericDataType.Numeric
? getNumberFormatter(xAxisNumberFormat)
: String;
const {
setDataMask = () => {},

View File

@@ -84,6 +84,7 @@ export type EchartsTimeseriesFormData = QueryFormData & {
yAxisFormat?: string;
xAxisForceCategorical?: boolean;
xAxisTimeFormat?: string;
xAxisNumberFormat?: string;
timeGrainSqla?: TimeGranularity;
forceMaxInterval?: boolean;
xAxisBounds: [number | undefined | null, number | undefined | null];