回答:
canvasDOM要素を持っている.heightと.widthプロパティに対応するheight="…"とwidth="…"属性。JavaScriptコードでそれらを数値に設定して、キャンバスのサイズを変更します。例えば：
var canvas = document.getElementsByTagName('canvas')[0];
canvas.width = 800;
canvas.height = 600;これによりキャンバスがクリアされることに注意してください。ただしctx.clearRect( 0, 0, ctx.canvas.width, ctx.canvas.height);、キャンバスを完全にクリアしないブラウザを処理するために、この手順に従う必要があります。サイズ変更後に表示したいコンテンツを再描画する必要があります。
さらに、高さと幅は描画に使用されるキャンバスの論理的な寸法であり、およびCSS属性とは異なります。CSS属性を設定しない場合、キャンバスの固有のサイズが表示サイズとして使用されます。CSS属性を設定し、それらがキャンバスの寸法と異なる場合、コンテンツはブラウザーで拡大縮小されます。例えば：style.heightstyle.width
// Make a canvas that has a blurry pixelated zoom-in
// with each canvas pixel drawn showing as roughly 2x2 on screen
canvas.width = 400;
canvas.height = 300;
canvas.style.width = '800px';
canvas.style.height = '600px';4xに拡大されたキャンバスの実例をご覧ください。
キャンバスには2つのサイズがあります。キャンバス内のピクセルの寸法（backingstoreまたはdrawingBuffer）と表示サイズです。ピクセル数は、キャンバス属性を使用して設定されます。HTMLで
<canvas width="400" height="300"></canvas>またはJavaScriptで
someCanvasElement.width = 400;
someCanvasElement.height = 300;それとは別に、キャンバスのCSSスタイルの幅と高さ
CSSで
canvas { /* or some other selector */
width: 500px;
height: 400px;
}またはJavaScriptで
canvas.style.width = "500px";
canvas.style.height = "400px";間違いなくキャンバスを1x1ピクセルにする最良の方法は、常にCSSを使用してサイズを選択し、小さなJavaScriptを記述してピクセル数をそのサイズに一致させることです。
function resizeCanvasToDisplaySize(canvas) {
// look up the size the canvas is being displayed
const width = canvas.clientWidth;
const height = canvas.clientHeight;
// If it's resolution does not match change it
if (canvas.width !== width || canvas.height !== height) {
canvas.width = width;
canvas.height = height;
return true;
}
return false;
}なぜこれが最善の方法ですか？ほとんどの場合、コードを変更する必要なく機能するためです。
属性を設定しなかったため、各サンプルで変更されたのはCSSのみです（キャンバスに関する限り）。
ノート：
どうもありがとうございました！最後に、このコードでぼやけたピクセルの問題を解決しました：
<canvas id="graph" width=326 height=240 style='width:326px;height:240px'></canvas>
「ハーフピクセル」を追加することで、線をぼかすことができます。
$('#mycanvas').attr({width:400,height:300}).css({width:'800px',height:'600px'});視覚的なサイズをピクセルサイズと同じにしたい場合は、スタイルのみを設定し、属性のみを設定します。