Question

首先，我正在尝试一个非常简单的用于使用HTML5画布和Javascript进行2d游戏的瓦片地图引擎，除了我的第二个drawChar函数的drawImage（）没有显示在画布上之外，其他一切似乎都正常运行。我知道网址很好，并且已经检查了缺少的字符等，但无法弄清楚。代码如下。任何帮助表示赞赏。

P.S。我知道这段代码中的大部分都不是“现代”或“最佳实践”，我仍在学习，只是在尝试了解为什么会发生此错误。谢谢。

<canvas id="canvas" width="1000" height="500" style="border: 2px solid black; margin: 10px auto;"></canvas>
<script type="text/javascript">
var canvas = document.getElementById('canvas');
var draw=canvas.getContext('2d');

var tileSize=canvas.height/10;
var mapLength=canvas.width/tileSize;
var tilex=0;
var tiley=0;

var tile1= new Image();
var tile2= new Image();
var charImg= new Image();

tile1.src='https://raw.githubusercontent.com/daveboy87/Jscript-TileEngine/master/tile_sky.jpg';

tile2.src='https://raw.githubusercontent.com/daveboy87/Jscript-TileEngine/master/tile_ground.jpg';

charImg.src='https://raw.githubusercontent.com/daveboy87/Jscript-TileEngine/master/player.jpeg';



var mapArray = [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 1, 1, 1, 1, 0, 1, 1]
];





function drawMap() {

for (var y=0; y<mapLength; y++){
for (var x=0; x<tileSize; x++){


tilex=x*tileSize;
tiley=y*tileSize;


if (parseInt(mapArray[y][x]) == 0) {

draw.drawImage(tile1, tilex, tiley, tileSize, tileSize);   }

if (parseInt(mapArray[y][x]) == 1) {

draw.drawImage(tile2, tilex, tiley, tileSize, tileSize);   }

                              }
                              }
               }


function drawChar(){
draw.drawImage(charImg, 300, 200, tileSize, tileSize);     }


function nextFrame(){
draw.clearRect(0, 0, canvas.width, canvas.height);
drawMap();
drawChar();
}

setInterval(nextFrame, 1000);

Answer 1

您正在检查string accessToken = TokenFactory.GetAccessToken(); var builder = new SqlConnectionStringBuilder(); builder["Data Source"] = $"tcp:{dbServer}.database.windows.net,1433"; builder["Initial Catalog"] = dbName; builder["Connect Timeout"] = 30; builder["Persist Security Info"] = false; builder["TrustServerCertificate"] = false; builder["Encrypt"] = true; builder["MultipleActiveResultSets"] = true; var con = new SqlConnection(builder.ToString()); con.AccessToken = accessToken; // attempting to use the con from the SqlConnecti CompanyService _cs = new CompanyService(con); var company = _cs.GetCompany(1); return Request.CreateResponse(HttpStatusCode.OK, new { teststring = accessToken } );-但是mapArray[y][x]和y与x的大小无关，因此您要检查的元素与不存在，并遇到Javascript错误，该错误会阻止程序执行。

您应保持打开Chrome开发人员工具的状态，以便看到Javascript错误，这将在此处显示问题。

为什么我的drawChar函数的drawImage没有显示？

1 个答案: