10
votes

Utilisez le web travailleur et d3.js pour générer des graphiques de manière asynchrone?

Je travaille actuellement un problème qui nécessite mon application Web pour générer un graphique représentant environ 50k à 60k points de données. Il charge assez rapidement (environ 6 secondes), mais ce que je me demande s'il est possible d'utiliser d3.js pour générer le graphique dans un travailleur Web, puis transmettez le dos SVG pour être chargé dans la page.


0 commentaires

3 Réponses :


5
votes

Les travailleurs du Web n'ont pas d'accès DOM, vous pourrez donc tout ce que vous pouviez faire de ce côté pour créer quelque chose qui pourrait être utilisé pour créer rapidement le DOM. Le (s) travailleur (s) pourrait-il traiter les jeux de données et faire tous les calculs lourds, puis transmettre le résultat en raison d'un ensemble de tableaux.


2 commentaires

Merci. J'avais peur que ce soit la réponse.


@meteamit qui pourrait être une option que je suppose, générer le DOM sur le serveur avec Phantomjs, puis transmettez-le au client? Mais cela n'utilise pas les travailleurs du Web, ce qui était la question.



5
votes

https://github.com/mbostock/d3/commit/43d38773623b52209D2667287A1AE626FB95B0D9 < / p>

Un engagement récent de Jason Davies. Mike Bostock affirme que, à l'avenir, le code dépendant DOM sera séparé de D3.core et de cette façon, vous pouvez créer une construction D3 personnalisée qui fonctionne avec l'API des travailleurs Web.

J'ai eu le même problème où j'ai un graphique de force dirigé avec un grand nombre de nœuds. Il se sent très léthargique. Je veux améliorer la performance d'une manière ou d'une autre. Je pense que le dernier fil avec Phantomjs sur un serveur de nœuds est une bonne idée, mais la latence de réseau impliquée dans l'approche ruinera la sensation dirigée par la Force.


1 commentaires

Alors, où trouvez-vous le D3 dépouillé sans dépendances DOM?



1
votes

J'ai réussi à calculer les accords et les groupes d'une disposition d'un accord à l'aide d'un travailleur Web en procédant comme suit:

  1. créer une construction personnalisée de D3 qui n'a pas de dépendance sur l'objet Document ou le DOM (voir: https://github.com/mbostock/smash/wiki ) p> li>

  2. Créez un fichier de travailleur Web et utilisez importateurs code> pour charger la construction D3 personnalisée p> li>

  3. Activez votre travailleur dans votre code de rendu. J'ai utilisé une promesse d'encapsuler la communication avec le travailleur: p>

    calculateChords(matrix).then (groups, chords) ->
        ...
    


1 commentaires

Vous pouvez réellement exécuter Standard D3 dans un travailleur Web si vous laissez les bons objets (faux) mentent de l'around pour apaiser D3 comme démarrage. Le problème principal, cependant (à l'aide de D3 avec des travailleurs Web), est la sérialisation des frais généraux dans l'envoi et la réception du message. Je serais très intéressé de savoir si quiconque a proposé une belle méthode d'utilisation d'objets transférables pour éviter toute sérialisation.