diff options
Diffstat (limited to 'src/Terrain.js')
| -rw-r--r-- | src/Terrain.js | 115 |
1 files changed, 105 insertions, 10 deletions
diff --git a/src/Terrain.js b/src/Terrain.js index c287063..291a4fc 100644 --- a/src/Terrain.js +++ b/src/Terrain.js @@ -2,8 +2,8 @@ import Voronoi from './3rdparty/rhill-voronoi-core.js'; -import { useAverage } from './modules/Util.js'; -import { AABB, QuadTree } from './modules/Geometry.js'; +import { lerp, clamp, useAverage } from './modules/Util.js'; +import { dist, AABB, QuadTree } from './modules/Geometry.js'; /* from here on up, we always assume that points live in the range [(0,0), (1,1)) */ @@ -58,17 +58,29 @@ class Terrain { let seed_points = []; for (let i=0; i<N_SEED_POINTS; i++) seed_points.push(randomPoint()); - for (let i=0; i<N_RELAX_ITERATIONS; i++) + for (let i=0; i<N_RELAX_ITERATIONS; i++) lloydRelax(seed_points, RELAX_DENSITY); const v = new Voronoi(); - this.graph = v.compute(seed_points, {xl: 0, xr: 1, yt: 0, yb: 1}); + this.voronoi = v.compute(seed_points, {xl: 0, xr: 1, yt: 0, yb: 1}); this.tree = new QuadTree(1,1); - for (let v of this.graph.vertices) { - v.hue = 0; + let index = 0; + for (let v of this.voronoi.vertices) { + v.height = v.y; + v.index = index; + index += 1; this.tree.insert(v); } + + this.graph = {}; + for (let e of this.voronoi.edges) { + if (!this.graph[e.va.index]) this.graph[e.va.index] = new Set(); + if (!this.graph[e.vb.index]) this.graph[e.vb.index] = new Set(); + + this.graph[e.va.index].add(e.vb.index); + this.graph[e.vb.index].add(e.va.index); + } } @@ -87,22 +99,105 @@ class Terrain { } + getNeighbors(point) { + const indices = Array.from(this.graph[point.index]); + return indices.map( index => this.voronoi.vertices[index] ); + } + + renderGrid(ct) { ct.save(); ct.lineWidth = 0.001; - for (let edge of this.graph.edges) { - ct.fillStyle = `hsl(${edge.va.hue}, 100%, 50%)`; + for (let edge of this.voronoi.edges) { + ct.fillStyle = `hsl(${edge.va.height}, 100%, 50%)`; ct.beginPath(); - ct.arc(edge.va.x, edge.va.y, 0.005, 0, 2*Math.PI); + ct.arc(edge.va.x, edge.va.y, 0.0005, 0, 2*Math.PI); ct.closePath(); ct.fill(); - ct.beginPath(); + /*ct.beginPath(); ct.moveTo(edge.va.x, edge.va.y); ct.lineTo(edge.vb.x, edge.vb.y); ct.closePath(); ct.stroke(); + */ + } + ct.restore(); + } + + render(ct) { + function rgb(r, g, b) { + this.r = r; this.g = g; this.b = b; + } + const renderRgb = rgb => `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`; + const lerpColors = (a, b, alpha) => new rgb( + lerp(a.r, b.r, alpha), + lerp(a.g, b.g, alpha), + lerp(a.b, b.b, alpha) + ); + const getBucket = (value, min, max, numBuckets) => { + const delta = max - min; + const step = delta/numBuckets; + return clamp(Math.floor((value-min)/step), 0, numBuckets-1); } + const getColor = (value, min, max, colors) => { + if (value < min) return colors[0]; + if (value >= max) return colors[colors.length-1]; + + const step = (max - min)/(colors.length - 1); + + const index = getBucket(value, min, max, colors.length-1); + const alpha = (value - (index*step) - min)/step; + const color = lerpColors( + colors[index], colors[index+1], + alpha + ); + if (color.r <= 0) + console.log(value, index, alpha, color); + return color; + } + + const colors = [ + /* ocean */ + new rgb(31, 59, 68), + new rgb(68, 130, 149), + + /* land */ + new rgb(229, 199, 169), + new rgb(198, 133, 67), + new rgb(117, 89, 61), + + /* mountain */ + new rgb(82, 74, 64), + new rgb(82, 74, 64), + new rgb(255, 255, 255), + ]; + ct.save(); + + for (let cell of this.voronoi.cells) { + ct.beginPath(); + + let height = 0; + let count = 1; + for (let edge of cell.halfedges) { + const p0 = edge.getStartpoint(); + const p1 = edge.getEndpoint(); + height += p0.height; + count += 1; + ct.lineTo(p0.x, p0.y); + ct.lineTo(p1.x, p1.y); + } + ct.closePath(); + height /= count; + height = 10 * Math.floor(height/10); + const color = getColor(height, 0, 100, colors); + if (color.r <=0) console.log(color); + ct.fillStyle = renderRgb(color); + ct.strokeStyle = renderRgb(color); + ct.stroke(); + ct.fill(); + } + ct.restore(); } } |