「-g_text3」の編集履歴（バックアップ）一覧はこちら

「-g_text3」(2013/04/21 (日) 00:02:02) の最新版変更点

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

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

#javascript(){{
<script type="text/javascript"><!--
$(function(){
  var init = function(){
    // シーン
    var scene = new THREE.Scene();

    // パス
    var path = new THREE.SplineCurve3([
      new THREE.Vector3(0,0,0),
      new THREE.Vector3(0,40,0),
      new THREE.Vector3(40,40,0),
      new THREE.Vector3(40,40,40)
    ]);

    // テキスト
    var text = new THREE.Mesh(
      new THREE.TextGeometry( 'Leg', {
        size: 25, height:10, curveSegments: 1,
        font: 'helvetiker', weight: 'normal', style: 'normal',
        bevelEnabled: true, bevelThickness: 5, bevelSize: 5, bevelSegments: 1, // 効かない
        material: 0, extrudeMaterial: 1,
        extrudePath: path,  // パス
        steps: 32  // 32分割で
      }),
      new THREE.MeshFaceMaterial([
        new THREE.MeshLambertMaterial( { color: 0x00ffff } ),
        new THREE.MeshLambertMaterial( { color: 0x0000ff } )
      ])
    );
    scene.add( text );

    // 床
    var n_yuka = 5, yuka_w = 60;
    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(20,40,50);
    light.position.normalize();

    // カメラ
    var camera = new THREE.PerspectiveCamera( 30, 320/240, 1, 1000 );
    camera.position.set(-18,60,270);
    camera.lookAt((new THREE.Vector3).set(30,10,0));

    // レンダラ
    var renderer = new THREE.WebGLRenderer( { antialias: true } );
    renderer.setSize( 320, 240 );
    var container = $('#d2');
    container.append( renderer.domElement );
    renderer.render( scene, camera );

    (function(){
      flg = true;
      flg2 = true;
      flg3 = true;
      setTimeout(arguments.callee, 70);
    })();

    // マウスが動いたイベント
    $(document).mousemove(function(e){
      if(flg3){
        cp = container[0].getBoundingClientRect();
        text.rotation.y = (e.clientX-cp.left-160) / 72;
        text.rotation.x = (e.clientY-cp.top-210) / 54;
        renderer.render( scene, camera );
        flg3 = false;
      }
    });
  };

  if ( Detector.webgl ){
    init();
  }else{
    $('#d2').html('<span style="color:red;">あなたが使用中のブラウザはWebGL非対応もしくはWebGLが有効になっていません。</span>');
  }
});
//--></script>
}}

#javascript(){{
<script type="text/javascript"><!--
$(function(){
  var init = function(){
    // シーン
    var scene = new THREE.Scene();

    // パス
    var path = new THREE.SplineCurve3([
      new THREE.Vector3(0,0,0),
      new THREE.Vector3(0,40,0),
      new THREE.Vector3(40,40,0),
      new THREE.Vector3(40,40,40)
    ]);

    // テキスト
    var text = new THREE.Mesh(
      new THREE.TextGeometry( 'Leg', {
        size: 25, height:10, curveSegments: 1,
        font: 'helvetiker', weight: 'normal', style: 'normal',
        bevelEnabled: true, bevelThickness: 5, bevelSize: 5, bevelSegments: 1, // 効かない
        material: 0, extrudeMaterial: 1,
        extrudePath: path,  // パス
        steps: 32  // 32分割で
      }),
      new THREE.MeshFaceMaterial([
        new THREE.MeshLambertMaterial( { color: 0x00ffff } ),
        new THREE.MeshLambertMaterial( { color: 0x0000ff } )
      ])
    );
    scene.add( text );

    // 床
    var oneWidth = 60, oneHeight = 60, 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(20,40,50);
    light.position.normalize();

    // カメラ
    var camera = new THREE.PerspectiveCamera( 30, 320/240, 1, 1000 );
    camera.position.set(-18,60,270);
    camera.lookAt((new THREE.Vector3).set(30,10,0));

    // レンダラ
    var renderer = new THREE.WebGLRenderer( { antialias: true } );
    renderer.setSize( 320, 240 );
    var container = $('#d2');
    container.append( renderer.domElement );
    renderer.render( scene, camera );

    (function(){
      flg = true;
      flg2 = true;
      flg3 = true;
      setTimeout(arguments.callee, 70);
    })();

    // マウスが動いたイベント
    $(document).mousemove(function(e){
      if(flg3){
        cp = container[0].getBoundingClientRect();
        text.rotation.y = (e.clientX-cp.left-160) / 72;
        text.rotation.x = (e.clientY-cp.top-210) / 54;
        renderer.render( scene, camera );
        flg3 = false;
      }
    });
  };

  if ( Detector.webgl ){
    init();
  }else{
    $('#d2').html('<span style="color:red;">あなたが使用中のブラウザはWebGL非対応もしくはWebGLが有効になっていません。</span>');
  }
});
//--></script>
}}