Hi.
I faintly remember someone mentioned Gantt diagrams/charts here so here it is: http://www.mediawiki.org/wiki/Extension:JSWikiGantt I must warn you that if you want to look at the code, please close your eyes when you look at jsgantt.js ;-). This must have been a fun project some years ago (there are some really interesting concepts there), but is rather hard in modifying e.g. to allow more then one diagram per page. I'll probably rewrite this someday. I was thinking about either rendering this to SVG or on canvas rather then plain HTML. Any thoughts on that?
We use this extension at work to plan/visualize small development sprints by exporting tasks from Flyspray to Gantt XML. This is a bit specific as Flyspray doesn't really have time interval field but I could probably share this code if anyone wanted.
And here is an extension that uses Gantt for something a bit different: http://www.mediawiki.org/wiki/Extension:JobSchEd
We use this to build something that on might call an out of office schedule.
Technically this extension is actually just a JavaScript that gets build dynamically from JS modules by PHP and included in the header. Could probably be used more generally, but as RL is now in 1.17 then this is probably a bit less useful then it was.
Cheers, Nux.
On Sat, Jun 11, 2011 at 3:34 AM, Maciej Jaros egil@wp.pl wrote:
http://www.mediawiki.org/wiki/Extension:JSWikiGantt I must warn you that if you want to look at the code, please close your eyes when you look at jsgantt.js ;-). This must have been a fun project some years ago (there are some really interesting concepts there), but is rather hard in modifying e.g. to allow more then one diagram per page. I'll probably rewrite this someday. I was thinking about either rendering this to SVG or on canvas rather then plain HTML. Any thoughts on that?
I'd probably recommend using SVG as an output format here; in theory the existing support in MediaWiki for rasterizing SVG to PNG could be reused if desired to provide compatibility with older browsers, but more generally SVG lets you have a 'fixed' output format that's device-independent (think of zooming, high-resolution displays, and print output).
Also if you add interactivity or clickable components later, that's easier to do in SVG than canvas (where you'd have to manually handle all events, detection of what's being clicked on, etc -- same issues go there with PNG rasterization of SVG, as you'd need to produce an image map or something)
-- brion
On 11-06-11 02:04 PM, Brion Vibber wrote:
On Sat, Jun 11, 2011 at 3:34 AM, Maciej Jaros egil@wp.pl wrote:
http://www.mediawiki.org/wiki/Extension:JSWikiGantt I must warn you that if you want to look at the code, please close your eyes when you look at jsgantt.js ;-). This must have been a fun project some years ago (there are some really interesting concepts there), but is rather hard in modifying e.g. to allow more then one diagram per page. I'll probably rewrite this someday. I was thinking about either rendering this to SVG or on canvas rather then plain HTML. Any thoughts on that?
I'd probably recommend using SVG as an output format here; in theory the existing support in MediaWiki for rasterizing SVG to PNG could be reused if desired to provide compatibility with older browsers, but more generally SVG lets you have a 'fixed' output format that's device-independent (think of zooming, high-resolution displays, and print output).
Also if you add interactivity or clickable components later, that's easier to do in SVG than canvas (where you'd have to manually handle all events, detection of what's being clicked on, etc -- same issues go there with PNG rasterization of SVG, as you'd need to produce an image map or something)
-- brion
There's also the technique Raphael JS uses.
On Sat, Jun 11, 2011 at 2:16 PM, Daniel Friesen lists@nadir-seen-fire.comwrote:
There's also the technique Raphael JS uses.
I'm quite fond of Raphael for interactive graphics -- it provides a nice little JS API that maps things to native elements in either SVG or VML (for older versions of IE which lack SVG). The downside for more static things is that you won't necessarily get your graphics included in search engines or other spidered destinations, and it's probably harder to adapt them to other kinds of data export. (For instance to do a PDF export you'd either need to be able to execute the JavaScript to produce SVG, then capture the SVG, or add a second renderer in your export tool that produces suitable output.)
Of course if you're only ever going to use it in-browser for private sites, no worries. :D
-- brion
Brion Vibber (2011-06-11 23:23):
On Sat, Jun 11, 2011 at 2:16 PM, Daniel Friesen lists@nadir-seen-fire.comwrote:
There's also the technique Raphael JS uses.
I'm quite fond of Raphael for interactive graphics -- it provides a nice little JS API that maps things to native elements in either SVG or VML (for older versions of IE which lack SVG). The downside for more static things is that you won't necessarily get your graphics included in search engines or other spidered destinations, and it's probably harder to adapt them to other kinds of data export. (For instance to do a PDF export you'd either need to be able to execute the JavaScript to produce SVG, then capture the SVG, or add a second renderer in your export tool that produces suitable output.)
Of course if you're only ever going to use it in-browser for private sites, no worries. :D
Yes, I'm not very worried about search engines and probably most of the user won't worry about that too. I might render some fall-back table with tasks for the sake of it, though.
Raphael JS seems a nice thing to get started, so I'll probably use it and create some kind of an SVG overlay and maybe move to pure HTML at some later point.
Thanks, Nux.
wikitech-l@lists.wikimedia.org