Question

我在画布上渲染时遇到问题。它给了我以下错误：

[17：05：28.636] TypeError：CanvasRenderingContext2D.drawImage的参数1无法转换为以下任何一个：HTMLImageElement，HTMLCanvasElement，HTMLVideoElement。 @ file：///home/alex/Desktop/Game/index.html:24

var gameCanvas = document.getElementById("graphics");
var grafx = gameCanvas.getContext("2d");
var stele = new Object("../resources/sprites/enemy/enemyship1.png",500,500);
GameLoop();

function GameLoop(){

grafx.clearRect(0,0,gameCanvas.width,gameCanvas.height);
grafx.drawImage(stele.Sprite,stele.X,stele.Y);


setTimeout(GameLoop,1000/60);
}

function SteleMiscatoare(img,x,y) {
this.Sprite = new Image();
this.Sprite.src = img ;
this.X = x;
this.Y = y;

}

和HTML文件：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>UFO Space Atack</title>
<link rel="stylesheet" style="text/css" href="data/stylesheet.css" />
</head>
<body onkeydown="keyDown(e)" onkeyup="keyUp(e)">
<div class="container">
    <h1 class="title">UFO Space Atack</h1>
</div>
<div class="canvascontainer" align="center">
    <canvas id="graphics" width="950px" height="490" id="graphics"></canvas>
</div>

<script src="data/stele.js"></script>

</body>
</html>

有人可以帮我解决这个问题吗？谢谢！我在JavaScript中开始......

Answer 1

var stele = new Object("../resources/sprites/enemy/enemyship1.png",500,500);

应该是：

var stele = new SteleMiscatoare("../resources/sprites/enemy/enemyship1.png",500,500);

绘制它时画布HTML错误

1 个答案: