是否已经有在画布上绘制/绘制对象的指令?所以你可以实现像画图这样的东西,甚至像Photoshop等更大的东西,但一个非常基本的例子就足够了。
我在搜索中没有找到一个,如果已经有一个被认为是最佳实践,我想使用它。否则我必须自己实现一个。
发布于 2013-05-16 21:09:34
Angular非常适合于以声明式的方式编写应用程序。一旦你碰到了画布元素,你就不能再使用声明式了,你必须转向一种命令式的编写机制。如果您的应用程序的大部分都提供UI,那么我强烈建议您使用AngularJS。这是一个令人惊叹的框架。
另一方面,如果您的大部分代码将放在canvas元素中,那么AngularJS可能不是您的理想工具。如果你真的坚持在你的大部分应用程序中使用AngularJS,我建议你考虑使用像D3这样的东西,这是一个很好的替代方案,它在幕后使用SVG (它本质上是声明性的,因此是AngularJS的一个很好的助手)。
发布于 2015-04-06 15:19:29
不久前,我为此构建了一个可配置的指令。
https://github.com/pwambach/angular-canvas-painter
该指令创建canvas元素,并向该元素添加mousedown/mousemove/mouseup事件(以及相应的触摸事件)的处理程序。Mousedown和后续mousemove事件使用canvasContext.quadraticCurveTo()
方法绘制贝塞尔曲线,以获得更平滑的笔触(而不仅仅是为每个点绘制圆)。有关绘图算法的详细信息,请参阅本文:http://codetheory.in/html5-canvas-drawing-lines-with-smooth-edges/
发布于 2016-11-19 00:33:18
这是一个非常好的实现!如果您想转换图像上的画布,我可以添加该方法
function convertCanvasToImage(canvas) {
var image = new Image();
image.src = canvas.toDataURL("image/png");
return image;
}
这将使您的源为base64元素的图像标记。
希望能对你有所帮助
https://stackoverflow.com/questions/16587961
复制相似问题