canvas - 为什么画布边框附近的矩形形状模糊？

我有一个简单的代码，可以在画布中生成一个矩形。矩形的宽度是视口的宽度，由于某种原因，所生成的形状在所有4个边框上都有模糊。我试图在jsfiddle上复制它，但形状清晰而正常。

HTML

<body>
    <canvas id="bg_canvas"></canvas>
</body>

使用Javascript / jQuery的

$(document).ready(function(){
// Expand canvas to full viewport size
    var vp_width = $(window).width();
    var vp_height = $(window).height();

    $("#bg_canvas").width(vp_width);
    $("#bg_canvas").height(vp_height);

// Canvas Drawing
    var canvas = document.getElementById("bg_canvas");
    var ctx = canvas.getContext("2d");

    ctx.fillStyle = "#cbf7ed";
    ctx.fillRect(10,10,vp_width,5);
});

Blur

为什么画布边框附近的矩形形状模糊？

0 个答案: