用于实现场景图的矢量图形的JavaScript API

我正在寻找用于创建2D图形（如Raphael或Fabric）的JavaScript框架。我喜欢这两种API，但我缺少一种面向对象的方式来创建具有组合模式的场景图。用于实现场景图的矢量图形的JavaScript API

有没有人知道这样的框架？

为了明确我的意思是合成模式：我想将绘制的对象放置在树中，就像它在GUI框架（如swt或swing）中完成的那样（Java3D也使用它）。有你有一个

组件作为父类被画的所有对象。它描述了所有绘制对象的常见行为和属性。
集装箱从组件延伸，并包含组件的列表。因此集装箱表现得像一个单独的组件，并将所有操作代为集装箱到其所有子组件。

使用此两类使得它很容易地创建一个场景图...

是否有一个二维框架在那里，使用这个模式？

来源

2013-08-22 treeno

这不是一个成语（即特定于语言的设计模式），所以你可以在JavaScript中实现它，但我不明白你为什么要这样做。

一些JS框架（或库）提供了一个很好的解决方案刚愎自用和结构化工作流程 - 比如sceneJS（虽然它是本质上是3D引擎）或D3.js - 消除执行这种模式的需要。

复合模式如何与创建scenegraphs帮助，所以我不能帮你那里，但这里有从人的一些例子如何一直在那里，住讲的故事你还没有上阐述：

Mike Bostock（D3.js的作者）写了a POC for a canvas scenegraph in the DOM（！），您可能会感兴趣。

在JSter博客有a post建议到“补充EaselJS与AtelierJS ”（AtelierJS其实自己描述为CreateJS ”一个“现场管理模块）。

它在也提到非常张贴Paper.js实现场景图的核心功能，所以这是值得看的（实际上，它可能只是正是你后的）。

还检出CakeJS，据说这是“用于HTML5画布标签的JavaScript场景图库”。

来源

2013-08-22 23:07:57

我一般不会错过JavaScript中的复合模式，我错过了2D Graphic API的模式。由于我只知道一些图形API，我认为可能还有更多。这就是为什么我在这里创建线程:-) – treeno

为什么我想要的复合模式：场景图是一个树结构，可用于组织它的节点和叶子的翻译，转换，缩放和旋转。这个操作可以被称为节点和树叶。预计这两种方式都会以相同的方式进行操作，但节点上的操作将委派给所有的孩子。一种经典的创建方法是复合模式 - 如果你处于面向对象的世界。我喜欢它的自然清晰度 - 这就是为什么我想要的:-)但我总是好奇学习更多，甚至更好的方式:-) – treeno

Paper.js确实非常接近我所寻找的，我只是对这个PaperScript-JavaScript覆盖不太了解。我想使用Coffee-Script，但我不知道如何组合它们。 – treeno

用于实现场景图的矢量图形的JavaScript API

回答

相关问题