手机建网站免费域名空间,wordpress安装后首页字体太大,做网站备案,阿里云服务器wordpress建站教程原理
fabric的渲染步骤大致如下#xff1a;
渲染前都设置背景图然后调用ctx.save()#xff0c;存储画布的绘制状态参数然后调用每个object自身的渲染方法最后调用ctx.restore()#xff0c;恢复画布的保存状态后处理#xff0c;例如控制框的渲染等 值得注意的是#xff0…原理
fabric的渲染步骤大致如下
渲染前都设置背景图然后调用ctx.save()存储画布的绘制状态参数然后调用每个object自身的渲染方法最后调用ctx.restore()恢复画布的保存状态后处理例如控制框的渲染等 值得注意的是fabric渲染过程中有两次canvas变换第一次变换是canvas的viewport整体变换反应到标注平台就是canvas的自身的transform参数第二次变换是每个object各自的变换将object从画布左上角点为原点转为以object中心点为原点。 弊端
这种方式你会发现每一次都是所有几何全部渲染不适合大数据量的渲染。当然fabric也做了一些优化比如对active的几何放在一个单独的canvas中进行编辑不会重渲染原canvas。但是真正的编辑不太可能使用其原生的控制框进行编辑真正的编辑更加复杂需要对每个几何的每个坐标点我称之为形点进行拖拽编辑这就需要我们设计一个草稿图sketchLayer的架构来对几何编辑进行扩展支持。后续文章我会探讨这个草稿图模式如何设计更加合理。
预告
下一章我们讲讲架构主题是ID编辑器和fabric如何构成一个完整的标注平台。
