我有一个组件在“after:render”事件上消耗fabricjs Canvas 内容,这与添加对象、移动对象等所有功能配合良好。
但是,当涉及到自由绘制时,“after:render”事件仅在绘制完成后(即鼠标松开事件时)触发。我尝试在鼠标绘制时读取 Canvas 数据,但没有成功,显然在绘制过程中内容尚未渲染到 Canvas 上。
我从这个 PR https://github.com/fabricjs/fabric.js/pull/2895 了解到这一点自由绘图绘制在这个 contextTop 元素上,我的问题是我可以从中读取数据吗?或者是否有办法强制 Fabric 在鼠标松开之前渲染自由绘图内容?我尝试过 renderAll() 但运气不佳。
谢谢!
最佳答案
我认为你可以执行以下操作:
var points = canvas.freeDrawingBrush._points;
var pathData = canvas.freeDrawingBrush.prototype.convertPointsToSVGPath.call(canvas.freeDrawingBrush, points);
这应该为您提供实际的路径数据字符串,以便在您喜欢的系统中创建路径。
关于javascript - Fabrics - 如何在鼠标松开之前渲染自由绘图内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51370679/