Garrett Johnson
@gkjohnson.bsky.social
Woven by Toyota | NASA JPL | #threejs, graphics, open source, and a bunch of fun projects!
Thanks to @mrdoob.com, three-gpu-pathtracer now includes a drag-and-drop viewer for binary glTF files 🚀 I've added a link to the viewer in the repo!
#threejs #webgl #raytracing
#threejs #webgl #raytracing
November 13, 2025 at 2:36 AM
Thanks to @mrdoob.com, three-gpu-pathtracer now includes a drag-and-drop viewer for binary glTF files 🚀 I've added a link to the viewer in the repo!
#threejs #webgl #raytracing
#threejs #webgl #raytracing
Back from some time off programming with a Jump Flood Algorith demo to ease back in!
JFA can be used to create a screen SDF from a model in real time - useful for things like silhouette outlines or any other visual effects. More effects coming up! ✨
#threejs #webgl #gamedev
JFA can be used to create a screen SDF from a model in real time - useful for things like silhouette outlines or any other visual effects. More effects coming up! ✨
#threejs #webgl #gamedev
November 10, 2025 at 5:18 AM
Version 0.9.2 of three-mesh-bvh is out now and brings support for raycasting & distance queries using WebGPU compute shaders!
This is the first step towards WebGPU path tracing & other compute-shader features 🚀✨
#threejs #webgpu #javascript
This is the first step towards WebGPU path tracing & other compute-shader features 🚀✨
#threejs #webgpu #javascript
November 6, 2025 at 3:56 AM
Version 0.9.2 of three-mesh-bvh is out now and brings support for raycasting & distance queries using WebGPU compute shaders!
This is the first step towards WebGPU path tracing & other compute-shader features 🚀✨
#threejs #webgpu #javascript
This is the first step towards WebGPU path tracing & other compute-shader features 🚀✨
#threejs #webgpu #javascript
What are your favorite examples of documentation out there, especially for 3d libraries? What do they do well or not well?
I'm considering updating some of my project docs & am looking for inspiration. Even the little things make a difference.
#threejs #webgl #javascript
I'm considering updating some of my project docs & am looking for inspiration. Even the little things make a difference.
#threejs #webgl #javascript
October 15, 2025 at 4:31 AM
What are your favorite examples of documentation out there, especially for 3d libraries? What do they do well or not well?
I'm considering updating some of my project docs & am looking for inspiration. Even the little things make a difference.
#threejs #webgl #javascript
I'm considering updating some of my project docs & am looking for inspiration. Even the little things make a difference.
#threejs #webgl #javascript
Check out my Github for computational geometry, robotics, path tracing, geospatial rendering, and all kinds of other web graphics projects. Thank you to everyone who's supported my contributions over the years!
github.com/gkjohnson
github.com/gkjohnson
October 1, 2025 at 8:52 AM
Check out my Github for computational geometry, robotics, path tracing, geospatial rendering, and all kinds of other web graphics projects. Thank you to everyone who's supported my contributions over the years!
github.com/gkjohnson
github.com/gkjohnson
Job update: after nearly 8 years of open source I'm excited to go independent to work on consulting & OSS dev. More details to come, but feel free to reach out about collaborations or how you can support my work!
#threejs #javascript #webgl #gis #cad
#threejs #javascript #webgl #gis #cad
October 1, 2025 at 8:52 AM
Job update: after nearly 8 years of open source I'm excited to go independent to work on consulting & OSS dev. More details to come, but feel free to reach out about collaborations or how you can support my work!
#threejs #javascript #webgl #gis #cad
#threejs #javascript #webgl #gis #cad
3d-tiles-renderer & atmospheric rendering spotted in this "Air Fiesta" hot air balloon adventure experience online! Posted by Diego_Dotta on the threejs forums 🪂
Link to the post below 👇
#3dtiles #threejs #webgl #javascript
Link to the post below 👇
#3dtiles #threejs #webgl #javascript
September 23, 2025 at 3:05 AM
3d-tiles-renderer & atmospheric rendering spotted in this "Air Fiesta" hot air balloon adventure experience online! Posted by Diego_Dotta on the threejs forums 🪂
Link to the post below 👇
#3dtiles #threejs #webgl #javascript
Link to the post below 👇
#3dtiles #threejs #webgl #javascript
I was doing some debugging on 3d tiles with a red color ramp & tone mapping enabled and accidentally lit Mars on fire.
July 11, 2025 at 3:15 AM
I was doing some debugging on 3d tiles with a red color ramp & tone mapping enabled and accidentally lit Mars on fire.
3DTilesRenderer now supports multiple tiled image overlays with different projections and per-layer tint & opacity. This video is showing a globe base layer & Washington DC overlay layer from Cesium Ion.
Planar projection coming up next!
#gis #3dtiles #cesiumgrant #threejs
Planar projection coming up next!
#gis #3dtiles #cesiumgrant #threejs
June 23, 2025 at 3:36 AM
3DTilesRenderer now supports multiple tiled image overlays with different projections and per-layer tint & opacity. This video is showing a globe base layer & Washington DC overlay layer from Cesium Ion.
Planar projection coming up next!
#gis #3dtiles #cesiumgrant #threejs
Planar projection coming up next!
#gis #3dtiles #cesiumgrant #threejs
Next up is support for per-overlay UVs to handle different projections & artifacts. Currently images are resampled & projected onto existing UVs which can result in sampling artifacts
Thanks to the people at CesiumJS for some tips on formats and how to handle the overlays!
2 / 2
Thanks to the people at CesiumJS for some tips on formats and how to handle the overlays!
2 / 2
June 10, 2025 at 9:43 AM
Next up is support for per-overlay UVs to handle different projections & artifacts. Currently images are resampled & projected onto existing UVs which can result in sampling artifacts
Thanks to the people at CesiumJS for some tips on formats and how to handle the overlays!
2 / 2
Thanks to the people at CesiumJS for some tips on formats and how to handle the overlays!
2 / 2
3DTilesRendererJS now has initial support for TMS & XYZ tiled overlays on 3d tile sets, bringing more support for CesiumJS's terrain features.
This demo is using the Swiss Alps Quantized Mesh data set w/ @openstreetmap.bsky.social images 🌎🌐
1 / 2 👇
#cesiumgrant #threejs #gis #3dtiles
This demo is using the Swiss Alps Quantized Mesh data set w/ @openstreetmap.bsky.social images 🌎🌐
1 / 2 👇
#cesiumgrant #threejs #gis #3dtiles
June 10, 2025 at 9:43 AM
3DTilesRendererJS now has initial support for TMS & XYZ tiled overlays on 3d tile sets, bringing more support for CesiumJS's terrain features.
This demo is using the Swiss Alps Quantized Mesh data set w/ @openstreetmap.bsky.social images 🌎🌐
1 / 2 👇
#cesiumgrant #threejs #gis #3dtiles
This demo is using the Swiss Alps Quantized Mesh data set w/ @openstreetmap.bsky.social images 🌎🌐
1 / 2 👇
#cesiumgrant #threejs #gis #3dtiles
A before and after shot showing tile gaps being filled in via parent tiles.
June 3, 2025 at 2:08 PM
A before and after shot showing tile gaps being filled in via parent tiles.
Some new updates to QuantizedMesh support for 3d-tiles-renderer. The spec for available tiles is now completely supported and tile gaps are now filled in by clipping the parent tile into quadrants! Texture overlays are next.
1/2 🌎
#threejs #cesium #3dtiles #gis #cesiumgrant
1/2 🌎
#threejs #cesium #3dtiles #gis #cesiumgrant
June 3, 2025 at 2:08 PM
Some new updates to QuantizedMesh support for 3d-tiles-renderer. The spec for available tiles is now completely supported and tile gaps are now filled in by clipping the parent tile into quadrants! Texture overlays are next.
1/2 🌎
#threejs #cesium #3dtiles #gis #cesiumgrant
1/2 🌎
#threejs #cesium #3dtiles #gis #cesiumgrant
I've gotten contour and latitude / longitude lines working with ellipsoidal tile sets in 3D Tiles Renderer - demo link below! 🌎✨
#threejs #webgl #3dtiles #gis #cesiumgrant
#threejs #webgl #3dtiles #gis #cesiumgrant
May 27, 2025 at 3:43 AM
I've gotten contour and latitude / longitude lines working with ellipsoidal tile sets in 3D Tiles Renderer - demo link below! 🌎✨
#threejs #webgl #3dtiles #gis #cesiumgrant
#threejs #webgl #3dtiles #gis #cesiumgrant
Slow but sure updates on the topo line shader: the plugin can also be used to render an infinite grid, as well. The logic for contour lines & grid lines are nearly the same - they're just being scaled differently in this case 🌎📏
#threejs #gis #3dtiles #cesiumgrant #webgl
#threejs #gis #3dtiles #cesiumgrant #webgl
May 23, 2025 at 3:26 AM
Slow but sure updates on the topo line shader: the plugin can also be used to render an infinite grid, as well. The logic for contour lines & grid lines are nearly the same - they're just being scaled differently in this case 🌎📏
#threejs #gis #3dtiles #cesiumgrant #webgl
#threejs #gis #3dtiles #cesiumgrant #webgl
My three-geojson repo now supports internal polygon vertices via constrained delaunay triangulation so extruded shapes can be projected onto an ellipsoid surface with generated smooth normals! 🌎
More below👇
1/3
#threejs #gis #javascript #webgl
More below👇
1/3
#threejs #gis #javascript #webgl
May 19, 2025 at 4:00 AM
My three-geojson repo now supports internal polygon vertices via constrained delaunay triangulation so extruded shapes can be projected onto an ellipsoid surface with generated smooth normals! 🌎
More below👇
1/3
#threejs #gis #javascript #webgl
More below👇
1/3
#threejs #gis #javascript #webgl
I finally got around to writing GeoJSON parser for threejs. It supports triangulating & extruding polygons, and projecting all GeoJSON types onto an ellipsoid for integration with projects like 3d tiles! 🌎
Repo with demo links below 👇
#threejs #gis #3dtiles #webgl #javascript
Repo with demo links below 👇
#threejs #gis #3dtiles #webgl #javascript
May 11, 2025 at 2:30 AM
I finally got around to writing GeoJSON parser for threejs. It supports triangulating & extruding polygons, and projecting all GeoJSON types onto an ellipsoid for integration with projects like 3d tiles! 🌎
Repo with demo links below 👇
#threejs #gis #3dtiles #webgl #javascript
Repo with demo links below 👇
#threejs #gis #3dtiles #webgl #javascript
You can see some errors in the heightmap where new camera data was merged perhaps caused by the rover moving and not having a completely correct understanding of where the previous images were taken.
April 29, 2025 at 3:29 PM
You can see some errors in the heightmap where new camera data was merged perhaps caused by the rover moving and not having a completely correct understanding of where the previous images were taken.
The white terrain is a visual of the heightmap the rover generates from its cameras & uses for autonomous navigation.
Thin lines are 10cm & thick lines are 1m apart to give users a sense for slopes & obstacle heights. Steep inclines that cannot drive over are highlighted in red.
Thin lines are 10cm & thick lines are 1m apart to give users a sense for slopes & obstacle heights. Steep inclines that cannot drive over are highlighted in red.
April 29, 2025 at 3:29 PM
The white terrain is a visual of the heightmap the rover generates from its cameras & uses for autonomous navigation.
Thin lines are 10cm & thick lines are 1m apart to give users a sense for slopes & obstacle heights. Steep inclines that cannot drive over are highlighted in red.
Thin lines are 10cm & thick lines are 1m apart to give users a sense for slopes & obstacle heights. Steep inclines that cannot drive over are highlighted in red.