Add a border around the star.
This commit is contained in:
63
src/open.js
63
src/open.js
@@ -16,10 +16,73 @@ function addStar() {
|
||||
let material = new THREE.MeshStandardMaterial({
|
||||
side: THREE.DoubleSide,
|
||||
color: 0x00ff00,
|
||||
flatShading: true,
|
||||
});
|
||||
|
||||
let star = new THREE.Mesh(geometry, material);
|
||||
star.receiveShadow = true;
|
||||
group.add(star);
|
||||
|
||||
let ringGeometry = generateStarRing(2, 3, 0.4);
|
||||
let ring = new THREE.Mesh(ringGeometry, material);
|
||||
group.add(ring);
|
||||
}
|
||||
|
||||
/**
|
||||
* Concatenate a series of Float32 arrays.
|
||||
*
|
||||
* @returns {Float32Array}
|
||||
*/
|
||||
function concatFloat32Array() {
|
||||
let length = 0;
|
||||
for (let cur of arguments) {
|
||||
length += cur.length;
|
||||
}
|
||||
|
||||
const buf = new Float32Array(length);
|
||||
let offset = 0;
|
||||
for (let cur of arguments) {
|
||||
buf.set(cur, offset);
|
||||
offset += cur.length;
|
||||
}
|
||||
|
||||
return buf;
|
||||
}
|
||||
|
||||
function generateStarRing(innerRadius, outerRadius, size) {
|
||||
let vertexCandidates = [
|
||||
starCoordinates(innerRadius + 0.5 * size, outerRadius + 0.5 * size, -0.5 * size),
|
||||
starCoordinates(innerRadius + 0.5 * size, outerRadius + 0.5 * size, 0.5 * size),
|
||||
starCoordinates(innerRadius - 0.5 * size, outerRadius - 0.5 * size, 0.5 * size),
|
||||
starCoordinates(innerRadius - 0.5 * size, outerRadius - 0.5 * size, -0.5 * size),
|
||||
];
|
||||
let vertices = concatFloat32Array(
|
||||
vertexCandidates[0],
|
||||
vertexCandidates[1],
|
||||
vertexCandidates[2],
|
||||
vertexCandidates[3],
|
||||
vertexCandidates[1],
|
||||
vertexCandidates[2],
|
||||
vertexCandidates[0],
|
||||
vertexCandidates[3],
|
||||
);
|
||||
console.log(vertices);
|
||||
|
||||
const faces = new Array(2 * STAR_POINTS * 3 * 4);
|
||||
for (let i = 0; i < 4; ++i) {
|
||||
const offset = 2 * 2 * STAR_POINTS * i;
|
||||
for (let j = 0; j < 2 * STAR_POINTS; ++j) {
|
||||
const nextRow = (j + 1) % (2 * STAR_POINTS);
|
||||
faces.push(offset + j, offset + j + 2 * STAR_POINTS, offset + nextRow);
|
||||
faces.push(offset + j + 2 * STAR_POINTS, offset + nextRow, offset + nextRow + 2 * STAR_POINTS);
|
||||
}
|
||||
}
|
||||
|
||||
let geometry = new THREE.BufferGeometry();
|
||||
geometry.addAttribute('position', new THREE.BufferAttribute(vertices, 3));
|
||||
geometry.setIndex(faces);
|
||||
|
||||
return geometry;
|
||||
}
|
||||
|
||||
function startOpenAnimation() {
|
||||
|
||||
Reference in New Issue
Block a user