-g_cube

「-g_cube」の編集履歴(バックアップ)一覧はこちら

-g_cube」(2013/04/20 (土) 23:38:11) の最新版変更点

追加された行は緑色になります。

削除された行は赤色になります。

#javascript(){{ <script type="text/javascript" src="http://cdn56.atwikiimg.com/threejs/pub/three.min.js"></script> <script type="text/javascript" src="http://cdn56.atwikiimg.com/threejs/pub/Detector.js"></script> <script type="text/javascript"><!-- $(function(){ var init = function(){ // シーン var scene = new THREE.Scene(); // 直方体 var cube = new THREE.Mesh( new THREE.CubeGeometry(12,10,8), new THREE.MeshLambertMaterial( { color: 0x00ff00 } ) ); scene.add( cube ); // 直方体のワイヤーフレーム var cube2 = new THREE.Mesh( cube.geometry, new THREE.MeshBasicMaterial( { color: 0x000000, wireframe:true } ) ); scene.add( cube2 ); // 床 var n_yuka = 5, yuka_w = 10; for(var i=-n_yuka; i<=n_yuka ; i++){ for(var j=-n_yuka; j<=n_yuka ; j++){ if((i+j)%2==0){ var plane = new THREE.Mesh( new THREE.PlaneGeometry(yuka_w, yuka_w, 1, 1), new THREE.MeshBasicMaterial({color: 0x999999, wireframe: true}) ); }else{ var plane = new THREE.Mesh( new THREE.PlaneGeometry(yuka_w, yuka_w, 1, 1), new THREE.MeshBasicMaterial({color: 0x4d4d4d, wireframe: true}) ); } plane.position.x = j*yuka_w; plane.position.z = i*yuka_w; plane.rotation.x = -Math.PI/2; plane.rotation.y = 0; plane.rotation.z = 0; scene.add(plane); } } // xyz軸 var axes = new THREE.AxisHelper(100); scene.add( axes ); // ライト var light = new THREE.DirectionalLight( 0xffffff, 1 ); scene.add( light ); light.position.set(30,100,50); light.position.normalize(); // カメラ var camera = new THREE.PerspectiveCamera( 30, 320/240, 1, 1000 ); camera.position.set(-3,10,45); camera.lookAt(scene.position); // レンダラ var renderer = new THREE.WebGLRenderer( { antialias: true } ); renderer.setSize( 320, 240 ); var container = $('#d0'); container.append( renderer.domElement ); renderer.render( scene, camera ); var flg = false; (function(){ flg = true; setTimeout(arguments.callee, 70); })(); // マウスが動いたイベント $(document).mousemove(function(e){ if(flg){ cp = container[0].getBoundingClientRect(); cube.rotation.y = cube2.rotation.y = (e.clientX-cp.left-160) / 72; cube.rotation.x = cube2.rotation.x = (e.clientY-cp.top-210) / 54; renderer.render( scene, camera ); flg = false; } }); }; if ( Detector.webgl ){ init(); }else{ $('#d0').html('<span style="color:red;">あなたが使用中のブラウザはWebGL非対応もしくはWebGLが有効になっていません。</span>'); } }); //--></script> }}
#javascript(){{ <script type="text/javascript" src="http://cdn56.atwikiimg.com/threejs/pub/three_r58.min.js"></script> <script type="text/javascript" src="http://cdn56.atwikiimg.com/threejs/pub/Detector.js"></script> <script type="text/javascript"><!-- $(function(){ var init = function(){ // シーン var scene = new THREE.Scene(); // 直方体 var cube = new THREE.Mesh( new THREE.CubeGeometry(12,10,8), new THREE.MeshLambertMaterial( { color: 0x00ff00 } ) ); scene.add( cube ); // 直方体のワイヤーフレーム var cube2 = new THREE.Mesh( cube.geometry, new THREE.MeshBasicMaterial( { color: 0x000000, wireframe:true } ) ); scene.add( cube2 ); // 床 var oneWidth = 10, oneHeight = 10, wUnits = 11, hUnits = 11; var groundGeo = new THREE.PlaneGeometry(oneWidth*wUnits, oneHeight*hUnits, wUnits, hUnits); for(var i=0, len = groundGeo.faces.length, f=-1; i<len; i++){ f = -1; if((i/wUnits | 0)%2==1){ f = ~f; } if((i%wUnits)%2==1){ f = ~f; } groundGeo.faces[i].materialIndex = f+1; } var ground = new THREE.Mesh( groundGeo, new THREE.MeshFaceMaterial([ new THREE.MeshBasicMaterial({color: 0x999999, wireframe:true }), new THREE.MeshBasicMaterial({color: 0x4d4d4d, wireframe:true }) ]) ); ground.rotation.x = -Math.PI/2; scene.add(ground); // xyz軸 var axes = new THREE.AxisHelper(100); scene.add( axes ); // ライト var light = new THREE.DirectionalLight( 0xffffff, 1 ); scene.add( light ); light.position.set(30,100,50); light.position.normalize(); // カメラ var camera = new THREE.PerspectiveCamera( 30, 320/240, 1, 1000 ); camera.position.set(-3,10,45); camera.lookAt(scene.position); // レンダラ var renderer = new THREE.WebGLRenderer( { antialias: true } ); renderer.setSize( 320, 240 ); var container = $('#d0'); container.append( renderer.domElement ); renderer.render( scene, camera ); var flg = false; (function(){ flg = true; setTimeout(arguments.callee, 70); })(); // マウスが動いたイベント $(document).mousemove(function(e){ if(flg){ cp = container[0].getBoundingClientRect(); cube.rotation.y = cube2.rotation.y = (e.clientX-cp.left-160) / 72; cube.rotation.x = cube2.rotation.x = (e.clientY-cp.top-210) / 54; renderer.render( scene, camera ); flg = false; } }); }; if ( Detector.webgl ){ init(); }else{ $('#d0').html('<span style="color:red;">あなたが使用中のブラウザはWebGL非対応もしくはWebGLが有効になっていません。</span>'); } }); //--></script> }}

表示オプション

横に並べて表示:
変化行の前後のみ表示: