Question

我是画布的新手。我使用以下代码从另一个图像插入画布中的图像。当我尝试使用代码

从div创建图像时

 <!DOCTYPE html><html> 
        <head> 
            <title>test</title> 
            <script type="text/javascript">
            var colour="#ccc",bgcolour="#fff";
            function paint(hhh){
               canvas = document.getElementById('canvas'); 
               ctx = canvas.getContext('2d');
               var img=document.getElementById('mine');
               ctx.drawImage(img,0,0);
            }
        </script> 
        </head> 
        <body  onload="paint('scribble');"  >
            <canvas id="canvas" style="border:solid 1px;" width="400" height="400">g</canvas>  <div id="mine">canvas</div>
        </body> 
    </html>

它不起作用。 我的问题是如何从div而不是其他图像中绘制图像？

Answer 1

问题是您无法从不是图像的元素或其他画布元素绘制到画布。查看此MDN文章，了解更多信息 Using images with canvas

另一个问题是你在事件中处理像图像一样的div，div没有onload事件。

Answer 2

您可以在Canvas上使用drawImage绘制的唯一图像是在图像对象的“src”属性中声明的图像。规格可能是found here。

我不知道将div标签的内容放在图像对象中的任何方法，我认为这不是一件容易的事情。你应该考虑替代方案......

从Div创建图像

2 个答案: