自定义着色器 - Three.js答案

【问题标题】：Custom shader - Three.js自定义着色器 - Three.js
【发布时间】：2012-09-28 05:04:47
【问题描述】：

我正在尝试将自定义着色器与 Three.js 一起使用。我试着像许多例子一样做，但它不起作用。我的代码是：

var vertex = "void main(){vec4 mvPosition = modelViewMatrix * vec4( position, 1.0    );gl_Position = projectionMatrix * mvPosition;}";
var fragment = "precision highp float;void main(void){gl_FragColor = vec4(0.0,1.0,0.0,1.0);}";
material = new THREE.ShaderMaterial({
                vertexShader: vertex,
                fragmentShader: fragment
        });
var mesh = new THREE.Mesh(geometry,material);

……一切都是空白的。但如果我使用这种材料：

material = new THREE.MeshBasicMaterial({ color: 0xff0000, wireframe: true });

……一切都很完美。怎么了？

【问题讨论】：

它对我来说很好用。它一定是您没有显示的其他代码。
几何有问题吗？我正在加载类似顶点和索引的数组，但使用 MeshBasic 材料效果很好..我会尝试在我的代码中更深入地找到它..

标签： javascript webgl three.js

【解决方案1】：

我发现了问题：我不得不使用：

 renderer = new THREE.WebGLRenderer();

而不是：

 renderer = new THREE.CanvasRenderer();

【讨论】：