W3cubDocs

/DOM

HTMLCanvasElement.width

The HTMLCanvasElement.width property is a positive integer reflecting the width HTML attribute of the <canvas> element interpreted in CSS pixels. When the attribute is not specified, or if it is set to an invalid value, like a negative, the default value of 300 is used.

This is one of the two properties, the other being HTMLCanvasElement.height, that controls the size of the canvas.

Syntax

var pxl = canvas.width;
canvas.width = pxl;

Examples

Given this <canvas> element:

<canvas id="canvas" width="300" height="300"></canvas>

You can get the width of the canvas with the following code:

var canvas = document.getElementById('canvas');
console.log(canvas.width); // 300

Specifications

Browser compatibilityUpdate compatibility data on GitHub

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
Basic support 4 12 3.6 9 9 3.1
Mobile
Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android iOS Safari Samsung Internet
Basic support Yes Yes Yes 4 Yes Yes Yes

See also

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/width