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

How to add shader to THREE.Object3D loaded from STLLoader

本文关键字：THREE STLLoader 加载 Object3D 添加      更新时间：2023-09-26

我有一个使用 THREE 加载的模型。斯特洛德。

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

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

包含着色器的常用方法是将它们放在<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

这个问题并没有显示出自己的研究努力。请参阅： 如何将材料分配给 ColladaLoader 或 OBJLoader

只有三天大。也许下次，尝试搜索至少超过3秒的翻白眼。是的，正如文森特所建议的那样，有很多例子可以查看。

相关文章：