小编dha*_*ani的帖子

html5画布未显示完整图像

我的图片大小为940*300,但html5画布仅显示chrome中的部分图片.你能帮忙解决这个问题吗?

下面是代码

<!DOCTYPE html>
<html>
    <head>
        <style></style>
    </head>
    <body onload="draw();">
        <p>Drag me</p>
        <canvas id="paint_area"></canvas>

        <script>
            function draw() {
                var ctx = document.getElementById('paint_area').getContext('2d');

                //ctx.fillStyle = '#cc3300';

                var img_buffer = document.createElement('img');
                img_buffer.src = 'http://www.jobcons.in/homebanner.jpg';
                var imgWidth = img_buffer.width;
                var imgHeight = img_buffer.height;
                ctx.width = imgWidth;
                ctx.height = imgHeight;
                ctx.drawImage(img_buffer,0,0,imgWidth,imgHeight);
            }
        </script>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

html5 canvas html5-canvas

7
推荐指数
2
解决办法
5410
查看次数

标签 统计

canvas ×1

html5 ×1

html5-canvas ×1