ビューポートが変更されたときにキャンバスのサイズ（実際のピクセル）を動的に更新するにはどうすればよいですか？

Question

私はbootstrap4を使用し、を<div>（0パディングあり）に入れます。 CSS：canvas {height: 200; width 100%;}です。私のinit()メソッドでは、私はcan.heightとcan.widthを私の（例えば、document.getElementById('can').getBoundingClientRect(）に合わせてリセットしました。実際のピクセルはCSSピクセルと一致します。

これは、ユーザーがブラウザのサイズを変更する（つまり、ビューポートを変更する）まで有効です。

私の質問は：ビューポートが変更されたときに発生するイベントハンドラを設定するにはどうすればよいですか？

Answer 1

あなたはhttps://developer.mozilla.org/en-US/docs/Web/Events/resize

window.addEventListener("resize", function() { 
    //do whatever to set the size 
}, false);