I am always interested to see other people use some of my code in a new way. Therefore, I was pretty happy to see a demo of my RichDraw VML/SVG editor hooked up to some really cool XMPP/Jabber collaboration code.
Here are some neat browser-based drawing applications:
<canvas/>suppport to do the rendering.
Not an exhaustive list, but at least some evidence that drawing in a browser is getting serious.
RichDraw works in IE 6+, Firefox 1.5+ and Opera 9, using VML or SVG as the underlying renderer. Opera 9 has a small issue with the way I adjust/offset the mouse coordinates, but I’ll look into that. Currently the component supports:
I don’t know if there are any real uses for RichDraw in it’s current state. There is a lot that could be done to enhance RichDraw and make it more usable. Probably the most important feature would be loading markup back into the editor. On the surface, that’s easy enough to add. However, there could be situations where the markup is saved from IE (VML) and loaded back into Firefox (SVG). This would not work. I am planning on converting the VML to SVG when retrieving and converting it back when loading. That way RichDraw always appears to be using SVG. I will build from my IESVG code to handle the conversions.
Other enhancements include:
Demo file: richdraw_demo.htm
I made some changes to the IESVG behavior. I am trying to get better feature coverage without making the rendering too slow. I have been testing the code using some SVG images from different places, trying to figure out what parts of SVG seem to be more important than others. Recents chanegs include:
I plan to add more support for gradients. I also plan to add some scripting support. You can do scripting now, but you need to treat the elements as VML, not SVG. I plan to add some methods to the VML elements to make them appear more SVG-like when scripting.
Files can be downloaded from here. I added the SVG lion to the samples:
Update: Fixed 404 on link above.
Inspired by Emil’s emulation of the
canvas tag in IE, I put together a simple SVG emulation behavior for IE. As with Emil’s code, I am making use of Internet Explorer’s VML support. The behavior will walk the SVG element structure and attempt to convert to appropriate VML elements. It’s far from complete, but it does a decent job. Supported features include:
svg namespace. This seems to be a requirement for the behavior to work, but I am trying to remove the need.
The sample files are exactly the same, only the extensions are different. Firefox must have Inline-SVG in an XHTML file. There is probably a way I can get Apache to trick Firefox into thinking the HTML file is an XHTML file (or get IE to think the XHTML file is an HTML file), but I haven’t got it working yet.
Update: Core files have been updated. Test files have gradient examples.