jjzjj

javascript - 用于高级 Web GUI 的 Pixi.js 和 ThreeJS

coder 2024-05-10 原文

想法

嗨! 我和一个开发团队正在创建一个用于交互式图形编辑的开源图形界面。

我希望这个界面能够处理大量连接的节点,允许用户移动它们、重新连接、放大/缩小等。每个节点上都可以有文本、按钮、 slider 和其他控件。另外,我们想创建一个非常先进的、可插入的图形界面——每个面板都是一个插件——你可以把它想象成基于 web 的 eclipse。面板可以是图形编辑器、时间线或 3D 视口(viewport)。

问题

我想问你,哪个库会给我们带来更多好处 - Pixi.jsThreeJS 还是其他?也许我们应该混合使用它们——在 Pixi.js 中创建界面,在 ThreeJS 中创建一些需要 3D 支持的插件(我个人不喜欢这个想法,因为降低“一致性”)。

要求

我们希望一切都在 WebGL 中运行。这样做的一个原因是,我们希望尽可能流畅地运行图形编辑器,并考虑到图形编辑器需要显示与 GUI 其他部分相同的控件这一事实,用一种技术来实现是合理的。

我正在寻找一个库,它将为我创建如此大的项目提供最佳性能和灵 active ,尤其是考虑到:

  • 能够创建自定义 HUD 元素( slider 、按钮、图表等)
  • 处理大量元素的能力——缓存/重绘只需要的部分很重要
  • canvas fallback 很重要,但不是关键

最佳答案

but if you want to create a high performance node graph with zooming in / out and some fancy effects, that could handle thousands of nodes, I think much better performance we would gain using canvas / webgl, right?

不,我不能同意。

HTML 在节点操作和渲染方面确实非常出色。但它的弱点是您所说的那些花哨的效果。

另一方面,webgl 非常适合花式效果,但节点操作非常差。假设在第一次尝试时,您将每个节点创建为一次绘制调用,300 次绘制调用,您可能就完成了。 You will have to think and cheat and think and cheat to get rid of draw calls (webgl calls).

我见过的例子,所以可以谈谈。 Cocos2d-js可能比 Pixi.jsThreeJS 更合适。这是非常好的 2d 免费引擎,带有免费工作室和强大的 Canvas 后备。还有一种您可能想要的基本奇特效果,九片。但即使是这个简单的 9 片对象也会进行 9 次绘制调用,你会发现你的性能正在快速下降。我还使用 cocos2d 进行了性能测试,我可以说 400 个最简单的 sprite 彼此相邻运行仅 30fps。

性能如此低的原因是引擎(无论是什么引擎)没有关于您究竟想要实现什么的信息。大多数引擎只会为您提供一种或两种渲染方式。如果我选择我希望每张图片都是一个 Sprite (一个节点),引擎将无法简化它。

如果我是你,我不会使用任何引擎,只会使用 webgl。但这意味着您必须知道 webgl,并且您没有 Canvas 后备。任务似乎很艰巨,又进行了一些示威。 ThreeJS 和 playcanvas 引擎在浏览器中都有免费的编辑器。 Playcanvas 于 2 天前发布了新版本的编辑器。编辑器 gui 都是 HTML。我们正在谈论更喜欢 HTML gui 的 webgl 引擎。还有很多游戏设计师也更喜欢 HTML。

所以 HTML 根本不是一个坏选择,但如果你真的需要使用 webgl,你应该做好准备。引擎可能无法完成您的任务。

关于javascript - 用于高级 Web GUI 的 Pixi.js 和 ThreeJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29838206/

