zdog
zdog copied to clipboard
metafizzy
Gradients & Textures in the Renderer
I've had a look through both renderer implementations and the interface seems to only handle stroke and fill so far. Are there any plans to implement more intricate fills, like gradients and textures (https://codepen.io/allenchum/pen/yqVvEa)?
This could be useful for a number of things, like character creation (skin tones, clothes, ...) and 2.5 tricks (e.g. faking ambient occlusion).
A good interface would be something along the lines of SVG.js' DrawGradient: https://svgjs.com/docs/2.7/elements/#gradient-constructor
Add a 👍 reaction to this issue if you would like to see this feature added. Do not add +1 comments — They will be deleted.
Thanks for this feature request. No, no current plans for gradient or texture fills. The implementation differs significantly between canvas and SVG, so this would be a substantial feature. Zdog uses flat colors by design as its easy to support for me and easy to developers to use. Once you add in gradients, the next ask is for lighting and shadows. At which point you're better off using Three.js. I'm not completely against gradients and texture fills, but I do feel its not a good fit for how I see the project.
@desandro That's not the intended direction of my request. You seem to understand my request for "textures" as textures in the 3D engine sense. I mean literal textures, patterns (whatever) applied to the actual 2D shape. Adding grunge, a gradient etc. to character elements to make it visually more interesting, not to make it more "3D" (because we already have that for canvas: http://www.kevs3d.co.uk/dev/phoria/).
@turbo If you use SVG, you can already set the color attribute to url("#gradientID"). https://codepen.io/anon/pen/RzJGJx
@shm-sl its a cool demo, but the gradient is 2d and completely flat. What if we want a gradient that is relative to the camera position or one that is radial/ emphasizing whatever shape it renders in. I guess the real question is how do we do pseudo3d materials :p
