我试图将图像文件“sticky.png”放入 Canvas 框中，但我得到的只是一 block 空白 Canvas 。谁能指出我做错了什么和/或给我有效的代码？
<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #000000;">
</canvas>
<body>
<script>
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var sticky = new Image();
sticky.onload = function() {
context.drawImage(sticky, 0, 0);
sticky.src = "sticky.png";
};
</script>
</body>
最佳答案
您需要在 sticky.onload 之前包含 sticky.src。
<body>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var sticky = new Image();
sticky.src = "sticky.png";
sticky.onload = function() {
context.drawImage(sticky, 0, 0);
};
</script>
</body>
Fiddle
关于javascript - 为什么 context.drawImage() 在 html canvas 中不起作用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26186381/