import * as THREE from "three";
export class cloud{
constructor(x, y, z, scene, look, id){
for (let i = 0; i < 1; i++) {
let cloudGeo = new THREE.PlaneGeometry(Math.random() * 400 + 500,
Math.random() * 200 + 300);
let cloudTexture = new THREE.TextureLoader().load("/hugeCloud.png");
let cloudMaterial = new THREE.MeshBasicMaterial({
color: 0x0084ff,
map: cloudTexture,
transparent: true,
opacity: Math.random() * 0.2
});
this.cloudMesh = new THREE.Mesh(cloudGeo, cloudMaterial);
this.cloudMesh.position.set(
// x,y,z
(Math.random()-0.5) * 200 + x,
(Math.random()-0.5) * 100 + y,
(Math.random()-0.5) * 200 + z
);
this.cloudMesh.up.set(0, 1, 0);
this.frameCount = 0;
scene.add(this.cloudMesh);
}
//display information
this.id = id;
}
update() {
this.frameCount++;
this.cloudMesh.lookAt(look);
}
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter