在Javascript中渲染大矩阵(1000*1000)
我需要在我们基于网络的应用程序中显示一个大矩阵。矩阵尺寸约为。 1000*1000,每个单元格要么被填充,要么未被填充。
基本上,它应该看起来像这样(更大并且没有颜色): http://mbostock.github.com/protovis/ex/matrix.html
我需要基本的交互,例如缩放和单击单元格。该矩阵很可能是稀疏矩阵。
我尝试了 Protovis,但如果矩阵大于 80*80,渲染将永远持续下去。
哪些 Javascript 库可能适合此任务?
I need to display a large matrix within our web-based application. The matrix dimensions are approx. 1000*1000 and each cell is either filled or not.
Basically, it should look like this (much larger and without the colors):
http://mbostock.github.com/protovis/ex/matrix.html
I need basic interaction, such as zooming and clicking on a cell. The matrix is likely to to be a sparse matrix.
I tried Protovis but rendering takes forever if the matrix is larger than 80*80.
What Javascript library might be suitable for this task?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我会使用 HTML5 Canvas 来快速绘图。 (这个超级简单的演示在我的计算机上几秒钟内即可呈现。)如果您想放大,你可以看到这个回答。
I would use an HTML5 Canvas for fast drawing. (This super-simple demo renders in a few seconds on my computer.) If you want to zoom in, you can see this answer.
为了向用户显示一百万个项目,每个元素可能必须是单个像素的大小。
我只使用 canvas。
In order to display a million items to a user, each element would probably have to be the size of a single pixel.
I'd just use a canvas.
您可以尝试 JavaScript 库 clustergrammer.js (请参阅 https://github.com/cornhundred/clustergrammer.js< /a>)。它使用 D3.js 进行交互式(可缩放、可重新排序、可过滤等)可视化。它可以处理大约 100,000 个数据点,但如果矩阵足够稀疏,则可以渲染大型矩阵。
以下是 clustergrammer.js 用于可视化 6000x230 矩阵的示例 http://amp.pharm.mssm.edu/clustergrammer/viz/568affd5b6541b84f3a68234
You could try the JavaScript library clustergrammer.js (see https://github.com/cornhundred/clustergrammer.js). It uses D3.js to make interactive (zoomable, reorderable, filterable, etc) visualizations. It can handle on the order of 100,000 data points, but if you matrix is sparse enough then you can render large matrices.
Here's an example of clustergrammer.js being used to visualize a 6000x230 matrix http://amp.pharm.mssm.edu/clustergrammer/viz/568affd5b6541b84f3a68234