@c-frame/aframe-physics-system
Version:
Physics system for A-Frame VR, built on Cannon.js & Ammo.js
55 lines (51 loc) • 2.38 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 CANNON Worker</title>
<script src="https://aframe.io/releases/1.7.0/aframe.min.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/cannon-worker/spring.html">
view code
</a>
<a-scene 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" static-body></a-box>
<a-box position="2 1 -3"
color="green"
dynamic-body
spring="target: #one; 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" static-body></a-box>
<a-box id="onespring"
position="0 1 -3"
color="green"
dynamic-body
spring="target: #two; 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" static-body></a-box>
<a-box id="twospring"
position="-2 1 -3"
color="green"
dynamic-body
spring="target: #three;"></a-box>
<a-text color="black" position="4.5 3 -3" value="localAnchorB:1 0 0"></a-text>
<a-box id="four" position="5 2 -3" color="blue" static-body></a-box>
<a-box id="threespring"
position="5 1 -3"
color="green"
dynamic-body
spring="target: #four;localAnchorB: 1 0 0;"></a-box>
</a-scene>
</body>
</html>