LoginSignup
8
11

More than 5 years have passed since last update.

three.js テクスチャを貼る

Posted at

スクリーンショット 2016-06-24 10.17.36.png

頑張ってトレースしたヒゲおじさんボックス画像を貼り付ける。

コードの基本形はこちら
□ three.jsテンプレート。ボックス一つ表示
http://qiita.com/39_isao/items/d1cb35d30a309568dc28

hoge.js

    // loaderオブジェクトを作って、画像をロード次第、mesh作成


    var loader = new THREE.TextureLoader();

    loader.load("block.jpg", function(texture){
        createBox(texture); // mesh作成
        render();
    });


    function createBox(texture){
        box = new THREE.Mesh(
            new THREE.BoxGeometry(100, 100, 100),
            new THREE.MeshLambertMaterial({map: texture})  // {map: texture}がキモ
        );
        box.position.set(0, 0, 0);

        // シーンに追加
        scene.add(box);
    }



    function render(){
      // レンダリング処理ごにょごにょ
    }
8
11
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
11