three+oimo实现三维布娃娃落地碰撞试验效果代码-html代码-BFW代码库

three+oimo实现三维布娃娃落地碰撞试验效果代码

代码语言：html

所属分类：三维

代码描述：three+oimo实现三维布娃娃落地碰撞试验效果代码，可集中投放和放开投放，还可设置数量及碰撞监测开关。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  

  
  
<style>
* {  margin: 0; padding: 0; border: 0;}
body { background-color: #252627; overflow: hidden; color: #eeeeee; font-family: monospace; font-size: 11px; }
input{ margin:0; padding:4px; }
#interface{ position: absolute; left:10px; top:10px; width:456px; height:20px; }
#info{ pointer-events:none; position: absolute; left:10px; top:50px; width: 400px; height: 400px; }
#my_image{ position: absolute; display:none }
</style>


  
  
</head>

<body>
  <img id="my_image" />
<div id='container'></div>
<div id='interface'>
    <input type="button" value="demo 1" onClick=populate(1)>
    <input type="button" value="demo 2" onClick=populate(2)>
    <input type="number" name="quantity" min="1" max="120" value="32"  id='MaxNumber'>
    <input type="submit" onClick=populate()>
    <input type="button" value="collision off" onClick=switchCollision() id="col">
    <input type="number" name="gravity" min="-20" max="20" value="-10" id='gravity' onChange=gravity() >
</div>
<div id='info'></div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.oimo.min.js"></script>
      <script  >
// three var
var camera, scene, light, renderer, container, center;
var meshs = [];
var grounds = [];
var geoBox, geoSphere, geoSphere2, geoCylinder, geoCylinder2;
var matBox, matSphere, matBoxSleep, matSphereSleep, matGround, matBoxSleep2, matBox2, matHead;

// navigation var 
var camPos = { horizontal: 90, vertical: 75, distance: 200, automove: false };
var mouse = { ox: 0, oy: 0, h: 0, v: 0, mx: 0, my: 0, down: false, over: false, moving: true };
var ToRad = Math.PI / 180;

//oimo var
var world;
var bodys = [];
var joints = [];

var ToRad = Math.PI / 180;

var type = 1;
var collision = false;
var bgColor = 0x252627;

init();
//loop();

function init() {

  renderer = new THREE.WebGLRenderer({ precision: "mediump", antialias: false });
  renderer.setSize(window.innerWidth, window.innerHeight);
  renderer.setClearColor(bgColor, 1);
  renderer.shadowMapEnabled = true;
  renderer.gammaInput = true;
  renderer.gammaOutput = true;

  container = document.getElementById("container");
  container.appendChild(renderer.domElement);

  camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 3000);
  center = new THREE.Vector3(0, 50, 0);
  moveCamera();

  scene = new THREE.Scene();
  scene.fog = new THREE.Fog(bgColor, 500, 1000);
  scene.add(new THREE.AmbientLight(bgColor));

  light = new THREE.DirectionalLight(0xd6e8f2, 1.5);
  light.position.copy(Orbit(center, 45, 20, 600));
  var d = 500;
  light.castShadow = true;
  light.shadowCameraVisible = false;

  light.shadowMapWidth = 1024;
  light.shadowMapHeight = 1024;
  light.shadowCameraLeft = -d;
  light.shadowCameraRight = d;
  light.shadowCameraTop = d;
  light.shadowCameraBottom = -d;
  light.s.........完整代码请登录后点击上方下载按钮下载查看