- Notifications
You must be signed in to change notification settings - Fork2
Wasm lib to quickly process DEM heightmaps, made for three.js 🌎🌍🌏 ⚡
License
Apache-2.0, MIT licenses found
Licenses found
blaze33/dem2mesh
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
npm install dem2meshalternatively:
yarn add dem2meshletdem2meshimport('dem2mesh').then(pkg=>{dem2mesh=pkgdem2mesh.init()}
Currently works with 256x256px PNG images as input.The PNG images come from theterrain tile dataset hosted on Amazon.
cf.Get started with Mapzen Terrain Tiles.
The current s3 url format is:
https://s3.amazonaws.com/elevation-tiles-prod/terrarium/${z}/${x}/${y}.png
Fetch one png tile to work with:
letpngfetch(tileURL).then(res=>res.arrayBuffer()).then(arrayBuffer=>png=newUint8Array(arrayBuffer))
Once initialized thedem2mesh exposes two functions:
dem2mesh.png2elevationdem2mesh.png2mesh
Returns aFloat32Array of size256*256 containing elevation data which can be used to set the positions of aPlaneBufferGeometry geometry.
constheightmap=dem2mesh.png2elevation(png)constgeometry=newPlaneBufferGeometry(size,size,segments+2,segments+2)constnPosition=Math.sqrt(geometry.attributes.position.count)constnHeightmap=Math.sqrt(heightmap.length)constratio=nHeightmap/(nPosition)letx,yfor(leti=nPosition;i<geometry.attributes.position.count-nPosition;i++){if(i%(nPosition)===0||i%(nPosition)===nPosition-1)continuex=Math.floor(i/(nPosition))y=i%(nPosition)geometry.attributes.position.setZ(i,heightmap[Math.round(Math.round(x*ratio)*nHeightmap+y*ratio)]*0.075)}
Returns 3 arrays, position, index and uv wich can be used to create a three.js BufferGeometry.
const[position,index,uv]=dem2mesh.png2mesh(png,size,segments)constgeometry=newBufferGeometry()geometry.setAttribute('position',newBufferAttribute(Float32Array.from(position),3))geometry.setIndex(newBufferAttribute(Uint16Array.from(index),1))geometry.setAttribute('uv',newBufferAttribute(Float32Array.from(uv),2))geometry.computeVertexNormals()
This package was built upon thewasm-pack-template.
📚 Read the template tutorial! 📚
Thewasm-pack-template is designed for compiling Rust libraries into WebAssembly andpublishing the resulting package to NPM.
Be sure to check outotherwasm-pack tutorials online for othertemplates and usages ofwasm-pack.
git clone https://github.com/blaze33/dem2mesh.gitcd dem2meshwasm-pack buildwasm-pack test --headless --firefoxwasm-bindgenfor communicatingbetween WebAssembly and JavaScript.console_error_panic_hookfor logging panic messages to the developer console.wee_alloc, an allocator optimizedfor small code size.
About
Wasm lib to quickly process DEM heightmaps, made for three.js 🌎🌍🌏 ⚡