02-23-2026, 08:15 PM
For some time I've been looking at different ways to leverage the WebGL capabilities of the browser in QBJS. There have been a number of requests to implement _MapTriangle and provide access to GL shaders, etc. Well, while searching for some lower-level JS libraries that might make interacting with WebGL a bit nicer, I ran across three.js, which is a high-level 3D library with a lot of capabilities and a pretty accessible API. I've been pretty impressed with it so far.
So, I've started a new project (three.qbjs) to create a wrapper API that can be used to access this library from QBJS. Here's an obligatory rotating cube example:
View Source in New Tab
At this point, I've only implemented a small percentage of the three.js API, but it's been pretty interesting to see what is possible. It is actually pretty straightforward to incorporate other QBJS content into a 3D scene. Here's an example where we can use one of @bplus' plasma proggies as an animated texture that can be applied to a 3D surface:
Open in New Tab
You can take that idea even further and play your QBJS game on a virtual NES:
View Controls:
- Orbit: Left mouse / touch: one-finger move.
- Zoom: Middle mouse, or mousewheel / touch: two-finger spread or squish.
- Pan: Right mouse, or left mouse + ctrl/meta/shiftKey / touch: two-finger move.
Game Controls:
- As shown on screen
Open in New Tab
And here's a 3D Chess game that uses the same view controls as above (and the same chess engine API as the text-based UI one I posted recently).
Open in New Tab
For additional of examples of what might be possible there is a listing of sample programs on the three.js website:
https://threejs.org/examples/
And a couple of apps built with three.js:
FPS Shooter: https://krunker.io/
Driving Sim: https://slowroads.io/
Anyway, more to come, but I wanted to share what I have so far.
So, I've started a new project (three.qbjs) to create a wrapper API that can be used to access this library from QBJS. Here's an obligatory rotating cube example:
View Source in New Tab
At this point, I've only implemented a small percentage of the three.js API, but it's been pretty interesting to see what is possible. It is actually pretty straightforward to incorporate other QBJS content into a 3D scene. Here's an example where we can use one of @bplus' plasma proggies as an animated texture that can be applied to a 3D surface:
Open in New Tab
You can take that idea even further and play your QBJS game on a virtual NES:
View Controls:
- Orbit: Left mouse / touch: one-finger move.
- Zoom: Middle mouse, or mousewheel / touch: two-finger spread or squish.
- Pan: Right mouse, or left mouse + ctrl/meta/shiftKey / touch: two-finger move.
Game Controls:
- As shown on screen
Open in New Tab
And here's a 3D Chess game that uses the same view controls as above (and the same chess engine API as the text-based UI one I posted recently).
Open in New Tab
For additional of examples of what might be possible there is a listing of sample programs on the three.js website:
https://threejs.org/examples/
And a couple of apps built with three.js:
FPS Shooter: https://krunker.io/
Driving Sim: https://slowroads.io/
Anyway, more to come, but I wanted to share what I have so far.