Garrett Johnson
@gkjohnson.bsky.social
Woven by Toyota | NASA JPL | #threejs, graphics, open source, and a bunch of fun projects!
Taking a dive into Bezier curves for fast SVG & font rendering. The curves are evaluated in a fragment shader so they're resolution independent with single-pass antialiasing📈
Cubic curves next! Though it looks a bit more complicated...
#threejs #webgl #gamedev #javascript #svg
Cubic curves next! Though it looks a bit more complicated...
#threejs #webgl #gamedev #javascript #svg
November 18, 2025 at 5:48 AM
Taking a dive into Bezier curves for fast SVG & font rendering. The curves are evaluated in a fragment shader so they're resolution independent with single-pass antialiasing📈
Cubic curves next! Though it looks a bit more complicated...
#threejs #webgl #gamedev #javascript #svg
Cubic curves next! Though it looks a bit more complicated...
#threejs #webgl #gamedev #javascript #svg
Reposted by Garrett Johnson
Here's the blooper version I mentioned. (I have no idea who the uploader is or how they got a copy of this. But I am glad that it survives.)
Mars Rover Blooper Reel
YouTube video by theropod
www.youtube.com
November 14, 2025 at 1:57 AM
Here's the blooper version I mentioned. (I have no idea who the uploader is or how they got a copy of this. But I am glad that it survives.)
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
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
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
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
Reposted by Garrett Johnson
I’ve used three-gpu-pathtracer by @gkjohnson.bsky.social to create an online demonstration featuring optical prisms. The result is mindblowing, accurately capturing the multiple reflections and refractions of real-world optical elements.
🔗 Explore it on GitHub:
cyamahat.github.io/three-gpu-pa...
🔗 Explore it on GitHub:
cyamahat.github.io/three-gpu-pa...
May 29, 2025 at 12:51 PM
I’ve used three-gpu-pathtracer by @gkjohnson.bsky.social to create an online demonstration featuring optical prisms. The result is mindblowing, accurately capturing the multiple reflections and refractions of real-world optical elements.
🔗 Explore it on GitHub:
cyamahat.github.io/three-gpu-pa...
🔗 Explore it on GitHub:
cyamahat.github.io/three-gpu-pa...
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
Heres a project I wrote a previous version of the contour shader for from 4 or 5 years go at #NASAJPL. This tool is used for auto drive planning, testing, & inspection and is still used to operate & understand rover drives on Mars.
More info below 👇
#threejs #webgl #javascript
More info below 👇
#threejs #webgl #javascript
April 29, 2025 at 3:29 PM
Heres a project I wrote a previous version of the contour shader for from 4 or 5 years go at #NASAJPL. This tool is used for auto drive planning, testing, & inspection and is still used to operate & understand rover drives on Mars.
More info below 👇
#threejs #webgl #javascript
More info below 👇
#threejs #webgl #javascript
Reposted by Garrett Johnson
How does ROLLBACK NETCODE work, why is it so difficult to program, and why is it the gold standard for fighting games? A whirlwind tour of different solutions #pixelart #gamedev #AnimationVERSUS
The setup: you have a video game with couch co-op and want to add online multiplayer. Easy, right...?
🧵
The setup: you have a video game with couch co-op and want to add online multiplayer. Easy, right...?
🧵
April 21, 2025 at 1:47 PM
How does ROLLBACK NETCODE work, why is it so difficult to program, and why is it the gold standard for fighting games? A whirlwind tour of different solutions #pixelart #gamedev #AnimationVERSUS
The setup: you have a video game with couch co-op and want to add online multiplayer. Easy, right...?
🧵
The setup: you have a video game with couch co-op and want to add online multiplayer. Easy, right...?
🧵