Dojo Goodness, Part 9 (gfx foo with fx)

Matthew Russel post the next article from his series about Dojo JavaScript library. Here's small excerpt from this article with one example:

«In preparation for my OSCON talk, I’ve been unearthing some of the fx enhancements that were added to Dojo’s gfx module back when version 1.1 landed. Some of these enhancements are pretty neat, and I thought they might make for a good excuse to get you started with a part of the toolkit you may not have ventured into quite yet.

Let’s get right to it with a document that demonstrates the fundamentals of how to create a gfx drawing context and place a shape somewhere on it:

<html>

<head>

<title>Fun with gfx!</title>

<script

type="text/javascript"

src="http://o.aolcdn.com/dojo/1.1/dojo/dojo.xd.js"

djConfig="isDebug:true">

</script>

<!--

Workaround necessary for loading gfx over the CDN until 1.2

lands. See http://trac.dojotoolkit.org/ticket/4462

-->

<script

type="text/javascript"

src="http://o.aolcdn.com/dojo/1.1/dojox/gfx.js">

</script>

<script type="text/javascript">

dojo.require("dojox.gfx"); //maintain good form

dojo.addOnLoad(function() {

//create a 200x200 drawing surface

var g = dojox.gfx.createSurface(dojo.byId("g"), 200, 200);

//draw a circle on it at (100,100) with a radius of 10

var circle = g.createCircle({cx : 100, cy : 100, r : 10})

.setFill("blue");

});

</script>

</head>

<body>

<div id="g"></div>

</body>

</html>»

Source: Onlamp.

Comments

You can use simple HTML-formatting tags(like <b>, <ul>, <code> and others)