如何使我的绘图放在第一个画布计划？ [英] How to make my drawing put on the 1st plan of canvas?
本文介绍了如何使我的绘图放在第一个画布计划？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
当我需要他在前面产卵时，这个蓝色的圆圈就会产卵。什么可以错了？是因为画布背景只加载 onmouseover ？或者因为它是随机的或者因为网格本身不像画布一样大？我真的很困惑。
This blue circle is spawning back there, when I need him spawning on the front. What can be wrong? Is it because the canvas background loads only onmouseover? or because it's random or because the grid itself isn't as big as canvas? I'm really confused.
<!doctype html>
<html>
<head>
<title>Ussi l6una</title>
<script>
var kohad=new Array();
var pikkus=1, d=6, kogus=300;
var ballx=0, step=100;
var bally=0, step=100;
var monsterx=(step*parseInt(5*Math.random())), step=100;
var monstery=(step*parseInt(5*Math.random()));
function toit(){
var c=document.getElementById("tahvel");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.fillStyle = 'darkblue';
ctx.arc(monsterx+10, monstery+10, 25, 0, 2 * Math.PI, false);
ctx.fill();
ctx.lineWidth = 0;
ctx.strokeStyle = '#000000';
}
function devouring(){
if(monsterx==ballx && bally==monstery){
monsterx=step*parseInt(5*Math.random());
monstery=step*parseInt(5*Math.random());
toit();
cnt++;
punktid();
}
}
function looKohad(){
for(var i=0; i<kogus; i++){
kohad[i]=new Array(pikkus*i, 1200);
}
}
function arvutaUusTagumine(eesmine, tagumine){
var kaugus=new Array();
kaugus[0]=eesmine[0]-tagumine[0];
kaugus[1]=eesmine[1]-tagumine[1];
var kogukaugus=Math.sqrt(kaugus[0]*kaugus[0]+kaugus[1]*kaugus[1]);
var nihe=kogukaugus-pikkus;
var dx=kaugus[0]*nihe/kogukaugus;
var dy=kaugus[1]*nihe/kogukaugus;
return new Array(tagumine[0]+dx, tagumine[1]+dy);
}
function arvutaUuedKohad(){
console.log(kohad);
for(var i=1; i<kogus; i++){
kohad[i]=arvutaUusTagumine(kohad[i-1], kohad[i]);
}
}
function joonistaKohad(g){
for(var i=0; i<kogus; i++){
joonistaKoht(g, kohad[i])
}
}
function joonistaKoht(g, koht){
g.beginPath();
g.arc(koht[0], koht[1], d, 0, 2*Math.PI, true);
g.stroke();
}
function hiirLiigub(e){
var t=document.getElementById("tahvel");
var g=t.getContext("2d");
var tahvlikoht=t.getBoundingClientRect();
kohad[0][0]=e.clientX-tahvlikoht.left;
kohad[0][1]=e.clientY-tahvlikoht.top;
arvutaUuedKohad();
g.strokeStyle="#CC9966";
g.fillStyle="#CC9966";
g.clearRect(0, 0, t.width, t.height);
joonistaKohad(g);
}
looKohad();
</script>
</head>
<body
onLoad="toit();">
<canvas id="tahvel" width="800" height="800"
style="background-color:white" onmousemove="hiirLiigub(event)" onmouseover="this.style.backgroundImage = 'url(./dirt.png)'"></canvas><br />
</body>
</html>
推荐答案
你只是忘了在调用joonistaKohad G）;在主绘图循环中。
由于您清除了画布，因此必须重绘所有内容。
结果很好。
You simply forgot to call toit() after joonistaKohad(g); in the main draw loop.
Since you clear the canvas, you have to redraw everything afterwise.
Nice result by the way.
这篇关于如何使我的绘图放在第一个画布计划？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
