10

我目前正在处理一个问题，该问题需要我的 Web 应用程序生成一个代表大约 50k 到 60k 数据点的图表。它加载得相当快（约 6 秒），但我想知道是否可以使用 D3.js 在 Web Worker 中生成图形，然后将 SVG 传回以加载到页面中。

4

3 回答 3

5

Web Workers 没有 DOM 访问权限，因此您在这方面所能做的就是构建可用于快速创建 DOM 的东西。工作人员可以例如处理数据集并进行所有繁重的计算，然后将结果作为一组数组传回。

于 2012-06-13T21:32:34.773 回答
5

https://github.com/mbostock/d3/commit/43d38773623b52209d2667287a1ae626fb95b0d9

Jason Davies 最近的一次提交。Mike Bostock 说，未来依赖 DOM 的代码将从 d3.core 中分离出来，这样您就可以制作与 web-workers API 一起使用的自定义 d3 构建。

我有同样的问题，我有一个带有大量节点的力有向图。感觉非常迟钝。我想以某种方式提高性能。我认为在节点服务器上使用 phantomJS 的最后一个线程是个好主意，但是这种方法所涉及的网络延迟会破坏流畅的强制导向感觉。

于 2013-02-26T20:30:58.327 回答
1

通过执行以下操作，我设法使用 Web Worker 计算和弦布局的和弦和组：

  1. 创建一个不依赖于文档对象或 DOM 的 d3 自定义构建（参见：https ://github.com/mbostock/smash/wiki ）

  2. 创建一个 web worker 文件并用于importScripts加载自定义 d3 构建

  3. 在渲染代码中激活您的工作人员。我使用了一个 promise 来封装与 worker 的通信：

    calculateChords = (padding, matrix) ->
        deferred = $.Deferred()

        worker = new Worker("worker.js")

        worker.onmessage = (e) ->
            deferred.resolve(e.data.groups, e.data.chords);

        worker.postMessage {
            matrix: matrix
        }

        deferred.promise()

    稍后，在渲染函数中：

    calculateChords(matrix).then (groups, chords) ->
    ...
于 2015-07-21T11:59:06.957 回答