KineticJS icon indicating copy to clipboard operation
KineticJS copied to clipboard

Native canvas SVG support + KineticJS

Open ericdrowell opened this issue 12 years ago • 3 comments

Apparently, it's possible to directly render SVG elements in canvas with the drawImage method. If this is correct, we should hook into the drawImage method for the supported browsers for performance reasons.

StackOverflow discussion: http://stackoverflow.com/questions/17581415/does-kineticjs-have-library-support-for-svg

ericdrowell avatar Aug 22 '13 16:08 ericdrowell

Wonder what the range of browser support is...

SVG is neat because you can use it as the src of an img right in your HTML, so it doesn't surprise me that there are browsers that can render SVG onto a canvas (using context.drawImage), treating it as just another image format.

Kinetic's Path shape isn't intended to replace SVG, or even render SVG. I created it just for reusing the terse Path syntax since Canvas didn't have an equivalent yet (the latest WhatWG spec shows a lot of SVG being brought into Canvas, including native Path support).

Before Kinetic.Path, my alternative was a custom Shape with Canvas API commands to perform each operation that was represented within the SVG Path data (moveTo, lineTo, etc).

jfollas avatar Aug 22 '13 16:08 jfollas

precisely. I ust wonder if we can hook into the native support for performance reasons. I haven't had a chance to look into this one.

ericdrowell avatar Aug 23 '13 04:08 ericdrowell

This would be great

confile avatar May 19 '14 22:05 confile