let gridTopX; let gridTopY; let sideLength; let cubes = []; let land = []; let snow = []; let snowCover = []; let tree = []; const cubesSideLength = 40; let current; function setup() { createCanvas(windowWidth, windowHeight); // noLoop(); //HSBモードでの色指定に変更 colorMode(HSB, 360, 100, 100, 100); //指定後は色指定が //H（色相）:0-360 //S（彩度）:0-100 //B（明度）:0-100 //A（透明度）:0-100 //のパラメータで指定する //frameRate(2); sideLength = floor((height / 2) / cubesSideLength); gridTopX = width / 2; gridTopY = height / 2; //地面 for (let c = 0; c < cubesSideLength; c++) { for (let r = 0; r < cubesSideLength; r++) { var c_h = 37; var c_s = 100; var c_b = int(random(55, 80)); /* if(random()<0.15){ c_h = 0; c_s = 100; c_b = 100; }else if(random()<0.15){ c_h = 0; c_s = 0; c_b = 100; } */ land.push(new Cube(c, r, 0, c_h, c_s, c_b)); } } //雪 for (let index = 0; index < 1; index++) { snow.push(new Cube(int(random(0, cubesSideLength)), int(random(0, cubesSideLength)), cubesSideLength - 1, 0, 0, 100)); } //木 /* let h = 30; let ang = 20 * PI / 180; for (let ch = 0; ch <= h; ch++) { let cz = h - ch; let radius = ch * tan(ang); let cx; let cy; for (let deg = 0; deg < 360; deg += 5) { var c_h = random(60, 150); var c_s = 100; var c_b = random(30,70); let rad = deg * PI / 180; if(!(cx == Math.floor(radius * cos(rad))+15 && cy == Math.floor(radius * sin(rad))+15)) { cx = Math.floor(radius * cos(rad))+15; cy = Math.floor(radius * sin(rad))+15; tree.push(new Cube(cx, cy, cz,c_h,c_s,c_b)); } } } */ // Sort so the cubes are drawn in the right order cubes = land.concat(snow,tree); cubes.sort((a, b) => { return a.getSortString().localeCompare(b.getSortString()); }); background(0, 0, 0); current = 0; //noLoop(); } function draw() { background(0, 0, 0); for (let i = 0; i < snow.length; i++) { const element = snow[i]; element.z = element.z - 2; let land_i = element.c + element.r * cubesSideLength; let l = land[land_i]; if (element.z <= l.cover ) { l.mycolor = lerpColor(l.mycolor, element.mycolor, 0.5); l.count += 0.2; if(l.count > 1) { l.count = 0; l.cover += 1; snowCover.push(new Cube(element.c,element.r, l.cover, hue(l.mycolor), saturation(l.mycolor), brightness(l.mycolor))); } snow.splice(i, 1); if (i > 0) { i--; } } } for (let index = 0; index < 2; index++) { snow.push(new Cube(int(random(0, cubesSideLength)), int(random(0, cubesSideLength)), cubesSideLength - 1, 0, 0, 100)); } cubes = land.concat(snow,tree,snowCover); cubes.sort((a, b) => { return a.getSortString().localeCompare(b.getSortString()); }); for (const cube of cubes) { cube.draw(); } //cubes[current].draw(); // console.log(cubes[current].getSortString()) //current++; // if(current >= cubes.length) { // noLoop(); // } } class Cube { constructor(c, r, z, h, s, b) { this.c = c; this.r = r; this.z = z; this.mycolor = color(h, s, b); this.cover = 0; this.count = 0; } draw() { //iso(c,r,z)からx,y,zへ変換 //https://clintbellanger.net/articles/isometric_math/ const x = gridTopX + (this.c - this.r) * sideLength * sqrt(3) / 2; const y = gridTopY + (this.c + this.r) * sideLength / 2 - sideLength * this.z; //6角形の頂点を計算(60度毎) const points = []; for (let angle = 30; angle <= 330; angle += 60) { points.push( createVector(x + cos(PI / 180 * angle) * sideLength, y + sin(PI / 180 * angle) * sideLength) ) } //放射線 // line(x, y, points[0].x, points[0].y); // line(x, y, points[1].x, points[1].y); // line(x, y, points[2].x, points[2].y); // line(x, y, points[3].x, points[3].y); // line(x, y, points[4].x, points[4].y); // line(x, y, points[5].x, points[5].y); //面 noStroke(); fill(this.mycolor); quad(x, y, points[5].x, points[5].y, points[0].x, points[0].y, points[1].x, points[1].y); fill(hue(this.mycolor), saturation(this.mycolor), brightness(this.mycolor) * 0.75); quad(x, y, points[3].x, points[3].y, points[4].x, points[4].y, points[5].x, points[5].y); fill(hue(this.mycolor), saturation(this.mycolor), brightness(this.mycolor) * 0.5); quad(x, y, points[1].x, points[1].y, points[2].x, points[2].y, points[3].x, points[3].y); } getSortString() { let sr, sc, sz; sz = str(10000 + this.z).padStart(5, '0'); sr = str(10000 + this.r).padStart(5, '0'); sc = str(10000 + this.c).padStart(5, '0'); /* if(this.z < 0){ sz = '0'+str(abs(this.z)).padStart(5,'0'); }else{ sz = '9'+str(this.z).padStart(5,'0'); } if(this.r < 0){ sr = '0'+str(abs(this.r)).padStart(5,'0'); }else{ sr = '9'+str(this.r).padStart(5,'0'); } if(this.c < 0){ sc = '0'+str(abs(this.c)).padStart(5,'0'); }else{ sc = '9'+str(this.c).padStart(5,'0'); }*/ return sz + '.' + sr + '.' + sc; } }

snow cover