结合 GFX，DnD 与 Dijit 创建基于 Dojo 的 Web 图形类应用

核心提示： 清单 2. 对 GFX 图形对象进行变形操作//5.创建group，并在其中创建一个绿色圆形vargroup=surface.createGroup();varcircle={cx:250,cy:250,r:50};varshape_circle=group.createCircle(circl

清单 2. 对 GFX 图形对象进行变形操作

　//5.　创建　group，并在其中创建一个绿色圆形　
　var　group　=　surface.createGroup();　
　var　circle　=　{　cx:　250,　cy:　250,　r:　50　};　
　var　shape_circle　=　group.createCircle(circle).setFill([0,　255,　0,　0.5]);　
　
　//6.　将画面中的红色直线移动到组对象中　
　group.add(line);　
　
　//7.　将组对象扩大至　2　倍并逆时针旋转　45　度　
　group.setTransform([dojox.gfx.matrix.translate(250,　250),　
　dojox.gfx.matrix.rotateg(-45),dojox.gfx.matrix.scale(2),　
　　　　　dojox.gfx.matrix.translate(-250,　-250)]);　

引入移动和拖放，增强图形操作能力

在使用 GFX 实现了基本绘图操作之后，本章将再深入一步，借助 DnD(dojo.dnd) 完成对图形的移动和拖放 (DnD，Drag and Drop) 操作，增强用户对 Web 2.0 应用的体验。

首先来看移动操作，为了移动 GFX 绘图画面中的某个图形对象，GFX 提供了专用于图形的移动的 dojox.gfx.Moveable 类，开发人员在使用时只需简单的将所要移动的图形对象作为参数传入即可，例如，为了能够使清单 2 所创建的组图形具备可移动性，我们可以在图形创建完毕后通过如下这条语句来实现。

　new　dojox.gfx.Moveable(group)　

这里顺便介绍一下的是，在 Dojo 其核心库中提供有一个专用于 DOM 节点移动的 dojo.dnd.Moveable 类，较 dojox.gfx.Moveable 而言具有更为通用的移动能力，而并非仅限定于 GFX 图形，例如我们可以使用如下代码来移动一个 dijit 对象。