Cool, but note that the rendering is ultra mega slow. Even if you get the "compilation" process to be faster, browsers are really slow when it comes to box-shadow. If you upload an image, then scroll to the bottom and back to the top, Chrome takes like 6s to re-paint the page.
Yeah, probably not very useful for photographies.
I'm thinking about using it for pixel art animations. Since the browser can animate each box-shadow position and color, we can create fancy transitinos. I will upload a proof of concept of that this weekend. :D
At first I was like
http://i.imgur.com/mfp7ts8.gifv
But then I tried an SVG and it actually worked. Currently, to export a C3 generated chart to PNG I have to
- get svgData using XMLSerializer().serializeToString
- create canvas
- fill canvas with svgData processed with canvg.js
- create new image
- set image's src attribute with canvas.toDataURL
- set image's download attribute and simulate a click on it
Perhaps this can prove useful to simplify my workflow.
This is really cool, thanks for posting! Have you tried executing the data processing in a WebWorker? This could be a great example of offloading cpu-intensive work to a WebWorker as well.