canvas を使って画像をトリミングする const img = document.querySelector('img'); const canvas = document.createElement('canvas'); canvas.width = width; canvas.height = height; const context = canvas.getContext("2d"); context.drawImage(img, x, y, width, height, 0, 0, width, height); というようなコードが紹介されることが多いですが、ダメです。これはディスプレイの解像度が伝統的な 96DPI になっていることに依存したコードで、現代的な HiDPI 環境では思った通りに動きません。 こうした問題に対応するためにwindow.devicePixelR