javascript - 如何使一张图像在每次加载时出现在 Canvas 上的随机位置?

标签 javascript html canvas

我正在制作一个简单的游戏,玩家必须在 Canvas 上的某个位置找到图像。但是,我想让这个单个图像出现在 Canvas 上的不同位置,然后停留在那里,直到再次加载 Canvas 。换句话说,我不希望图像在一定时间间隔后继续随机出现在 Canvas 上。相反,我希望每次加载 Canvas 时图像的位置都是随机的。有什么建议吗?

最佳答案

你可以尝试这样的事情

function getpos(min, max) {
   return Math.random() * (max - min) + min;
}
var c = document.getlementById('canvas');
var element = document.getlementById('element');
ymin = c.offsetLeft;
ymax = ymin + c.offsetWidth

xmin = c.offsetTop;
xmax = xmin + c.offsetHeight;


var ctx = c.getContext("2d");
ctx.drawImage(element, getpos(xmin, xmax), getpos(ymin,ymax))

关于javascript - 如何使一张图像在每次加载时出现在 Canvas 上的随机位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29885866/

相关文章:

javascript - 获取值输入单选按钮 javascript

php - 如何调用从 PHP 传递变量的 Javascript

html - CSS - 如何强制全屏高度增长以获得更长的内容?

javascript - html5 Canvas 。模糊的线条

css - 如何让 Canvas 占用 100% 的剩余空间?

Android:如何使用 Canvas /绘制位图缩放位图以适合屏幕大小?

javascript - Venkman 的 JavaScript 调试器

html - 如何保持居中和对齐?

javascript - JQuery溢出其他子元素时如何显示子元素

javascript - 迭代数组中的 3 个项目