388 треуг.4,05 × 0,21 × 1,19 m
Использовать в коде
Ремикс в редактореstepping-stones.js · 125 строк
Самодостаточный ES-модуль — зависит только от three. Вызовите фабрику и добавьте группу в сцену.
/**
* Stepping Stones — Codels 3D model library
* License: CC0-1.0 · Units: meters · Y-up · Front: +Z · Origin: center of the base (y = 0)
* Triangles: 388 · Size (W × H × D): 4.05 × 0.20 × 1.19 m
*
* Usage:
* import { createSteppingStones } from './stepping-stones.js';
*
* const model = createSteppingStones();
* model.position.set(0, 0, 0);
* scene.add(model);
*/
import * as THREE from 'three';
const deg = THREE.MathUtils.degToRad;
// Deterministic vertex displacement (organic low-poly look).
function jitter(geometry, amount, seed) {
const pos = geometry.attributes.position;
const h = (a, b, c, s) => {
let x = Math.imul(a, 73856093) ^ Math.imul(b, 19349663) ^ Math.imul(c, 83492791) ^ Math.imul(s, 2654435761);
x = Math.imul(x ^ (x >>> 16), 2246822507);
x = Math.imul(x ^ (x >>> 13), 3266489909);
return ((x ^ (x >>> 16)) >>> 0) / 4294967295 - 0.5;
};
for (let i = 0; i < pos.count; i++) {
const x = pos.getX(i), y = pos.getY(i), z = pos.getZ(i);
const qx = Math.round(x * 1000), qy = Math.round(y * 1000), qz = Math.round(z * 1000);
pos.setXYZ(i, x + h(qx, qy, qz, seed) * 2 * amount, y + h(qx, qy, qz, seed + 1) * 2 * amount, z + h(qx, qy, qz, seed + 2) * 2 * amount);
}
pos.needsUpdate = true;
geometry.computeVertexNormals();
return geometry;
}
export function createSteppingStones() {
const root = new THREE.Group();
root.name = 'SteppingStones';
// Materials
const stoneMat = new THREE.MeshStandardMaterial({ name: 'stone', color: 0x7c7a75, roughness: 0.9, flatShading: true });
const stoneLightMat = new THREE.MeshStandardMaterial({ name: 'stoneLight', color: 0x918d84, roughness: 0.9, flatShading: true });
const stoneDarkMat = new THREE.MeshStandardMaterial({ name: 'stoneDark', color: 0x5f5d5a, roughness: 0.95, flatShading: true });
const stoneWarmMat = new THREE.MeshStandardMaterial({ name: 'stoneWarm', color: 0x8a7f70, roughness: 0.9, flatShading: true });
const mossMat = new THREE.MeshStandardMaterial({ name: 'moss', color: 0x5f8a3a, roughness: 1, flatShading: true });
// Parts
const stone1 = new THREE.Mesh(jitter(new THREE.CylinderGeometry(0.2369, 0.2754, 0.1251, 9), 0.022, 148), stoneMat);
stone1.name = 'stone1';
stone1.position.set(-1.7978, 0.083, 0.2133);
stone1.rotation.set(deg(-2.2227), deg(209.1714), deg(-2.878));
stone1.scale.set(1, 1, 0.8191);
root.add(stone1);
const stone2 = new THREE.Mesh(jitter(new THREE.CylinderGeometry(0.2626, 0.3053, 0.1311, 9), 0.0244, 149), stoneLightMat);
stone2.name = 'stone2';
stone2.position.set(-1.085, 0.0897, -0.0371);
stone2.rotation.set(deg(-0.7306), deg(337.4981), deg(1.1678));
stone2.scale.set(1, 1, 0.7713);
root.add(stone2);
const stone3 = new THREE.Mesh(jitter(new THREE.CylinderGeometry(0.2246, 0.2612, 0.1222, 9), 0.0209, 150), stoneWarmMat);
stone3.name = 'stone3';
stone3.position.set(-0.3839, 0.0862, -0.3395);
stone3.rotation.set(deg(2.7662), deg(304.9793), deg(2.2017));
stone3.scale.set(1, 1, 0.7565);
root.add(stone3);
const stone4 = new THREE.Mesh(jitter(new THREE.CylinderGeometry(0.2377, 0.2764, 0.1253, 9), 0.0221, 151), stoneDarkMat);
stone4.name = 'stone4';
stone4.position.set(0.3666, 0.0944, -0.194);
stone4.rotation.set(deg(0.1322), deg(12.8275), deg(2.6018));
stone4.scale.set(1, 1, 0.7921);
root.add(stone4);
const moss4 = new THREE.Mesh(jitter(new THREE.CylinderGeometry(0.1161, 0.152, 0.05, 7), 0.0138, 215), mossMat);
moss4.name = 'moss4';
moss4.position.set(0.4027, 0.169, -0.2048);
moss4.rotation.set(0, deg(70.1365), 0);
moss4.scale.set(1, 1, 0.7921);
root.add(moss4);
const stone5 = new THREE.Mesh(jitter(new THREE.CylinderGeometry(0.2292, 0.2665, 0.1233, 9), 0.0213, 152), stoneMat);
stone5.name = 'stone5';
stone5.position.set(1.1253, 0.0829, -0.1465);
stone5.rotation.set(deg(-1.2977), deg(208.3471), deg(-1.5137));
stone5.scale.set(1, 1, 0.6811);
root.add(stone5);
const stone6 = new THREE.Mesh(jitter(new THREE.CylinderGeometry(0.2884, 0.3353, 0.1371, 9), 0.0268, 153), stoneLightMat);
stone6.name = 'stone6';
stone6.position.set(1.7492, 0.0899, 0.2859);
stone6.rotation.set(deg(-2.4748), deg(81.9641), deg(1.2852));
stone6.scale.set(1, 1, 0.7548);
root.add(stone6);
const pebble1 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.0312, 0), 0.0047, 284), stoneLightMat);
pebble1.name = 'pebble1';
pebble1.position.set(-0.7496, 0.0188, -0.3989);
pebble1.rotation.set(deg(16.8458), deg(270.8821), 0);
pebble1.scale.set(1, 0.6, 1);
root.add(pebble1);
const pebble2 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.0506, 0), 0.0076, 285), stoneDarkMat);
pebble2.name = 'pebble2';
pebble2.position.set(-1.3619, 0.0446, 0.3126);
pebble2.rotation.set(deg(79.4155), deg(192.6446), 0);
pebble2.scale.set(1, 0.6, 1);
root.add(pebble2);
const pebble3 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.0495, 0), 0.0074, 286), stoneLightMat);
pebble3.name = 'pebble3';
pebble3.position.set(-1.56, 0.0369, -0.1732);
pebble3.rotation.set(deg(43.9424), deg(332.7176), 0);
pebble3.scale.set(1, 0.6, 1);
root.add(pebble3);
const pebble4 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.0407, 0), 0.0061, 287), stoneDarkMat);
pebble4.name = 'pebble4';
pebble4.position.set(-1.5816, 0.0239, -0.061);
pebble4.rotation.set(deg(28.5911), deg(272.8903), 0);
pebble4.scale.set(1, 0.6, 1);
root.add(pebble4);
root.traverse((o) => {
if (o.isMesh) {
o.castShadow = true;
o.receiveShadow = true;
}
});
return root;
}
export default createSteppingStones;
Оценки и комментарии
0 комментариев
Комментариев пока нет. Расскажите, как вы использовали эту модель или что можно улучшить.
Похожие модели
Та же категория или похожие теги









