fix: Heatmap numeric sorting (#27360)

apache · Mar 1, 2024 · fe2f5a7 · fe2f5a7
1 parent ae8ec9c
commit fe2f5a7
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 11 deletions.
diff --git a/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/Heatmap.js b/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/Heatmap.js
@@ -177,15 +177,12 @@ function Heatmap(element, props) {
     }
   }
 
-  function ordScale(k, rangeBands, sortMethod) {
+  function ordScale(k, rangeBands, sortMethod, formatter) {
     let domain = {};
-    const actualKeys = {}; // hack to preserve type of keys when number
     records.forEach(d => {
       domain[d[k]] = (domain[d[k]] || 0) + d.v;
-      actualKeys[d[k]] = d[k];
     });
-    // Not using object.keys() as it converts to strings
-    const keys = Object.keys(actualKeys).map(s => actualKeys[s]);
+    const keys = Object.keys(domain).map(k => formatter(k));
     if (sortMethod === 'alpha_asc') {
       domain = keys.sort(cmp);
     } else if (sortMethod === 'alpha_desc') {
@@ -252,10 +249,10 @@ function Heatmap(element, props) {
 
   const fp = getNumberFormatter(NumberFormats.PERCENT_2_POINT);
 
-  const xScale = ordScale('x', null, sortXAxis);
-  const yScale = ordScale('y', null, sortYAxis);
-  const xRbScale = ordScale('x', [0, hmWidth], sortXAxis);
-  const yRbScale = ordScale('y', [hmHeight, 0], sortYAxis);
+  const xScale = ordScale('x', null, sortXAxis, xAxisFormatter);
+  const yScale = ordScale('y', null, sortYAxis, yAxisFormatter);
+  const xRbScale = ordScale('x', [0, hmWidth], sortXAxis, xAxisFormatter);
+  const yRbScale = ordScale('y', [hmHeight, 0], sortYAxis, yAxisFormatter);
   const X = 0;
   const Y = 1;
   const heatmapDim = [xRbScale.domain().length, yRbScale.domain().length];

diff --git a/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/transformProps.js b/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/transformProps.js
@@ -57,11 +57,15 @@ export default function transformProps(chartProps) {
   const xAxisFormatter =
     coltypes[0] === GenericDataType.Temporal
       ? getTimeFormatter(timeFormat)
-      : String;
+      : coltypes[0] === GenericDataType.Numeric
+        ? Number
+        : String;
   const yAxisFormatter =
     coltypes[1] === GenericDataType.Temporal
       ? getTimeFormatter(timeFormat)
-      : String;
+      : coltypes[1] === GenericDataType.Numeric
+        ? Number
+        : String;
   return {
     width,
     height,