JavaScript – HTML5画布上的矩形被拉伸

我正在一个网站上工作,我尝试用 JavaScript在HTML5画布上获得矩形.通常这是没有问题的,但现在当我制作宽度和高度为10的矩形.它似乎是一个矩形,宽度为10,高度为20.

我正在做这样的矩形：

var canvas = $("#canvas");
var context = canvas.get(0).getContext("2d");

context.fillRect(0,10,10);

div画布设置为100％的宽度,但我试图给它一个固定的宽度,也没有帮助.

解决方法

您需要在canvas元素上设置宽度和高度,否则这可能是某些浏览器中的结果.

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

并且您不能使用CSS设置画布大小,这将拉伸画布.