Нарисуйте график, используя D3 (v3) в WebWorker - PullRequest
0 голосов
/ 20 марта 2019

Цель состоит в том, чтобы нарисовать график, используя D3 (v3) в WebWorker (рикша была бы еще лучше).

Требование № 1 : Объем хранилища для всего проекта не должен превышать 1 МБ.

Требование № 2 : Internet Explorer 10 должен поддерживаться


Я уже пытался передать элемент DOM Webworker. Это принесло следующее сообщение об ошибке:

DOMException: не удалось выполнить 'postMessage' для 'Worker': объект HTMLDivElement не может быть клонирован.

  var worker = new Worker( 'worker.js' );
  worker.postMessage( {
    'chart' : document.querySelector('#chart').cloneNode(true)
  } );

Пользователь GitHub chrisahardie сделал ...

небольшое доказательство концепции, показывающее, как создать диаграмму SVG d3 в веб-работника и передать его обратно в основной поток пользовательского интерфейса для внедрения в веб-страница.

https://github.com/chrisahardie/d3-svg-chart-in-web-worker

Он интегрировал jsdom в браузер с помощью Browserify.

Проблема:

Сценарий имеет почти 5 МБ, что слишком много для памяти приложения.

Итак, мой вопрос :

Кто-нибудь имеет опыт решения проблемы или знает, как можно решить проблему и выполнить требования?

1 Ответ

0 голосов
/ 21 марта 2019

Web Workers не имеют доступа к следующим объектам JavaScript: объект окна, объект документа и родительский объект.Таким образом, все, что мы могли бы сделать на этой стороне, это создать что-то, что можно было бы использовать для быстрого создания DOM.Работники могут, например, обрабатывать наборы данных и выполнять все тяжелые вычисления, а затем передавать результат обратно в виде набора массивов.Более подробно, вы можете проверить эту статью и этот образец

...