three.js + physi.js
-
hello,
Loving this plug-in but I have hit a snag with three.js + Physi.js. In short, I cannot get Physi.js to work – nothing shows up on the page in which it is embedded. I have tested some of Three.js and some other helper libraries and they work fine with Code Embed. Below is the code that I have been using – the simplest scene possible consisting of just a single cube. There are a couple of commented out lines that I was experimenting with – I am just learning three.js. I absolutely need some physics and from what I have seen so far physi.js seems like the best.<script type=”text/javascript” charset=”UTF-8″ src=”../libs/three/build/three.js”></script>
<script type=”text/javascript” charset=”UTF-8″ src=”../libs/other/physijs/physi.js”></script>
<script>Physijs.scripts.worker = ‘../libs/other/physijs/physijs_worker.js’;
Physijs.scripts.ammo = ‘../libs/other/physijs/ammo.js’;var scene = new Physijs.Scene;
var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setClearColor(new THREE.Color(0x000000));
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);var cube = new Physijs.BoxMesh(new THREE.BoxGeometry(4, 4, 4),
Physijs.createMaterial(new THREE.MeshStandardMaterial({color: 0x0000ff}), 0.4, 0.4));
cube.castShadow = true;cube.position.x = -4;
cube.position.y = 2;
cube.position.z = 0;
scene.add(cube);camera.position.x = -30;
camera.position.y = 40;
camera.position.z = 30;
camera.lookAt(scene.position);var spotLight = new THREE.SpotLight(0xFFFFFF);
spotLight.position.set(-40, 40, -15);
spotLight.castShadow = true;
spotLight.shadow.mapSize = new THREE.Vector2(1024, 1024);
spotLight.shadow.camera.far = 130;
spotLight.shadow.camera.near = 40;scene.add(spotLight);
var ambientLight = new THREE.AmbientLight(0x353535);
scene.add(ambientLight);//document.body.appendChild(renderer.domElement);
scene.simulate();
//requestAnimationFrame(render);render();
function render() {
requestAnimationFrame(render);
renderer.render(scene, camera);
scene.simulate(undefined, 1);
}</script>`
Thank you for this excellent plug-in!
The page I need help with: [log in to see the link]
The topic ‘three.js + physi.js’ is closed to new replies.