Detaillierte Erläuterung von Codebeispielen zur Simulation parabolischer Bewegungen in JavaScript-js-Tutorial-php.cn

Detaillierte Erläuterung von Codebeispielen zur Simulation parabolischer Bewegungen in JavaScript

黄舟

Freigeben： 2017-03-15 14:35:23

Original

1857 Leute haben es durchsucht

Parabelbewegung ist eine Art Bewegung, die durch Schwerkraftinduktion verursacht wird. In diesem Artikel wird einfacher JavaScript-Code verwendet, um die Implementierung einer Parabelbewegung zu simulieren.

Dieser JavaScript-Code simuliert die parabolische Bewegung im Zustand Sie können die folgenden Parameter einstellen: Anfangsgeschwindigkeit in Querrichtung, Anfangsgeschwindigkeit in Längsrichtung, Schwerkraftbeschleunigung (wenn diese Beschleunigung ein Wert ist, der sich mit ändert). Zeit, Sie können den Effekt anderer ungleichmäßiger Beschleunigungsbewegungen erzielen), Animation Intervallzeit usw., relativ professionell, der folgende Code ist:

<!doctype html>
<html>
<head>
<title>js抛物运动</title>
<meta charset="utf-8" />
<style type="text/css">
*{padding:0;margin:0;}
body{font-size:13px;padding:10px;}
p{margin:2px;}
.wrap{position:relative;width:1000px;height:550px;margin:0 auto;border:1px solid #ccc;margin-top:50px;}
#fall{width:20px;font-size:1px;height:20px;background:#000;position:absolute;top:0;left:0;}
</style>
</head>
<body>
<h3>模拟重力状态下的抛物运动（假使1px==1mm）</h3>
<p>横向初速度：<input id="Vx" type="text" value="2" />px/ms</p>
<p>纵向初速度：<input id="Vy" type="text" value="-2" />px/ms</p>
<p>重力加速度：<input id="a" type="text" value="0.0098" />px/平方ms</p>
<p>（如果这个加速度是一个随时间变化的值，就能达到其他非匀加速运动的效果了。）</p>
<p>单位时间：<input id="t" type="text" value="10" />（记录运动的时间间隔）
<p><input type="button" value="演示" onclick="demo(document.getElementById(&#39;Vx&#39;).value, document.getElementById(&#39;Vy&#39;).value, 
document.getElementById(&#39;a&#39;).value, document.getElementById(&#39;t&#39;).value)"/></p>
<p class="wrap">
<p id="fall">o</p>
</p>
</body>
<script type="text/javascript">
function demo(x,y,a,t) {
var f=document.getElementById(&#39;fall&#39;);
var Vx=parseInt(x),
Vy=parseInt(y),
g=a,
t=parseInt(t),
h=0,l=0,Sx=0,Sy=0;
var i=setInterval(function(){
if(f){
Sx+=Vx*t;
l=Sx;
Vy+=g*t;
h+=Vy*t;
f.style.left=l+&#39;px&#39;;
f.style.top=h+&#39;px&#39;;
if(h>500||l>900)clearInterval(i);
}
},t);
}
</script>
</html>

Nach dem Login kopieren

Sie können klicken Hier können Sie den Demonstrationseffekt der JavaScript-simulierten Parabelbewegung sehen.

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung von Codebeispielen zur Simulation parabolischer Bewegungen in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!