gpt4 book ai didi

javascript - 在 Canvas 上绘制数组图像?

转载 作者:行者123 更新时间:2023-11-28 20:36:24 24 4
gpt4 key购买 nike

我试图在 Canvas 上绘制一组图像,但没有绘制任何内容!以下是我的代码!我也在尝试了解phonegap和javascript索引.html:

    <!DOCTYPE html>
<html>
<head>
<title>Minecraft Background Check</title>
</head>
<body>
<canvas id="mycanvas" style="position:fixed; top:0; left:0; border:1px solid #c3c3c3; width: 100%; height: 100%;"></canvas>
<script type="text/javascript" src="cordova-2.5.0.js"></script>
<script type="text/javascript">
document.addEventListener("deviceready",ondeviceReady,false);
function onDeviceReady () {}
//get element by id
var c = document.getElementById("mycanvas");
var ctx = c.getContext("2d");
//array image which need to draw in canvas
var image = ["img/image12","img/image13","img/image14","img/image15","img/image10"];
var m_arrImages = {};
for (var src in image) {
m_arrImages[src] = new Image();

m_arrImages[src].src = image[src];
}
var imagePositionsX = [20, 80, 140, 200, 260, 320, 380, 440, 500, 560];
var imagePositionsY = [20, 60, 100, 140, 180, 220, 260, 300, 340, 380];
var i, x, y;
for (i = 0; i < m_arrImages.length; i++) {
x = imagePositionsX[ Math.floor(Math.random()*10) ];
y = imagePositionsY[ Math.floor(Math.random()*10) ];

ctx.drawImage(m_arrImages[i], x, y, 50, 50);
}
</script>
</body>
</html>

最佳答案

您已将函数 ondeviceReady 设置为在 deviceready 事件中运行,但该函数尚未定义。您已经定义了一个名为 onDeviceReady 的函数。 JavaScript 变量和函数名称区分大小写,因此在 deviceready 事件中不会运行任何内容。

更改:

document.addEventListener("deviceready",ondeviceReady,false);

document.addEventListener("deviceready",onDeviceReady,false);

关于javascript - 在 Canvas 上绘制数组图像?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15290002/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com