@c-frame/aframe-physics-system
Version:
Physics system for A-Frame VR, built on Cannon.js & Ammo.js
58 lines (54 loc) • 2.99 kB
HTML
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no,user-scalable=no,maximum-scale=1">
<title>Examples • Spring AMMO</title>
<script src="https://aframe.io/releases/1.7.0/aframe.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/MozillaReality/ammo.js@8bbc0ea/builds/ammo.wasm.js"></script>
<script src="../../dist/aframe-physics-system.js"></script>
<link rel="stylesheet" href="../styles.css">
</head>
<body>
<div class="text-overlay">
<p>Four vertical springs each between two boxes with an
assortment of damping and stiffness values using the Cannon Worker driver.</p>
</div>
<a class="code-link"
target="_blank"
href="https://github.com/c-frame/aframe-physics-system/blob/master/examples/ammo/spring.html">
view code
</a>
<a-scene physics="driver: ammo" stats>
<a-text color="black" position="1.5 3 -3" value="damping: 0.25\nstiffness: 25"></a-text>
<a-box id="one" position="2 2 -3" color="blue" ammo-body="type: static"></a-box>
<!-- default linearSleepingThreshold of 1.6 is a little too high and the spring ends up freezing
with that setting. A value of 0.5 works better-->
<a-box position="2 1 -3"
color="green"
ammo-body="linearSleepingThreshold: 0.5" ammo-shape
ammo-constraint="target: #one; type: spring; damping: 0.25; stiffness: 25"></a-box>
<a-text color="black" position="-0.5 3 -3" value="damping: 0.75\nstiffness: 75"></a-text>
<a-box id="two" position="0 2 -3" color="blue" ammo-body="type: static"></a-box>
<a-box id="onespring"
position="0 1 -3"
color="green"
ammo-body="linearSleepingThreshold: 0.5" ammo-shape
ammo-constraint="target: #two; type: spring; damping: 0.75; stiffness: 75;"></a-box>
<a-text color="black" position="-2.5 3 -3" value="damping: 1\nstiffness: 100"></a-text>
<a-box id="three" position="-2 2 -3" color="blue" ammo-body="type: static"></a-box>
<a-box id="twospring"
position="-2 1 -3"
color="green"
ammo-body="linearSleepingThreshold: 0.5" ammo-shape
ammo-constraint="target: #three; type: spring; "></a-box>
<a-text color="black" position="4.5 3 -3" value="localAnchorB:1 0 0\n(not yet supported in Ammo)"></a-text>
<a-box id="four" position="5 2 -3" color="blue" ammo-body="type: static"></a-box>
<a-box id="threespring"
position="5 1 -3"
color="green"
ammo-body="linearSleepingThreshold: 0.5" ammo-shape
ammo-constraint="target: #four; type: spring; targetPivot: 1 0 0;"></a-box>
</a-scene>
</body>
</html>