小编Gor*_*tić的帖子

我在three.js中搜索了简单到复杂的着色器示例,但似乎找不到将顶点保持的颜色传递给片段着色器的简单示例.我做了一个简单的例子,其中顶点着色器只是将顶点留在它们所在的位置,但也通过"vColor"变化将"颜色"均匀(我认为我看到某处但未使用过)传递给片段着色器,然后在片段着色器中,我只想返回相同的颜色.浏览器呈现三角形黑色,我猜测颜色是空的.我知道这很简单,但我无法弄清楚自己,我无法弄清楚ShaderMaterial传递给我可以在那里玩的着色器.有人可以解释一下吗？

这是代码:

<script id="vertexShader" type="x-shader/x-vertex">
    uniform vec3 color;

    varying vec3 vColor;

    void main(){
        vColor = color;
        gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
    }
</script>

<script id="fragmentShader" type="x-shader/x-fragment">
    varying vec3 vColor;

    void main(){
        gl_FragColor = vec4( vColor.rgb, 1.0 );
    }
</script>
<script>
    var container,
        camera,
        controls,
        scene,
        renderer,
        model;

    init();
    animate();

    function init() {
        camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 1, 10000);
        camera.position.y = 150;
        camera.position.z = 500;

        scene = new THREE.Scene();

        var geometry = new THREE.Geometry();
        geometry.vertices.push( …