关于图层和区域管理者的设计细节请查看教程中的图层、区域管理者一节,这里只简单列出接口。
var layerManger=$$('canvas').layer([width, height]);
使用图层的第一步是通过上面的方法获取布局管理者,剩下的就是通过调用layerManger提供的方法使用图层绘图。
默认采用页面canvas大小建立图层,你也可以传递宽和高来指定图层大小。
var pencil=layerManger.painter(id);
返回图层名称为id的图层上的画笔,该画布和canvas2D上的画笔用法一样,使用该画笔绘制的图形会保存在对应图层上。
不使用图层获取画笔的方法是:$$('canvas').painter();
layerManger.clean(pencil);
传递某个图层上的画笔(painter方法的id也可以),会清除该画笔对应的图层上保存的全部图形。返回图层管理者。
layerManger.update();
把图层管理者管理的图层合并到页面画布中,先获取的画笔绘制的图形在最下面(以第一次获取画笔顺序为准)。返回图层管理者。
var regionManage=clayObject.region([width, height]);
和图层管理者不一样的是,区域管理者可以管理任何一个结点的区域,当然,第一步依旧是获取管理者,余下就是调用管理者提供的服务即可。
默认采用页面canvas大小建立区域管理者,你也可以传递宽和高来指定区域管理者管理范围。
regionManage.drawer(region_id,function(pencil){
// 用pencil这种画笔画出区域
});
region_id用来标记编辑的区域是哪个,pencil不可以修改fillStyle和strokeStyle的值。返回区域管理者。
如果上面的方法第二个参数不是一个方法,会返回绘制区域的画笔,别的不变。
regionManage.erase(function(erase){
// 用erase擦除不需要标记的区域,如果传递的参数不是函数或未传递,则擦除全部区域标记信息
});
和drawer方法类似,只不过功能相反,擦除的地方被标记为不属于任何区域。返回区域管理者。
var region_id=regionManage.getRegion(event);
需要传递一个参数event,返回此刻鼠标所在区域的标志id,如果不在任何区域,返回undefined。
无论是擦除还是添加新的区域,都需要在最后调用fill或stroke方法。