Установить размер холста с помощью javascript

У меня есть следующий код в html:

<canvas  id="myCanvas" width =800 height=800>

Я хочу вместо указания width как 800 вызвать функцию JavaScript getWidth(), чтобы получить ширину, например.

 <canvas  id="myCanvas" width =getWidth() height=800>

Каков правильный синтаксис? Потому что то, что я делаю, не работает.

Ответ 1

Вы можете установить ширину следующим образом:

function draw() {
  var ctx = (a canvas context);
  ctx.canvas.width  = window.innerWidth;
  ctx.canvas.height = window.innerHeight;
  //...drawing code...
}

Ответ 2

function setWidth(width) {
  var canvas = document.getElementById("myCanvas");  
  canvas.width = width;
}

Ответ 3

Попробуйте следующее:

var setCanvasSize = function() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
}

Ответ 4

Попробуйте следующее:

var w = window,
d = document,
e = d.documentElement,
g = d.getElementsByTagName('body')[0],
xS = w.innerWidth || e.clientWidth || g.clientWidth,
yS = w.innerHeight|| e.clientHeight|| g.clientHeight;
alert(xS + ' × ' + yS);

document.write( '')

работает для iframe и хорошо.

Ответ 5

Вы также можете использовать этот script, просто измените высоту и ширину

<canvas id="Canvas01" width="500" height="400" style="border:2px solid #FF9933; margin-left:10px; margin-top:10px;"></canvas>

   <script>
      var canvas = document.getElementById("Canvas01");
      var ctx = canvas.getContext("2d");