我正在尝试为我在 three.js 中使用 BufferGeometry 创建的粒子添加纹理。
我相信我正在正确加载材料，问题出在我的片段着色器中，但由于我是three.js 的新手，所以无法解决这个问题。我设法使用几何而不是 BufferGeometry 获得了我想要的效果：https ://codepen.io/phillip-hogan/pen/mMJdXY/?editors=0010
...但我真的需要理想地使用 BufferGeometry。下面是我的代码：
var shaderMaterial = new THREE.ShaderMaterial({
uniforms: particleUniforms,
vertexShader: vertexshaderSource, // need to fill this variable with source of vertex-shader
fragmentShader: fragmentshaderSource, // similarly, source of the fragment-shader
blending: THREE.AdditiveBlending,
depthTest: false,
depthWrite: false,
transparent: true
});
...以及我的顶点和片段着色器代码：
var vertexshaderSource = [
"attribute float size;",
"attribute vec3 customColor;",
"varying vec3 vColor;",
"void main() {",
"vColor = customColor;",
"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
"gl_PointSize = size * ( 30.0 / -mvPosition.z );",
"gl_Position = projectionMatrix * mvPosition;",
"}"
].join("\n");
var vertexshaderSource = [
"attribute float size;",
"attribute vec3 customColor;",
"varying vec3 vColor;",
"void main() {",
"vColor = customColor;",
"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
"gl_PointSize = size * ( 30.0 / -mvPosition.z );",
"gl_Position = projectionMatrix * mvPosition;",
"}"
].join("\n");
var fragmentshaderSource = [
"uniform vec3 color;",
"varying vec3 vColor;",
"void main() {",
"gl_FragColor = vec4( color * vColor, 1.0 );",
"}"
].join("\n");