I tried out ThinEngine + Smart Filter on JSFiddle.
It seems to work, but I did it by trial and error and forced the dependencies to be resolved, so I don’t think it’s the correct way to do it.
I’d be grateful if you could tell me the correct way to do it.
CC @amoebachant , the master of smart. And filters.
3 Likes
This BEGS for more documentation @amoebachant
1 Like
Hi @cx20, I’m glad you’re trying out Smart Filters! If you want to experiment with them in JSFiddle, you can indeed use an import map, but you don’t need to map each import you want to do. The @babylonjs/smart-filters package is side effect free, so we intend for users of it to just import from the root of the package itself. Of course, in JSFiddle there’s no tree shaking going on, but if you were to build your own project with Smart Filters and use a tool like web pack, it would be able to remove any code you weren’t using. For @babylonjs/core, you should continue to import just what you need so you don’t bring in the whole engine.
Here’s an updated JSFiddle that shows how to reduce the import map down to two lines, and combines all of the Smart Filter imports into a single import: Render 3D scene with Babylon.js engine - JSFiddle - Code Playground
If you want to start integrating Smart Filters into your own project, check out the docs here: Babylon.js docs
If you want to experiment with authoring blocks and building effects with Smart Filters before you write any integration code, check out the Smart Filter Editor and the instructions on adding custom blocks to it: Babylon.js docs
I’ll update the docs to include a JSFiddle example too.
Thanks, and enjoy playing with Smart Filters! I’d love to see what you end up building with them!
4 Likes
The JSFiddle example has become much smarter. Awesome!
It would be great if it were available to try out on the Babylon.js Playground.
Here you go - here’s a PG that uses a Smart Filter to apply an effect to a camera in the scene. Note it also uses the annotated GLSL approach for defining a block, which can be handy for cases where you want to be able to load block definitions at runtime.
Let me know what you think!
2 Likes
