toxi, to typescript
@toxi@mastodon.thi.ng avatar

Example #167, and the very first example showing basic usage of the new https://thi.ng/geom-webgl interop package (still unreleased): Parsing a SVG path, sampling it with uniform vertex density (configurable), converting it into a complex polygon (w/ holes) and then into WebGL buffers (w/ vertex color option enabled), randomizing colors via probabilistic color theme, and — finally — drawing it all...

Demo (reload for new variation):
https://demo.thi.ng/umbrella/geom-webgl-basics/

Source code:
https://github.com/thi-ng/umbrella/blob/develop/examples/geom-webgl-basics/src/index.ts

#ThingUmbrella #WebGL #SVG #Geometry #Tessellation #Triangulation #DebugArt #TypeScript #Typography #Polygon
#ThingUmbrella

toxi, to opensource
@toxi@mastodon.thi.ng avatar

Since I've just been asked again why some of the https://thi.ng/umbrella examples in the repo are not working when copy/pasting the source code into a new (external, I assume) project — there could be several reasons...

  1. The default branch of the repo is develop and usually does contain code which hasn't been released yet (as library/package). If in doubt, please switch to the main branch which contains the state as of the most recent release cycle...

  2. Related to #1, there could be breaking API changes on the develop branch (as is the case for the current major undertaking of thi.ng/geom v8.0.0) and some of the examples are already using the new/upcoming API...

  3. Rare, but possible, I've forgotten to declare dependencies for an example and you might encounter broken imports. Since 2022 I've got a custom tool to verify imports and exports of all packages and examples (and which is run prior to each release), so this shouldn't happen anymore...

  4. Personally, I'm only using a bundler setup/workflow (@vite) and had zero problems in the past few years. However, some people using ESM imports directly have been encountering weird issues with some transpilation features of JS CDNs (e.g. skypack) in the past, but these shouldn't happen with more modern ones like https://esm.run.

Finally, all packages have a generally uniform readme structure, incl. "install/import instructions". For examples, there're also these wiki pages:

General:
https://github.com/thi-ng/umbrella/wiki/Example-build-instructions

For examples added since late 2023:
https://github.com/thi-ng/umbrella/wiki/Development-mode-for-examples-using-thi.ng-meta%E2%80%90css

#ThingUmbrella #Documentation #Examples #OpenSource #TypeScript #JavaScript #ESM

toxi, to zig
@toxi@mastodon.thi.ng avatar

Congrats to @andrewrk & team to the new Zig v0.13.0 release! So exciting! 🚀🤩

Thankfully there were only very minor changes to be done on my end this time around, and I've just updated the build file & readme for https://thi.ng/wasm-api to be compatible with this new Zig version (the older build files are still kept around for those who might need it...). Also tested all the bundled examples, all working fine!

#ThingUmbrella #Zig #Ziglang #WASM #TypeScript #OpenSource

kubikpixel, (edited ) to webdev
@kubikpixel@chaos.social avatar

A other web tool with the name @lume but a 3D web design from @trusktr.

Do any of you use this and what is your experience with it? It is probably based on three.js and I hope it makes it "easier" to implement.

🧊 https://lume.io


toxi, to typescript
@toxi@mastodon.thi.ng avatar

Testing/debugging the dynamic tessellation feature of the upcoming thi.ng/geom-webgl interop package... This will provide a single polymorphic function to convert https://thi.ng/geom shapes into WebGL binary data & model/attribute specs, with lots of options for memory layout, indexing, instancing and other advanced usage...

By default (and as shown here), polygons are tessellated via ear cutting[1], but users have a choice of 9 other algorithm presets (or their own custom ones), incl. iterative application of multiple tessellation strategies..

[1] https://en.wikipedia.org/wiki/Polygon_triangulation

A random, blobby, triangulated polygon, with each triangle tinted in a random colorful gradient
A random, blobby, triangulated polygon, with each triangle tinted in a random colorful gradient
A random, blobby, triangulated polygon, with each triangle tinted in a random colorful gradient

32bitkid, to retrogaming
@32bitkid@mstdn.social avatar

Other people have also done this in photoshop, but i don't know of anybody who has done it quite like this, so imma show this off: Ultra-widescreen EGA composition in SCI0 compatible commands. The canvas is 665 x 190, with a small stitched area to help transition the two screens… no post-processing trickery. I interleaved the left and right side drawing screens with the appropriate matrix transformations, and... behold... ultra-wide EGA.

#RetroGaming #SierraOnLine #SpaceQuest #TypeScript

video/mp4

  • All
  • Subscribed
  • Moderated
  • Favorites
  • JUstTest
  • ngwrru68w68
  • everett
  • InstantRegret
  • magazineikmin
  • thenastyranch
  • rosin
  • GTA5RPClips
  • Durango
  • Youngstown
  • slotface
  • khanakhh
  • kavyap
  • DreamBathrooms
  • provamag3
  • tacticalgear
  • osvaldo12
  • tester
  • cubers
  • cisconetworking
  • mdbf
  • ethstaker
  • modclub
  • Leos
  • anitta
  • normalnudes
  • megavids
  • lostlight
  • All magazines