From d4a3c45dd5ee2769324c75a7d62bb6049c2bc30d Mon Sep 17 00:00:00 2001
From: Dhiraj Kumar <sumankumaribarnwal@gmail.com>
Date: Fri, 29 May 2026 21:47:54 +0530
Subject: [PATCH] fix: hourly canvas chart date labels

---
 .../src/features/components/charts/builder.ts   | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/web-common/src/features/components/charts/builder.ts b/web-common/src/features/components/charts/builder.ts
index 8f6b9798a55..2ab8a547a49 100644
--- a/web-common/src/features/components/charts/builder.ts
+++ b/web-common/src/features/components/charts/builder.ts
@@ -83,6 +83,10 @@ export function createPositionEncoding(
 ): PositionFieldDef<Field> {
   if (!field || field.type === "value") return {};
   const metaData = data.fields[field.field];
+  const temporalAxisLabelExpr =
+    field.type === "temporal" && metaData && "format" in metaData
+      ? getTemporalAxisLabelExpr(metaData.format)
+      : undefined;
   return {
     field: sanitizeValueForVega(field.field),
     title: metaData?.displayName || field.field,
@@ -115,11 +119,24 @@ export function createPositionEncoding(
               "format" in metaData && {
                 format: metaData.format,
               }),
+            ...(temporalAxisLabelExpr && {
+              labelExpr: temporalAxisLabelExpr,
+            }),
             ...(!field.showAxisTitle && { title: null }),
           },
   };
 }
 
+export function getTemporalAxisLabelExpr(format: string | undefined) {
+  if (format !== "%H:%M") return undefined;
+
+  return [
+    "timeFormat(datum.value, '%H:%M') === '00:00'",
+    "? timeFormat(datum.value, '%b %d')",
+    ": timeFormat(datum.value, '%H:%M')",
+  ].join(" ");
+}
+
 export function createSizeEncoding(
   field: FieldConfig | undefined,
   data: ChartDataResult,