@@ -163,9 +163,8 @@ function render_timing_graph() {
163
163
for ( c of CONCURRENCY_DATA ) {
164
164
max_v = Math . max ( max_v , c . active , c . waiting , c . inactive ) ;
165
165
}
166
- let [ step , top ] = split_ticks ( max_v , GRAPH_HEIGHT / MIN_TICK_DIST ) ;
167
- let num_ticks = top / step ;
168
- let tick_dist = GRAPH_HEIGHT / num_ticks ;
166
+ const px_per_v = GRAPH_HEIGHT / max_v ;
167
+ const { step, tick_dist, num_ticks} = split_ticks ( max_v , px_per_v , GRAPH_HEIGHT ) ;
169
168
ctx . textAlign = 'end' ;
170
169
for ( n = 0 ; n < num_ticks ; n ++ ) {
171
170
let y = HEIGHT - Y_LINE - ( ( n + 1 ) * tick_dist ) ;
@@ -299,7 +298,7 @@ function draw_graph_axes(id, graph_height) {
299
298
// 4096 is still ridiculously large, and probably won't render on mobile
300
299
// browsers, but should be ok for many desktop environments.
301
300
const graph_width = Math . min ( scale * DURATION , 4096 ) ;
302
- const px_per_sec = Math . floor ( graph_width / DURATION ) ;
301
+ const px_per_sec = graph_width / DURATION ;
303
302
const canvas_width = Math . max ( graph_width + X_LINE + 30 , X_LINE + 250 ) ;
304
303
const canvas_height = graph_height + MARGIN + Y_LINE ;
305
304
let ctx = setup_canvas ( id , canvas_width , canvas_height ) ;
@@ -318,9 +317,7 @@ function draw_graph_axes(id, graph_height) {
318
317
ctx . stroke ( ) ;
319
318
320
319
// Draw X tick marks.
321
- const [ step , top ] = split_ticks ( DURATION , graph_width / MIN_TICK_DIST ) ;
322
- const num_ticks = top / step ;
323
- const tick_dist = graph_width / num_ticks ;
320
+ const { step, tick_dist, num_ticks} = split_ticks ( DURATION , px_per_sec , graph_width ) ;
324
321
ctx . fillStyle = '#303030' ;
325
322
for ( let n = 0 ; n < num_ticks ; n ++ ) {
326
323
const x = X_LINE + ( ( n + 1 ) * tick_dist ) ;
@@ -347,40 +344,39 @@ function draw_graph_axes(id, graph_height) {
347
344
return { canvas_width, canvas_height, graph_width, graph_height, ctx, px_per_sec} ;
348
345
}
349
346
350
- function round_up ( n , step ) {
351
- if ( n % step == 0 ) {
352
- return n ;
353
- } else {
354
- return ( step - n % step ) + n ;
347
+ // Determine the spacing and number of ticks along an axis.
348
+ function split_ticks ( max_value , px_per_v , max_px ) {
349
+ const max_ticks = Math . floor ( max_px / MIN_TICK_DIST ) ;
350
+ if ( max_ticks <= 1 ) {
351
+ // Graph is too small for even 1 tick.
352
+ return { step : max_value , tick_dist : max_px , num_ticks : 1 } ;
355
353
}
356
- }
357
-
358
- // Determine the `(step, max_value)` of the number of ticks along an axis.
359
- function split_ticks ( n , max_ticks ) {
360
- max_ticks = Math . ceil ( max_ticks ) ;
361
- if ( n <= max_ticks ) {
362
- return [ 1 , n ] ;
363
- } else if ( n <= max_ticks * 2 ) {
364
- return [ 2 , round_up ( n , 2 ) ] ;
365
- } else if ( n <= max_ticks * 4 ) {
366
- return [ 4 , round_up ( n , 4 ) ] ;
367
- } else if ( n <= max_ticks * 5 ) {
368
- return [ 5 , round_up ( n , 5 ) ] ;
354
+ let step ;
355
+ if ( max_value <= max_ticks ) {
356
+ step = 1 ;
357
+ } else if ( max_value <= max_ticks * 2 ) {
358
+ step = 2 ;
359
+ } else if ( max_value <= max_ticks * 4 ) {
360
+ step = 4 ;
361
+ } else if ( max_value <= max_ticks * 5 ) {
362
+ step = 5 ;
369
363
} else {
370
- let step = 10 ;
364
+ step = 10 ;
371
365
let count = 0 ;
372
366
while ( true ) {
373
367
if ( count > 100 ) {
374
368
throw Error ( "tick loop too long" ) ;
375
369
}
376
370
count += 1 ;
377
- let top = round_up ( n , step ) ;
378
- if ( top <= max_ticks * step ) {
379
- return [ step , top ] ;
371
+ if ( max_value <= max_ticks * step ) {
372
+ break ;
380
373
}
381
374
step += 10 ;
382
375
}
383
376
}
377
+ const tick_dist = px_per_v * step ;
378
+ const num_ticks = Math . floor ( max_value / step ) ;
379
+ return { step, tick_dist, num_ticks} ;
384
380
}
385
381
386
382
function codegen_time ( unit ) {
0 commit comments