Paper.js 开源的 HTML5 Canvas 画布矢量图形的脚本动画库

发布于 2018-03-02 22:49:50 字数 3021 浏览 3728 评论 0

Paper.js 是一个开源你的脚本动画库,基于最新的 HTML5 Canvas 画布,提供了大量的 API 接口让用户去创建图形和曲线,能够兼容现在的主流浏览器。

Paper.js 开源的 HTML5 Canvas 画布矢量图形的脚本动画库

Paper.js 能够兼容 Scriptographer,他是一个有着活跃的社区,有超过 10 年的发展的针对 Adobe Illustrator 的脚本环境。

浏览器兼容

Paper.js 是针对现代浏览器的 Canvas 对象和 ECMAScript 5 的支持,所以不兼容旧版本的浏览器。

特点

Paper.js 不仅仅是在 Canvas 对象上绘画,它提供了更多的功能:

  • A Scene Graph / Document Object Model for vector graphics: Work with nested layers, groups, paths, compound paths, rasters, symbols etc.
  • The handling and drawing of these graphic items is automatic and optimised, allowing you to construct or modify your items and styles and leave the drawing commands to Paper.js.
  • A well designed and battle hardened Application Programming Interface (API).
  • PaperScript, a simple extension of JavaScript, allowing the scoped execution of scripts without polluting the global scope, the execution of multiple scripts per page in their separate sand-boxed scopes while sharing the library code, and adding support for operator overloading to any object.
  • There is a good reason for the word Vector in Vector Graphics. Paper.js treats Vector Mathematics as a first class citizen by making working with vectors and geometries as simple as possible through its core types such as Point, Size and Rectangle. The manipulation of Point and Size objects is further simplified in PaperScript, where direct math operations using normal operator syntax are possible on such objects as if they were plain numbers.
  • Construct paths and manipulate their curves and segments in very convenient and fine-grained ways.
  • Inspect and manipulate the precise bounding box of any item, supporting complicated stroke styles with different stroke ends and miter limits.
  • Smoothen curves, and simplify path segments by fitting curves through points.
  • Simulate dashed strokes which are currently lacking from the Canvas object, at near native drawing speed.
  • Most blend modes known from Illustrator and Photoshop supported through emulation in JavaScript: multiply, screen, overlay, soft-light, hard-light, color-dodge, color-burn, darken, lighten, difference, exclusion, hue, saturation, luminosity, color, add, subtract, average & negation.

更多内容详见:http://paperjs.org

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

0 文章
0 评论
84960 人气
更多

推荐作者

lorenzathorton8

文章 0 评论 0

Zero

文章 0 评论 0

萧瑟寒风

文章 0 评论 0

mylayout

文章 0 评论 0

tkewei

文章 0 评论 0

17818769742

文章 0 评论 0

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文