File size: 2,239 Bytes
abe3137 070f7ee abe3137 070f7ee 579e500 070f7ee abe3137 070f7ee 579e500 070f7ee 579e500 070f7ee 579e500 070f7ee 579e500 070f7ee abe3137 579e500 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Recursive Polygons in 3D with Snowflakes</title>
<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-environment-component/dist/aframe-environment-component.min.js"></script>
<style>
#canvas {
height: 500px;
width: 800px;
}
</style>
</head>
<body>
<a-scene>
<a-entity environment="preset: forest"></a-entity>
<!-- Existing Recursive Polygon Component -->
<!-- ... Your existing entities ... -->
<!-- Snowflakes Components -->
<!-- Clouds will be added dynamically -->
<a-entity camera position="0 1.6 0" look-controls wasd-controls></a-entity>
</a-scene>
<script>
AFRAME.registerComponent('snowflake', {
init: function() {
this.el.setAttribute('geometry', {
primitive: 'sphere',
radius: 0.05
});
this.el.setAttribute('material', { color: '#FFF' });
// Randomly position within a unit cube centered at the origin
this.el.object3D.position.set(
Math.random() - 0.5,
Math.random() - 0.5,
Math.random() - 0.5
);
// Set velocity
this.velocity = new THREE.Vector3(0, -0.05, 0);
},
tick: function() {
this.el.object3D.position.add(this.velocity);
if (this.el.object3D.position.y <= -0.5) {
this.el.parentNode.removeChild(this.el); // Remove snowflake when it falls out of the cloud
}
}
});
function createSnowflakeCloud(x, y, z) {
let cloud = document.createElement('a-entity');
cloud.object3D.position.set(x, y, z);
setInterval(() => {
let snowflakeEl = document.createElement('a-entity');
snowflakeEl.setAttribute('snowflake', '');
cloud.appendChild(snowflakeEl);
}, 100);
document.querySelector('a-scene').appendChild(cloud);
}
// Create a grid of 9 snowflake clouds
for (let x = -10; x <= 10; x += 10) {
for (let z = -10; z <= 10; z += 10) {
createSnowflakeCloud(x, 5, z);
}
}
// Create a larger central cloud
createSnowflakeCloud(0, 8, 0);
</script>
</body>
</html>
|