Monday, March 23rd, 2009
dojo.gfx in detail
<p>
Matthew Russell wrote the most in depth article on dojo.gfx that I have seen. It appeared in Linux Journal and has now been re-printed online.
The article runs the gamut. It starts off discussing the place that dojo.gfx lives in the Dojo world:
Then we learn about how gfx abstracts on top of the various underlying graphics subsystems that various browsers expose (Canvas, SVG, VML, Flash, Silverlight, ...). gfx will choose for you automatically, or you can ask to use a particular rendered:
HTML:
-
-
<script type="text/javascript"
-
djConfig="gfxRenderer:'canvas'"
-
src="http://o.aolcdn.com/dojo/1.2/dojo/dojo.xd.js">
-
</script>
-
Then we delve into the drawing API itself:
JAVASCRIPT:
-
-
dojo.addOnLoad(function() {
-
var node = dojo.byId("surface");
-
var surface = dojox.gfx.createSurface(node, 600, 600);
-
-
rect1 = surface.createRect({
-
/* x and y default to (0,0) */
-
width : 200,
-
height:200
-
})
-
.setFill("red")
-
.setTransform([
-
dojox.gfx.matrix.translate(200,200),
-
dojox.gfx.matrix.rotategAt(45,100,100)
-
])
-
;
-
});
-
From here Matthew covers topics such as manipulating groups, and how you can make areas moveable, and the 2D charting API.
Related Content:
4.2 rating from 26 votes
Small correction: the Flash backend is being worked on but not finished yet, the rest (SVG, VML, Canvas, and Silverlight) are fully operational.