javascript - 如何在 Canvas 上绘图(用鼠标/触摸)，保存绘制的对象，存储它，加载和操作？

Question

我想知道是否有任何框架允许我存储 Canvas 绘制的对象、加载和操作，或者如果没有，如何执行此类过程(如果可能)。

我的目标是执行以下步骤:

1. 在移动设备上使用鼠标/触摸在 Canvas 上绘图
2. 以我以后可以操作的方式存储绘制的对象(而不是图像文件)(对于商店，我的意思是将其远程保存在任何类型的来源上)
3. 将绘制的对象加载到 Canvas 上，并能够对其进行操作(弯曲一条线 p.ex)

Answer 1

你可以使用base64 + localStorage:

var canvas = document.getElementsByTagName('canvas')[0];  
var pngBase64 = canvas.toDataURL();
localStorage.setItem('myCanvasData', pngBase64);