I'm currently working on creating a geometry in THREE.js:
var dotGeometry = new THREE.Geometry();
dotGeometry.dynamic = true;
var createDot = function (group, x, y, z){
group.vertices.push(new THREE.Vector3( x, y, z));
}
var width = 300;
var height = 300;
var gap = 0.1;
for(var i = 0; i < width; i++){
for(var j = 0; j < height; j++){
createDot(dotGeometry, i*gap, j*gap, 0);
}
}
When utilizing the points material, everything appears as expected - the geometry is visible:
var dotMaterial = new THREE.PointsMaterial( { size: 1, color: 0xffffff, sizeAttenuation: false } );
var dot = new THREE.Points( dotGeometry, dotMaterial );
scene.add( dot );
However, when attempting to use another material for a different visual effect like a "solid" surface, nothing is displayed, such as:
var dotMaterial = new THREE.MeshPhongMaterial( { color: 0xffffff } );
var dot = new THREE.Points( dotGeometry, dotMaterial );
scene.add( dot );
Is geometry only compatible with PointsMaterial, or am I missing something?
Example 1: Functional
// JavaScript code here// CSS code hereExample 2: Non-functional
// JavaScript code here// CSS code hereAny assistance would be greatly appreciated!