Question

我使用THREE.STLLoader加载了一个模型。

var loader = new THREE.STLLoader();
loader.addEventListener('load', function(event) {
    var mesh = event.content;
    scene.add(mesh);
});
loader.load('model/test.stl');

我需要将顶点和片段着色器应用于此模型。怎么做？

Answer 1

包含着色器的常用方法是将它们放在<script>标记中：

<script id="vertexShader" type="x-shader/x-vertex">

    void main() {
        ...
    }

</script>

<script id="fragmentShader" type="x-shader/x-fragment">

    void main() {
        ...
    }

</script>

然后，在init函数中：

// it's useful to have uniforms as a ~global variable,
// so you can modify them from other functions
// in animate() or render() for example
var uniforms = {
    // here, your shader's uniforms variables
};

var material = new THREE.ShaderMaterial( {
    uniforms: uniforms
    vertexShader: document.getElementById( 'vertexShader' ).textContent,
    fragmentShader: document.getElementById( 'fragmentShader' ).textContent
});

并在你的加载器回调中

var mesh = event.content;
mesh.material = material;

看看这个简单的着色器示例http://threejs.org/examples/webgl_shader.html

Answer 2

这个问题没有显示出任何自己的研究成果。请参阅：How to assign a material to ColladaLoader or OBJLoader

只有三天大。也许下次尝试搜索至少3秒以上 rollingEyes 。是的，有很多例子要检查，正如文森特所说的那样。

如何将着色器添加到从STLLoader加载的THREE.Object3D

2 个答案: