10个很棒的JavaScript绘图和画布库

JavaScript / Web设计人员和开发人员，可以利用这些JavaScript Drawing和Canvas库向其Web应用程序或网站添加图形绘制功能。 玩得开心！

2013年5月 18日更新：添加了11.画布查询。

1. oCanvas

是一个JavaScript库，旨在简化HTML5 Canvas的开发。 您无需处理像素，而可以处理对象。 它非常简单易上手。

资源
演示版

2.在基于Mozilla的浏览器和Internet Explorer中画线

HTML本身无法描述行。 因此，上述浏览器中没有用于绘制线条的内置功能。 通过使用JavaScript实施Bresenham算法并应用一些技巧，我们将能够以良好的方式针对浏览器的运行时和内存占用量画线。

来源+演示

3. canviz JavaScript库

使用Canviz对您的Web应用程序具有优于生成位图图像和图像映射并将其发送到浏览器的优势，因为服务器只需要Graphviz生成xdot文本即可。 这比生成位图图像更快。

资源
演示版

4. Flotr JavaScript绘图库

Flotr使您能够以易于学习的语法在大多数现代浏览器中绘制吸引人的图形。 它具有强大的功能，例如图例支持，负值支持，鼠标跟踪，选择支持，缩放支持，事件挂钩，CSS样式支持等等。

资源
演示版

5. Raphael：JavaScript图形库

Raphael使用SVG W3C建议书和VML作为创建图形的基础。 这意味着您创建的每个图形对象也是DOM对象，因此您可以附加JavaScript事件处理程序或稍后对其进行修改。 Raphaël的目标是提供一种适配器，使图形矢量艺术兼容的跨浏览器且易于使用。

资源
演示版

6. PlotKit – Javascript图表绘制

PlotKit已完全记录在案，并且有一个快速入门指南。 PlotKit是CanvasGraph的完整重写。 它具有更好的结构和支持。

资源
演示版

7. CanvasGraph.js：用Javascript绘图

进行此工作的动机是允许使用JavaScript进行简单的图形绘制，而无需借助Web浏览器。

资源
演示版

8. jsDraw2D：用于JavaScript的2D图形库

使用jsDraw2D，可以绘制诸如三次贝塞尔曲线，常规贝塞尔曲线的高级图形。 一般的贝塞尔曲线可以为任意程度，包括线性，二次和三次曲线，通过给定点的开放曲线和通过给定点的闭合曲线。

资源
演示版

9. JavaScript矢量绘图库

该库是跨浏览器的，且速度很快。 但是，由于HTML的限制，与在独立应用程序中进行绘制相比，使用JavaScript在网页上进行绘制的速度较慢。

来源+演示

10. Draw2D JavaScript图形库

使用免费的JavaScript库创建图形和图表。 用户界面允许使用标准浏览器进行交互式绘图。 没有其他软件，也没有第三方插件。 只需运行并使用它。

资源
演示版

11. 画布查询
使用类似jQuery的HTML5 Canvas
游戏开发人员的扩展画布
轻松设置游戏循环，渲染循环，鼠标，触摸和键盘

From: https://www.sitepoint.com/10-cool-javascript-drawing-canvas-libraries/