有关javascript - 用于高级 Web GUI 的 Pixi.js 和 ThreeJS的更多相关文章

  1. ruby-on-rails - Rails 常用字符串(用于通知和错误信息等) - 2

    大约一年前,我决定确保每个包含非唯一文本的Flash通知都将从模块中的方法中获取文本。我这样做的最初原因是为了避免一遍又一遍地输入相同的字符串。如果我想更改措辞,我可以在一个地方轻松完成,而且一遍又一遍地重复同一件事而出现拼写错误的可能性也会降低。我最终得到的是这样的:moduleMessagesdefformat_error_messages(errors)errors.map{|attribute,message|"Error:#{attribute.to_s.titleize}#{message}."}enddeferror_message_could_not_find(obje

  2. Ruby Sinatra 配置用于生产和开发 - 2

    我已经在Sinatra上创建了应用程序,它代表了一个简单的API。我想在生产和开发上进行部署。我想在部署时选择,是开发还是生产,一些方法的逻辑应该改变,这取决于部署类型。是否有任何想法,如何完成以及解决此问题的一些示例。例子:我有代码get'/api/test'doreturn"Itisdev"end但是在部署到生产环境之后我想在运行/api/test之后看到ItisPROD如何实现? 最佳答案 根据SinatraDocumentation:EnvironmentscanbesetthroughtheRACK_ENVenvironm

  3. ruby - inverse_of 是否适用于 has_many? - 2

    当我使用has_one时,它​​工作得很好,但在has_many上却不行。在这里您可以看到object_id不同,因为它运行了另一个SQL来再次获取它。ruby-1.9.2-p290:001>e=Employee.create(name:'rafael',active:false)ruby-1.9.2-p290:002>b=Badge.create(number:1,employee:e)ruby-1.9.2-p290:003>a=Address.create(street:"123MarketSt",city:"SanDiego",employee:e)ruby-1.9.2-p290

  4. ruby - "undefined method"用于 rails 模型 - 2

    我正在使用带有Rails的Devise,我想添加一个方法“getAllComments”,所以我这样写:classUser在我的Controller中:defdashboard@user=current_user@comments=@user.getAllComments();end当我访问我的url时,我得到了undefinedmethod`getAllComments'for#我做错了什么?谢谢 最佳答案 因为getAllComments是一个类方法,而您正试图将其作为实例方法访问。您要么需要访问它:User.getAllCom

  5. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  6. Ruby on Rails regexp equals-tilde 与 array include 用于检查选项列表 - 2

    我正在使用Rails3.2.3和Ruby1.9.3p0。我发现我经常需要确定某个字符串是否出现在选项列表中。看来我可以使用Ruby数组.includemethod:或正则表达式equals-tildematchshorthand用竖线分隔选项:就性能而言,一个比另一个好吗?还有更好的方法吗? 最佳答案 总结:Array#include?包含String元素,在接受和拒绝输入时均胜出,对于您的示例只有三个可接受的值。对于要检查的更大的集合,看起来Set#include?和String元素可能会获胜。如何测试我们应该根据经验对此进行测试

  7. ruby-on-rails - Ruby "Undefined Method"用于类方法 - 2

    Ruby初学者努力简单地将这个@@people散列的值打印到控制台classPerson#haveafirst_nameandlast_nameattributewithpublicaccessorsattr_accessor:first_nameattr_accessor:last_name#haveaclassattributecalled`people`thatholdsanarrayofobjects@@people=[]#havean`initialize`methodtoinitializeeachinstancedefinitialize(first_name,last_

  8. python - 用于 Python 或 Ruby 的 Amazon Book API? - 2

    这个问题在这里已经有了答案:关闭10年前。PossibleDuplicate:AmazonAPIlibraryforPython?我正在寻找一个AmazonAPI,它可以让我:按书名或作者查找书籍显示书籍封面获取有关每本书的信息(价格、评级、评论数、格式、页数等)Python或Ruby库都可以(我只想要最容易使用的库)。有什么建议么?我知道在SO上还有其他一些关于此的帖子,但这些API似乎很快就过时了。[几个月前我尝试了几个建议的Ruby库,但无法让它们中的任何一个工作。]

  9. ruby-on-rails - 用于门户的 Ruby 技术 - 2

    我刚刚看到whitehouse.gov正在使用drupal作为CMS和门户技术。drupal的优点之一似乎是很容易添加插件,而且编程最少,即重新发明轮子最少。这实际上正是Ruby-on-Rails的DRY理念。所以:drupal的缺点是什么?Rails或其他基于Ruby的技术有哪些不符合whitehouse.org(或其他CMS门户)门户技术的资格? 最佳答案 Whatarethedrawbacksofdrupal?对于Ruby和Rails,这确实是一个相当主观的问题。Drupal是一个可靠的内容管理选项,非常适合面向社区的站点。它

  10. ruby-on-rails - Assets 管道损坏 : Not compiling on the fly css and js files - 2

    我开始了一个新的Rails3.2.5项目,Assets管道不再工作了。CSS和Javascript文件不再编译。这是尝试生成Assets时日志的输出:StartedGET"/assets/application.css?body=1"for127.0.0.1at2012-06-1623:59:11-0700Servedasset/application.css-200OK(0ms)[2012-06-1623:59:11]ERRORNoMethodError:undefinedmethod`each'fornil:NilClass/Users/greg/.rbenv/versions/1

随机推荐