On Thu, 2017-01-19 at 10:18 -0700, Amelia Bellamy-Royds wrote:
This is awesome Jayesh! I know Tavmjong Bah has also been working on a polyfill, so hopefully you two can join forces & figure out how to handle remaining issues.
Yes, I would be interested in collaborating. My javascript skills are rather limited. You can get the latest version of my code at: https://gitlab.com/Tavmjong/mesh.js I don't have time to look at your code tonight but I would be interested in how fast it renders the pepper.svg file. I've been working on speeding up the rendering. So far I've got it down to about 1/3 of the initial time (any help from javascript experts would be appreciated). Next I'm going to implement bicubic smoothing. And then to complete things, meshes on stroke (I think that using a mask can work for this). Tav
Some comments, which I'll also file as Issues in your GitHub repository:
To make the sample files viewable online, you could enable GitHub pages (https://help.github.com/articles/what-is-github-pages/), creating a simple index.html file that links to the samples with and without polyfill.
To keep the generated DOM & styles as close as possible to the original, I would recommend putting the generated <image> inside a <pattern>, and using the <pattern> to paint the shape that should be painted with the <meshGradient>. (In the case of a <mesh>, you would need to generate a <path> and paint it with the <pattern>.) If you reuse the same id value from the meshGradient, then you shouldn't need to worry about parsing CSS on the shapes, you would just look for the actual <meshGradient> objects.
I haven't yet tried to debug the gradient code, but there is a "dead pixel" effect in some of the examples (see attached screenshot). As I said, awesome work! I look forward to being able to use mesh gradients on the web.
Best, Amelia Bellamy-Royds
On 19 January 2017 at 08:20, Jayesh Salvi <jayeshsalvi@...400...> wrote:
Hello, I've implemented Javascript polyfill for SVG files that have mesh gradients in them, so that they can be rendered in browsers successfully. I ported the mesh gradient rendering code from Cairo to javascript in order to do so. The code and instructions on how to use it are available at https:/ /github.com/zectorio/mesh-gradient-js
This code could be run on SVG files created in inkscape and make them renderable in browser. Please take a look. I'm looking forward to your feedback.(There are still some rough edges, as this is still a proof-of-concept thing. But the code works for examples in samples directory) Thanks,-- Jayesh
Check out the vibrant tech community on one of the world's most
engaging tech sites, SlashDot.org! http://sdm.link/slashdot _______________________________________________
Inkscape-devel mailing list
Inkscape-devel@lists.sourceforge.net
Check out the vibrant tech community on one of the world's most engaging tech sites, SlashDot.org! http://sdm.link/slashdot__________ _____________________________________ Inkscape-devel mailing list Inkscape-devel@lists.sourceforge.net https://lists.sourceforge.net/lists/listinfo/inkscape-devel
