将HTML5画布保存为数据

Question

我想将HTML5画布上的图形元素保存到磁盘，对其他位置的数据进行一些操作，然后读取操纵的数据abck并重新绘制画布。我只找到将画布保存为图像的解决方案。是否有可能查询/遍历画布中包含的元素？我认为WPF/Silverlight有这样的东西。

-pom-

Answer 1

不，你必须保存你在绘画的对象，例如像：

{"shape": "circle", "x": 45, "y": 112, "radius": 23, "color": "ff3480"} 

，那么你可以序列化对象以JSON并将它们保存在磁盘或数据库。您还需要反序列化JSON并再次绘制对象的功能。

Answer 2

没有内置的方式。帆布是一个即时绘图表面，仅此而已。当你告诉它绘制一个矩形时，它会抛出一些像素，然后忘记你刚刚完成的一切。如果你想跟踪任何事情，你必须自己做所有事情，否则就得到一个完全相同的图书馆。

SVG是一个保留的绘图表面。每个绘制的项目实际上都是一个DOM对象，其数据代表其当前状态。根据你在做什么，使用SVG会为你节省很多头痛。

Raphael是一个SVG库，可能是一个很好的起点，如果你想看看已经完成了什么。看看他们的一些样品：

http://raphaeljs.com/