삼각형 576개1.23 × 1.16 × 1.23 m
코드에서 사용하기
에디터에서 리믹스scifi-crate.js · 241줄
독립형 ES 모듈이에요 — three에만 의존해요. 팩토리 함수를 호출하고 그룹을 씬에 추가하세요.
/**
* Sci-Fi Crate — Codels 3D model library
* License: CC0-1.0 · Units: meters · Y-up · Front: +Z · Origin: center of the base (y = 0)
* Triangles: 576 · Size (W × H × D): 1.23 × 1.16 × 1.23 m
*
* Usage:
* import { createScifiCrate } from './scifi-crate.js';
*
* const model = createScifiCrate();
* model.position.set(0, 0, 0);
* scene.add(model);
*/
import * as THREE from 'three';
const deg = THREE.MathUtils.degToRad;
// Extrude a 2D outline along Z (centered). bevel = [thickness, size, segments].
function extrude(outline, depth, holes = [], bevel = null) {
const shape = new THREE.Shape(outline.map(([x, y]) => new THREE.Vector2(x, y)));
for (const hole of holes) shape.holes.push(new THREE.Path(hole.map(([x, y]) => new THREE.Vector2(x, y))));
const options = bevel
? { depth, bevelEnabled: true, bevelThickness: bevel[0], bevelSize: bevel[1], bevelSegments: bevel[2] }
: { depth, bevelEnabled: false };
return new THREE.ExtrudeGeometry(shape, options).translate(0, 0, -depth / 2);
}
export function createScifiCrate() {
const root = new THREE.Group();
root.name = 'ScifiCrate';
// Materials
const bodyMat = new THREE.MeshStandardMaterial({ name: 'body', color: 0xc6ccd4, roughness: 0.45, metalness: 0.35, flatShading: true });
const panelMat = new THREE.MeshStandardMaterial({ name: 'panel', color: 0x3b414b, roughness: 0.6, metalness: 0.4, flatShading: true });
const glowMat = new THREE.MeshStandardMaterial({ name: 'glow', color: 0x35c6ff, roughness: 0.4, emissive: 0x35c6ff, emissiveIntensity: 1.4, flatShading: true });
// Shared geometries
const boxGeo = new THREE.BoxGeometry(0.62, 0.62, 0.03);
const boxGeo2 = new THREE.BoxGeometry(0.46, 0.05, 0.03);
const boxGeo3 = new THREE.BoxGeometry(0.16, 0.05, 0.03);
const boxGeo4 = new THREE.BoxGeometry(0.06, 0.06, 0.03);
const boxGeo5 = new THREE.BoxGeometry(0.36, 0.05, 0.06);
const boxGeo6 = new THREE.BoxGeometry(0.13, 0.86, 0.05);
const boxGeo7 = new THREE.BoxGeometry(0.24, 0.12, 0.08);
// Parts
const crate = new THREE.Group();
crate.name = 'crate';
crate.scale.setScalar(1.1);
root.add(crate);
const shell = new THREE.Mesh(extrude([[-0.36, -0.46], [0.36, -0.46], [0.46, -0.36], [0.46, 0.36], [0.36, 0.46], [-0.36, 0.46], [-0.46, 0.36], [-0.46, -0.36]], 0.92, [], [0.04, 0.04, 1]), bodyMat);
shell.name = 'shell';
shell.position.set(0, 0.5, 0);
shell.rotation.set(deg(90), 0, 0);
crate.add(shell);
const side1 = new THREE.Group();
side1.name = 'side1';
crate.add(side1);
const panel = new THREE.Mesh(boxGeo, panelMat);
panel.name = 'panel';
panel.position.set(0, 0.5, 0.505);
side1.add(panel);
const lightStrip = new THREE.Mesh(boxGeo2, glowMat);
lightStrip.name = 'lightStrip';
lightStrip.position.set(0, 0.56, 0.52);
side1.add(lightStrip);
const lightStrip2 = new THREE.Mesh(boxGeo2, glowMat);
lightStrip2.name = 'lightStrip2';
lightStrip2.position.set(0, 0.44, 0.52);
side1.add(lightStrip2);
const box7 = new THREE.Mesh(boxGeo3, bodyMat);
box7.position.set(-0.2, 0.3, 0.52);
side1.add(box7);
const box8 = new THREE.Mesh(boxGeo3, bodyMat);
box8.position.set(0.2, 0.3, 0.52);
side1.add(box8);
const indicator = new THREE.Mesh(boxGeo4, glowMat);
indicator.name = 'indicator';
indicator.position.set(0.2, 0.7, 0.52);
side1.add(indicator);
const side2 = new THREE.Group();
side2.name = 'side2';
side2.rotation.set(0, deg(90), 0);
crate.add(side2);
const panel2 = new THREE.Mesh(boxGeo, panelMat);
panel2.name = 'panel';
panel2.position.set(0, 0.5, 0.505);
side2.add(panel2);
const lightStrip3 = new THREE.Mesh(boxGeo2, glowMat);
lightStrip3.name = 'lightStrip';
lightStrip3.position.set(0, 0.56, 0.52);
side2.add(lightStrip3);
const lightStrip22 = new THREE.Mesh(boxGeo2, glowMat);
lightStrip22.name = 'lightStrip2';
lightStrip22.position.set(0, 0.44, 0.52);
side2.add(lightStrip22);
const box14 = new THREE.Mesh(boxGeo3, bodyMat);
box14.position.set(-0.2, 0.3, 0.52);
side2.add(box14);
const box15 = new THREE.Mesh(boxGeo3, bodyMat);
box15.position.set(0.2, 0.3, 0.52);
side2.add(box15);
const indicator2 = new THREE.Mesh(boxGeo4, glowMat);
indicator2.name = 'indicator';
indicator2.position.set(0.2, 0.7, 0.52);
side2.add(indicator2);
const side3 = new THREE.Group();
side3.name = 'side3';
side3.rotation.set(0, deg(180), 0);
crate.add(side3);
const panel3 = new THREE.Mesh(boxGeo, panelMat);
panel3.name = 'panel';
panel3.position.set(0, 0.5, 0.505);
side3.add(panel3);
const lightStrip4 = new THREE.Mesh(boxGeo2, glowMat);
lightStrip4.name = 'lightStrip';
lightStrip4.position.set(0, 0.56, 0.52);
side3.add(lightStrip4);
const lightStrip23 = new THREE.Mesh(boxGeo2, glowMat);
lightStrip23.name = 'lightStrip2';
lightStrip23.position.set(0, 0.44, 0.52);
side3.add(lightStrip23);
const box21 = new THREE.Mesh(boxGeo3, bodyMat);
box21.position.set(-0.2, 0.3, 0.52);
side3.add(box21);
const box22 = new THREE.Mesh(boxGeo3, bodyMat);
box22.position.set(0.2, 0.3, 0.52);
side3.add(box22);
const indicator3 = new THREE.Mesh(boxGeo4, glowMat);
indicator3.name = 'indicator';
indicator3.position.set(0.2, 0.7, 0.52);
side3.add(indicator3);
const side4 = new THREE.Group();
side4.name = 'side4';
side4.rotation.set(0, deg(270), 0);
crate.add(side4);
const panel4 = new THREE.Mesh(boxGeo, panelMat);
panel4.name = 'panel';
panel4.position.set(0, 0.5, 0.505);
side4.add(panel4);
const lightStrip5 = new THREE.Mesh(boxGeo2, glowMat);
lightStrip5.name = 'lightStrip';
lightStrip5.position.set(0, 0.56, 0.52);
side4.add(lightStrip5);
const lightStrip24 = new THREE.Mesh(boxGeo2, glowMat);
lightStrip24.name = 'lightStrip2';
lightStrip24.position.set(0, 0.44, 0.52);
side4.add(lightStrip24);
const box28 = new THREE.Mesh(boxGeo3, bodyMat);
box28.position.set(-0.2, 0.3, 0.52);
side4.add(box28);
const box29 = new THREE.Mesh(boxGeo3, bodyMat);
box29.position.set(0.2, 0.3, 0.52);
side4.add(box29);
const indicator4 = new THREE.Mesh(boxGeo4, glowMat);
indicator4.name = 'indicator';
indicator4.position.set(0.2, 0.7, 0.52);
side4.add(indicator4);
const lidPanel = new THREE.Mesh(new THREE.BoxGeometry(0.62, 0.03, 0.62), panelMat);
lidPanel.name = 'lidPanel';
lidPanel.position.set(0, 1.005, 0);
crate.add(lidPanel);
const emblem = new THREE.Mesh(new THREE.CylinderGeometry(0.15, 0.15, 0.03, 6), glowMat);
emblem.name = 'emblem';
emblem.position.set(0, 1.018, 0);
crate.add(emblem);
const emblemCore = new THREE.Mesh(new THREE.CylinderGeometry(0.09, 0.09, 0.04, 6), panelMat);
emblemCore.name = 'emblemCore';
emblemCore.position.set(0, 1.023, 0);
crate.add(emblemCore);
const handle = new THREE.Mesh(boxGeo5, bodyMat);
handle.name = 'handle';
handle.position.set(0, 1.03, 0.24);
crate.add(handle);
const handle2 = new THREE.Mesh(boxGeo5, bodyMat);
handle2.name = 'handle';
handle2.position.set(0, 1.03, -0.24);
crate.add(handle2);
const bumper1 = new THREE.Mesh(boxGeo6, panelMat);
bumper1.name = 'bumper1';
bumper1.position.set(0.4581, 0.5, 0.4581);
bumper1.rotation.set(0, deg(45), 0);
crate.add(bumper1);
const box37 = new THREE.Mesh(boxGeo7, bodyMat);
box37.position.set(0.4443, 0.06, 0.4443);
box37.rotation.set(0, deg(45), 0);
crate.add(box37);
const box38 = new THREE.Mesh(boxGeo7, bodyMat);
box38.position.set(0.4443, 0.94, 0.4443);
box38.rotation.set(0, deg(45), 0);
crate.add(box38);
const bumper2 = new THREE.Mesh(boxGeo6, panelMat);
bumper2.name = 'bumper2';
bumper2.position.set(0.4581, 0.5, -0.4581);
bumper2.rotation.set(0, deg(135), 0);
crate.add(bumper2);
const box40 = new THREE.Mesh(boxGeo7, bodyMat);
box40.position.set(0.4443, 0.06, -0.4443);
box40.rotation.set(0, deg(135), 0);
crate.add(box40);
const box41 = new THREE.Mesh(boxGeo7, bodyMat);
box41.position.set(0.4443, 0.94, -0.4443);
box41.rotation.set(0, deg(135), 0);
crate.add(box41);
const bumper3 = new THREE.Mesh(boxGeo6, panelMat);
bumper3.name = 'bumper3';
bumper3.position.set(-0.4581, 0.5, -0.4581);
bumper3.rotation.set(0, deg(225), 0);
crate.add(bumper3);
const box43 = new THREE.Mesh(boxGeo7, bodyMat);
box43.position.set(-0.4443, 0.06, -0.4443);
box43.rotation.set(0, deg(225), 0);
crate.add(box43);
const box44 = new THREE.Mesh(boxGeo7, bodyMat);
box44.position.set(-0.4443, 0.94, -0.4443);
box44.rotation.set(0, deg(225), 0);
crate.add(box44);
const bumper4 = new THREE.Mesh(boxGeo6, panelMat);
bumper4.name = 'bumper4';
bumper4.position.set(-0.4581, 0.5, 0.4581);
bumper4.rotation.set(0, deg(315), 0);
crate.add(bumper4);
const box46 = new THREE.Mesh(boxGeo7, bodyMat);
box46.position.set(-0.4443, 0.06, 0.4443);
box46.rotation.set(0, deg(315), 0);
crate.add(box46);
const box47 = new THREE.Mesh(boxGeo7, bodyMat);
box47.position.set(-0.4443, 0.94, 0.4443);
box47.rotation.set(0, deg(315), 0);
crate.add(box47);
root.traverse((o) => {
if (o.isMesh) {
o.castShadow = true;
o.receiveShadow = true;
}
});
return root;
}
export default createScifiCrate;
평점 및 댓글
댓글 0개
아직 댓글이 없어요. 이 모델을 어떻게 사용했는지, 어떤 점이 더 나아질 수 있을지 공유해 주세요.
관련 모델
같은 카테고리 또는 비슷한 태그









