Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/86.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
使用外部Javascript将图像添加到HTML画布_Javascript_Html - Fatal编程技术网
Fatal编程技术网
  • javascript/
  • 使用外部Javascript将图像添加到HTML画布

使用外部Javascript将图像添加到HTML画布

javascript html

使用外部Javascript将图像添加到HTML画布,javascript,html,Javascript,Html,我试图在画布中显示图像。我尝试了多种解决方案，但图像从未显示。简单地通过HTML中的标记添加图像效果很好，所以我知道这不是我的文件路径或图像本身的问题 单独的文件、HTML文件和JS文件 <!DOCTYPE html> <html> <head> <title>DrawingSprite</title> <script src="MovingSquareGame.js"></script> </head&g

我试图在画布中显示图像。我尝试了多种解决方案，但图像从未显示。简单地通过HTML中的标记添加图像效果很好，所以我知道这不是我的文件路径或图像本身的问题

单独的文件、HTML文件和JS文件

<!DOCTYPE html>
<html>
<head>
<title>DrawingSprite</title>
<script src="MovingSquareGame.js"></script>
</head>
<body>
<div id="gameArea">
    <canvas id="myCanvas" width="800" height="480"></canvas>
</body>
</html>
首先

你的代码

Game.drawImage(Game.balloonSprite, {(x : 100, y : 100)});
对象中不应该有括号，它应该是：

Game.drawImage(Game.balloonSprite, {x : 100, y : 100));
然后如果我们在

Game.start();
我们结合这些修复，将工作图像绘制到画布：

正如@Bug所说，您的代码没有被写入：

Game.drawImage（Game.ballopsprite，{（x:100，y:100）}）

应该是：


Game.drawImage（Game.ballopsprite，{x:100，y:100}）

然后为了让它正常工作，我创建了一个img标签，带有display none css属性

然后我必须重新排列你的代码！并在声明函数后调用它们。
您可以在此处查看我的工作解决方案：


@BrandanDampf哈哈，谢谢，你可以点击帖子上向下投票箭头下的箭头，将答案标记为解决方案：）

Game.start();