jjzjj

javascript - 适合与 D3js 结合的库,以允许绘制到 webgl (2D)

coder 2025-01-18 原文

这是我正在尝试做的: http://mbostock.github.com/d3/talk/20111116/iris-splom.html

但我想在 webgl 2d 中执行此操作(因为 SVG 性能非常慢,渲染 10k SVG 仅已降至 12 fps)

通过快速搜索,我发现了几个 webgl-2d 库:cocos2d-html5 , pixijs ,Three.js 和 webgl-2d(废弃?)

它们看起来很简单,但我想做的是数据可视化。cocos 和 pixijs 是 2d 游戏库。我是 webgl 和那些库的新手,所以 SO 方面的专家你们能推荐一下吗?

我需要的东西的总结:

互动:

  • 地 block 内的矩形选择。单击以选择某些元素。
  • 缩放和平移支持(如果可能的话,闪米特缩放)

渲染器: WebGL2d(根据基准 webgl 是最快的)

最佳答案

根据您的要求和总结,我会推荐最新版本的Cocos2D-html5其中包括 WebGL 渲染支持。这就像在 cocos2d.js 中将渲染设置从 Canvas 更改为 WebGL 一样简单。设置文件。例如,在 HelloHTML5World/cocos2d.js 中将 renderMode 更改为 2 以进行基于 WebGL 的渲染。

renderMode:0,       //Choose of RenderMode: 0(default), 1(Canvas only), 2(WebGL only)

Cocos2d-html5 更准确地说是一个图形库,并且可能被解释为一个完整的游戏库,仅与(默认)chipmunk 或 box2d 游戏物理库结合使用。

是否支持矩形选择,或缩放和平移?是的,您可以扩展现有的库来实现这些行为。

Cocos2d-html5 平台的其他优势是添加了对使用 Cocosbuilder 进行可视化图形编辑的支持,以及对具有 Javascript 绑定(bind)的相同代码库的跨平台 native 支持(iOS、Android 等)。

如果您有特定的平台问题,可以使用代码更详细地回答这些问题。

您可能想查看 JS referencecocos2d-html5 forum开始。

更新 1:查看了 iris 数据集的数据可视化代码,这些图位于 svg 元素中,小圆圈根据 x、y 坐标绘制每个数据点。这些也可以在 Cocos2d 中通过 x、y 坐标、网格、具有不同不透明度的框和数据点的小圆圈来完成。通过 javascript 代码以 json/xmll/csv 格式导入你的鸢尾花数据集,并通过上述 cocos2d 方法绘制。通过 javascript 事件回调和鼠标处理程序方法选择矩形以及相应的 Canvas 场景更新。

更新 2:再三考虑,如果您发现 cocos2d 的学习曲线陡峭,您最好将自己限制在基于 WebGL 的仅图表库。本项目VivaGraphJS似乎适合 high performance基于 WebGL。

另外,请最好以这种格式提问,你在代码中尝试了什么,预期的输出是什么,你得到了什么。 SO 不适用于比较库。 WebGL 是一种渲染方法。例如在 three.js 中的开关就像

一样简单
renderer = new THREE.WebGLRenderer();

而不是 Canvas :

renderer = new THREE.CanvasRenderer();

导致更高的性能。

关于javascript - 适合与 D3js 结合的库,以允许绘制到 webgl (2D),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16236220/

有关javascript - 适合与 D3js 结合的库,以允许绘制到 webgl (2D)的更多相关文章

  1. ruby-on-rails - 结合 meta_search 与 acts_as_taggable_on - 2

    我在开发的Rails3网站的一些搜索功能上遇到了一个小问题。我有一个简单的Post模型,如下所示:classPost我正在使用acts_as_taggable_on来更轻松地向我的帖子添加标签。当我有一个标记为“rails”的帖子并执行以下操作时,一切正常:@posts=Post.tagged_with("rails")问题是,我还想搜索帖子的标题。当我有一篇标题为“Helloworld”并标记为“rails”的帖子时,我希望能够通过搜索“hello”或“rails”来找到这篇帖子。因此,我希望标题列的LIKE语句与acts_as_taggable_on提供的tagged_with方法

  2. ruby-on-rails - RSpec:避免使用允许接收的任何实例 - 2

    我正在处理旧代码的一部分。beforedoallow_any_instance_of(SportRateManager).toreceive(:create).and_return(true)endRubocop错误如下:Avoidstubbingusing'allow_any_instance_of'我读到了RuboCop::RSpec:AnyInstance我试着像下面那样改变它。由此beforedoallow_any_instance_of(SportRateManager).toreceive(:create).and_return(true)end对此:let(:sport_

  3. 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发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  4. ruby - 允许主机名包含下划线的 URI.parse 的替代方法 - 2

    我正在使用DMOZ的listofurltopics,其中包含一些具有包含下划线的主机名的url。例如:608609TheOuterHeaven610InformationandimagegalleryofMcFarlane'sactionfiguresforTrigun,Akira,TenchiMuyoandotherJapaneseSci-Fianimations.611Top/Arts/Animation/Anime/Collectibles/Models_and_Figures/Action_Figures612虽然此url可以在网络浏览器中使用(或者至少在我的浏览器中可以使用:

  5. ruby-on-rails - 将 Amazon Simple Notification service SNS 与 ruby​​ 结合使用 - 2

    很难说出这里要问什么。这个问题模棱两可、含糊不清、不完整、过于宽泛或夸夸其谈,无法以目前的形式得到合理的回答。如需帮助澄清此问题以便重新打开,visitthehelpcenter.关闭9年前。我需要从基于ruby​​的应用程序使用AmazonSimpleNotificationService,但不知道从哪里开始。您对从哪里开始有什么建议吗?

  6. ruby - 为什么允许在 Ruby 类之外定义全局方法? - 2

    我读过这个:Let’sstartwithasimpleRubyprogram.We’llwriteamethodthatreturnsacheery,personalizedgreeting.defsay_goodnight(name)result="Goodnight,"+namereturnresultend我的理解是,方法是定义在类中的函数或子程序,可以关联到类(类方法)或对象(实例方法)。那么,如果它不是在类中定义的,怎么可能是方法呢? 最佳答案 当你在Ruby中以这种方式在全局范围内定义一个函数时,它在技术上变成了Obje

  7. 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

  8. ruby-on-rails - Rails - 理解 application.js 和 application.css - 2

    rails新手。只是想了解\assests目录中的这两个文件。例如,application.js文件有如下行://=requirejquery//=requirejquery_ujs//=require_tree.我理解require_tree。只是将所有JS文件添加到当前目录中。根据上下文,我可以看出requirejquery添加了jQuery库。但是它从哪里得到这些jQuery库呢?我没有在我的Assets文件夹中看到任何jquery.js文件——或者直接在我的整个应用程序中没有看到任何jquery.js文件?同样,我正在按照一些说明安装TwitterBootstrap(http:

  9. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接,但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  10. node.js - 如何在 Travis CI 上的一个项目中运行 Node.js 和 Ruby 测试 - 2

    我有一个包含多个组件的存储库,其中大部分是用JavaScript(Node.js)编写的,一个是用Ruby(RubyonRails)编写的。我想要一个.travis.yml文件来触发一个运行每个组件的所有测试的构建。根据thisTravisCIGoogleGroupthread,目前还没有官方支持。我的目录结构是这样的:.├──构建服务器├──核心├──扩展├──网络应用├──流浪文件├──package.json├──.travis.yml└──生成文件我希望能够运行特定版本的Ruby(2.2.2)和Node.js(0.12.2)。我已经有了一个make目标,所以maketest在每

随机推荐