htmlラーニング-canvasストレッチの問題

最近の図面では、ユーザーの入力に応じてキャンバスのサイズを動的に変更する必要があります.しかしjsでキャンバスの大きさを変えたところ、図形が引っ張られていた.
長いこと考えても分からなかったので、解決策を探しました.もともとjsでcanvasの長さと幅を勝手に制御することは許されなかった.
canvasのデフォルトの縦横は300*150です.
伸ばさない解決策:

var theCanvas = document.getElementById("canvasId");
theCanvas.width = 500;
the Canvas.width = 400;

これでcanvasキャンバスの長さと幅を変更しても問題はありません.
使用する場合:

$('#canvasId').css('height', 500);
$('#canvasId').css('width', 400);

これでストレッチされます.