On 06/13/2011 10:07 AM, Simon Ratcliffe wrote: > Hey Mike, > > Thanks for your informative assessment of Canvas vs SVG. Indeed it > encapsulates much of the thinking and horse trading > done when we decided on Canvas as a delivery technology for mplh5canvas. > > I particularly agree with you that sending smaller encapsulated > updates is less bandwidth intensive (although not necessarily faster > to re-rasterise the > client display). We have also spent a lot of time tearing our hair out > at the primitive drawing commands, the lack of dashed lines in > particular > is pretty painful. > > For us the plus points for Canvas came down to our perception of > better future browser support, and that most of the browsers seemed to > be putting > a large push into Canvas performance. Coupled with the use of > WebSockets, we felt an all HTML5 solution may be more universally > supported > in the long run. (although who can tell what the browser vendors are > actually thinking :) > > Our initial testing showed that DOM manipulation was a surprising > bottleneck in SVG animations and that, particularly as the SVG object > count increased, > Canvas performance (time to raster) was better. Also the rendering of > the imshow inline png's was a lot quicker than the SVG equivalent in > our initial testing. > Obviously the vector strengths of SVG are highlighted with higher > output DPI, and this is certainly an area of interest. > > This mail is mostly to give others a bit of background about our > choice, I think it could easily have gone either way, and perhaps it > should. > > Most of the client/server code could easily be factored out with a > common API that accepts either an SVG or Canvas drawing object for > display on the client side. > This would give us the best of both worlds (raster and vector) in a > number of situations (i.e. lower DPI / high animation rate using > Canvas, high DPI with lots of interactivity using SVG etc...). > Interactivity would need a tweak on the browser side (much easier to > do with SVG than Canvas). > > As suggested, perhaps Brian Refsdal would be interested in looking at > producing a more generic mplweb backend.
Great! I am interested in developing some of these ideas. I particularly like the idea to keep the transport design independent of the payload. I am also looking to expand on the collaborative element in mplh5canvas, and one of my first thoughts is to move the server code to the cloud. This way all communication can travel over port 80 or 443 for maximum compatibility between networks/ISPs and the instance running matplotlib does not have to serve up pages (latency is a concern, have you found multiple ports to be superior for throughput?). I am also looking to reduce UI request contention with multiple users and develop a session space. Something akin to doodle or imgur where users can anonymously generate unique URLs to share. I have written some prototype code that separates the canvas backend from the web server and websocket server to test for latency issues, but I am open to new ideas. -Brian > > How about an imshow hybrid, with a canvas for the bitmap and SVG axes > and surrounds :) > > Cheers, > > Simon Ratcliffe / Ludwig Schwardt > > SKA South Africa > www.ska.ac.za > >> My (humble) assessment is that HTML 5 Canvas doesn't make much sense for >> any of the use cases I could dream up, and that in fact SVG is a more >> appropriate choice for interactive graphics. The browser support for >> each technology is fairly equivalent at this point, with IE9 finally >> getting on the SVG bandwagon. The main problem with Canvas (from the >> point of view of matplotlib) is that it doesn't support persistence, >> (without building such a layer on top in JavaScript), so if you want to >> update the figure, you have to send the whole thing over the wire each >> time. SVG, on the other hand, maintains a tree of objects that can be >> tweaked at any time (and the performance in the current generation of >> browsers is stunning). One could send all of the large data objects as >> SVG from matplotlib to the browser and using XML ids to maintain >> relationships between the client and the server. Then, do scale the >> data (in many common cases), it is just a matter of updating the affiine >> transform on that object, (as well as updating the ticks etc, but that's >> peanuts), which requires very little bandwidth. I have some hackish >> "proof of concept" code doing this kind of thing, but it's a long way >> from there to something that truly works. >> >> This all glosses over the path simplification stuff that matplotlib does >> -- the assumption here is that the browser would have access to *all* of >> the data, and there are probably practical limits on how big that data >> can be. >> >> I recently did a lot of cleanup to the SVG backend to pave the way for >> having persistent objects etc. -- though there is no client/server code >> at all in master at the moment. All of that is "to be written", perhaps >> by you if you're interested. >> >> Cheers, >> Mike >> >> -- >> Michael Droettboom >> Science Software Branch >> Space Telescope Science Institute >> Baltimore, Maryland, USA >> >> >> ------------------------------------------------------------------------------ >> EditLive Enterprise is the world's most technically advanced content >> authoring tool. Experience the power of Track Changes, Inline Image >> Editing and ensure content is compliant with Accessibility Checking. >> http://p.sf.net/sfu/ephox-dev2dev >> _______________________________________________ >> Matplotlib-devel mailing list >> Matplotlib-devel@lists.sourceforge.net >> https://lists.sourceforge.net/lists/listinfo/matplotlib-devel >> > > ------------------------------------------------------------------------------ > EditLive Enterprise is the world's most technically advanced content > authoring tool. Experience the power of Track Changes, Inline Image > Editing and ensure content is compliant with Accessibility Checking. > http://p.sf.net/sfu/ephox-dev2dev > _______________________________________________ > Matplotlib-devel mailing list > Matplotlib-devel@lists.sourceforge.net > https://lists.sourceforge.net/lists/listinfo/matplotlib-devel > ------------------------------------------------------------------------------ EditLive Enterprise is the world's most technically advanced content authoring tool. Experience the power of Track Changes, Inline Image Editing and ensure content is compliant with Accessibility Checking. http://p.sf.net/sfu/ephox-dev2dev _______________________________________________ Matplotlib-devel mailing list Matplotlib-devel@lists.sourceforge.net https://lists.sourceforge.net/lists/listinfo/matplotlib-devel
