Spectrogram: integer layout sizes (fractional devicePixelRatio broke drawing)

Jeremy Magland <jmagland@flatironinstitute.org> committed 1 month ago commit 0b5e420cb83c parent d54e806 Browse files

1 changed file+4−2

src/audio/spectrogram.tsmodified+4−2View file

@@ -110,8 +110,10 @@ export class Spectrogram {

110110 canvas.height = H;

111111 }

112112 const ctx = canvas.getContext("2d")!;

113- const left = 52 * dpr, bottom = 22 * dpr, top = 6 * dpr, right = 8 * dpr;

114- const pw = Math.max(1, W - left - right), ph = Math.max(1, H - top - bottom);

113+ // Whole pixels throughout: a fractional device pixel ratio would otherwise

114+ // make the ImageData and the pixel buffer disagree in size.

115+ const left = Math.round(52 * dpr), bottom = Math.round(22 * dpr), top = Math.round(6 * dpr), right = Math.round(8 * dpr);

116+ const pw = Math.max(1, Math.floor(W - left - right)), ph = Math.max(1, Math.floor(H - top - bottom));

115117 ctx.fillStyle = "#1c1e22";

116118 ctx.fillRect(0, 0, W, H);

117119 const { fmax, logFrequency } = this.opts;