StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>After playing around a bit, I've been most successful with using <a href="http://raphaeljs.com/" rel="nofollow noreferrer">Raphaël</a> (which handles cross-browser compatibility) though I suspect anything along those lines would work just fine. Basically I do the following in <strong>JavaScript</strong>:</p> <pre><code>var r = Raphael("someID", WND_WIDTH, WND_HEIGHT); // additional configuration and setup if needed.... </code></pre> <p>Then I would do the following in <strong>GWT</strong>:</p> <pre><code>public native JavaScriptObject getRaphael() /*-{ return $wnd.r; }-*/; // I now have access to the JavaScript object and could do the following: public native void drawCircle(JavaScriptObject obj, int x, int y, int r) /*-{ obj.circle(x, y, r); }-*/; </code></pre> <p>I've also been reading around and it seems that porting Raphaël into GWT (this <a href="http://googlewebtoolkit.blogspot.com/2008/08/getting-to-really-know-gwt-part-2.html" rel="nofollow noreferrer">article</a> is a good read) will not only increase performance (as per some post I read on Google Groups but can't find at the moment - they mentioned the compiler does quite a bit of work) but also facilitate coding & debugging.</p> <p>So I accomplished my goal of being able to manipulate the SVG directly (somewhat until I port Raphaël into Java or at least create wrappers). I have yet to look seriously into the Google Visualization API but I suspect it might work just as well but I'm not sure if it is robust enough for my needs.</p> <p>An important thing I believe I was missing as stated on Raphaël's site was the following:</p> <blockquote> <p>This means every graphical object you create is also a DOM object, so you can attach JavaScript event handlers or modify them later.</p> </blockquote>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload