search

d3 / d3-force

Force-directed graph layout using velocity Verlet integration.
https://d3js.org/d3-force
ISC License
1.82k stars 377 forks source link

Saving, restoring and continuing a d3-force page #191

Closed FightingBugs closed 3 years ago

FightingBugs commented 3 years ago

Hi everybody,

is there a way to save a running d3-force page, using Ctrl-S (save the page) with the browser, stop the browser and then reload the page next day and continue the force simulation?

Before storing the page I set the friction value to 1 in order to freeze the simulation. Then i saved the page using Ctrl-S with the browser (firefox) and closed the browser.

When I reloaded the saved page next day, I saw the last state of the simualtion on the screen and could change the friction value to less than 1, say 0,5. But the force simulation did not continue, it did not start at all. It was only possible to start a new simualtion. The old simulation looked as being a backgound image.

What can be done for the force-simulation to continue the old simulation?

Fil commented 3 years ago

Here's an example where we save (some of) the postions in localStorage, so we can restart where we were. Maybe you can improve on it? https://observablehq.com/@fil/save-a-force-directed-graph-to-localstorage

FightingBugs commented 3 years ago

Hi Fil, I tried this page and receiver 3 errors, when reopening the page, sorry they are in german, perhaps you understand something. else I would try to translate. Errors messages:

  1. Das content-Attribut von Window-Objekten sollte nicht mehr verwendet werden. Bitte verwenden Sie stattdessen window.top. worker.js:2:70521
  2. 'postMessage' konnte auf 'DOMWindow' nicht ausgeführt werden: Der angegebene Ziel-Ursprung (origin - 'https://observablehq.com') stimmt nicht mit dem Empfängerfenster-Ursprung überein ('null'). worker.html
  3. Fehler beim Verarbeiten des Wertes für '-webkit-text-size-adjust'. Deklaration ignoriert. worker.html:6:846

thank you

​

Fil commented 3 years ago

I don't know. If access to localStorage is disabled for some reason, I suppose it would bring up this error. It works for me (with Firefox, in an incognito window).

FightingBugs commented 3 years ago

I think this is a good idea. My Ubuntu system with firefox sometimes disables localStorage. I will boot and try it again Thanks

FightingBugs commented 3 years ago

Having booted I saved the page again, closed and restarted the firefox and received a lot of warnings and one error message after reopening the page: 'postMessage' konnte auf 'DOMWindow' nicht ausgeführt werden: Der angegebene Ziel-Ursprung (origin - 'https://observablehq.com') stimmt nicht mit dem Empfängerfenster-Ursprung überein ('null'). worker.html

The message means postMessage could not be executed on DOMWindow. Origin and receiver are different.

Thanks

Fil commented 3 years ago

I'm sorry I don't know, I'll ask if someone has an idea. I'm keeping the issue closed since it seems related to observable and your browser, not to d3-force.