4

ブレンダーで 3D ランプ モデルを開発し、.NET を使用して Web にロードしましたthree.js。

three.jsモデルは非常に基本的なものですが、私にとって重要なのは、ランプの内側から光が来るように錯覚させる光を生成する方法について誰かに教えてもらいたいということです。遠くからオブジェクトを照らしますが、このランプのシナリオのように、オブジェクト (特にモデル) の片側から光を放射するのはどうでしょうか。

私が怠け者ではないことを理解してください。three.jsドキュメントが非常に限られており、私のニーズに固有の例や説明を見つけることができなかったというだけです。

これは、モデルをロードするこれまでのコードです。

<!DOCTYPE html>
<html>
<head>
<title>example 1: load model</title>
<script type="text/javascript" src="js/three.js"></script>
<script src="js/TrackballControls.js"></script>

<script type="text/javascript">
var controls;
var init = function() {
  var canv = document.getElementsByTagName("canvas")[0];
  var w = canv.clientWidth;
  var h = canv.clientHeight;

  var renderer = new THREE.WebGLRenderer({canvas:canv, antialias: true});
  renderer.setSize( w, h );


  var scene = new THREE.Scene();

  var camera = new THREE.PerspectiveCamera(
      40,     // Field of view
      w / h,  // Aspect ratio
      5,    // Near
      10000   // Far
  );
  camera.position.set( -10, 7, 10 );
  camera.lookAt(scene.position);

  // CONTROLS
 controls = new THREE.TrackballControls( camera );

  light = new THREE.PointLight( 0xFFFFDD );
  light.position.set( -15, 10, 15 );
  scene.add( light );



  var loader = new THREE.JSONLoader(  );
  var onGeometry = function(geom, mats) {
    var mesh = new THREE.Mesh( geom, new THREE.MeshFaceMaterial( mats ) );
    scene.add(mesh);
  };
  loader.load("models/lamp.js", onGeometry);

  var render = function() {

    renderer.render(scene, camera);
    controls.update();
  };

  setInterval(render,10);
};

window.onload = init;
window.onresize = init;
</script>
</head>
<body><canvas style="width:100%;height:95%;border:1px gray solid;"></body>
</html>
4

2 に答える 2