我需要一些关于使用 d3.js 可视化大数据的建议。我从 hbase 提取数据并将其存储在 json 文件中,以便使用 d3.js 进行可视化。当我提取几个小时的数据时,json 文件的大小约为 100MB,可以通过 d3.js 轻松可视化,但使用 dc.js 和 crossfilter 进行过滤有点慢。但是,当我拉取 1 周的数据集时,json 文件大小变得超过 1GB,并尝试使用 d3.js、dc.js 和 crossfilter 进行可视化,然后可视化无法正常工作,过滤也无法实现。谁能给我任何想法是否有一个好的解决方案,或者我需要在不同的平台而不是 d3 上工作?
最佳答案
我绝对同意马克和戈登之前所说的话。但我必须补充过去几个月在扩展 dc.js 仪表板以处理相当大的数据集时学到的东西。
正如所指出的,一个瓶颈是数据集转换为数千个 SVG/DOM 或 Canvas 元素时的大小。 Canvas 在浏览器上更轻便,但内存中仍然有大量元素,每个元素都有其属性、点击事件等。
第二个瓶颈是数据的复杂性。 dc.js 的响应能力不仅取决于 d3.js,还取决于 crossfilter.js。如果您检查the Crossfilter example dashboard ,您会发现他们使用的数据量相当可观:超过 230000 个条目。然而,这些数据的复杂性相当低:每个条目只有五个变量。保持数据集简单有助于扩大规模。请记住,此处每个条目有 5 个变量意味着可视化期间浏览器内存中大约有 100 万个值。
最后一点,您提到您以 JSON 格式提取数据。虽然这在 Javascript 中非常方便,但解析和验证大型 JSON 文件要求相当高。此外,它不是最紧凑的格式。 Crossfilter example data格式为非常简单且紧凑的 CSV 文件。
总之,您必须找到数据的大小和复杂性之间的最佳平衡点。一百万个数据值(大小乘以复杂性)是完全可行的。将其增加一个数量级,您的应用程序可能仍然可用。
关于d3.js 无法可视化大型数据集,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29752539/