spuru9 commented on code in PR #28602:
URL: https://github.com/apache/flink/pull/28602#discussion_r4312604173


##########
flink-runtime-web/web-dashboard/src/app/pages/job/timeline/job-timeline.component.ts:
##########
@@ -29,14 +29,33 @@ import {
 import { Subject } from 'rxjs';
 import { distinctUntilChanged, filter, takeUntil } from 'rxjs/operators';
 
-import * as G2 from '@antv/g2';
 import { Chart } from '@antv/g2';
 import { JobDetailCorrect, VerticesItemRange } from 
'@flink-runtime-web/interfaces';
 import { JobService, ColorKey, ConfigService } from 
'@flink-runtime-web/services';
+import { timeFormat } from 'd3-time-format';
 import { NzDividerModule } from 'ng-zorro-antd/divider';
 
 import { JobLocalService } from '../job-local.service';
 
+// g2 5's string labelFormatter uses d3's numeric formatter, so a time scale 
needs
+// a function; mirror the previous 'HH:mm:ss.SSS' mask.
+const formatTimeAxis = timeFormat('%H:%M:%S.%L');
+
+const TICK_STEPS_MS = [
+  1, 2, 5, 10, 15, 30, 60, 120, 180, 300, 600, 900, 1800, 3600, 7200, 10800, 
21600, 43200, 86400
+].map(s => s * 1000);
+
+// Unlike g2's default "nice" ticks, start at the domain minimum so the axis 
is anchored to the actual start time.
+function startAlignedTicks(min: Date, max: Date): Date[] {
+  const range = Number(max) - Number(min);
+  const step = TICK_STEPS_MS.find(s => range / s <= 7) ?? 
TICK_STEPS_MS[TICK_STEPS_MS.length - 1];

Review Comment:
    past the largest step the ticks are now spread evenly (max 7) instead of 
one per day. I didn't fall back to g2's default ticks since that needs 
`@antv/scale` as a direct dependency; labels on multi-day ranges still show 
time only, no date. Happy to add one if you'd like.



-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to