search

vasturiano / 3d-force-graph

3D force-directed graph component using ThreeJS/WebGL
https://vasturiano.github.io/3d-force-graph/example/large-graph/
MIT License
4.77k stars 832 forks source link

Offline web page use #503

Open ben-s-e opened 3 years ago

ben-s-e commented 3 years ago

I have 3d-force-graph working on a web page, displayed in a browser. Currently I import the library as:

<head> ... <script src="https://unpkg.com/3d-force-graph"></script> </head>

(note: the https: seems to be required, omitting it, as in the library documentation, does not work for me). This is fine, but it requires an active internet connection to retrieve the library.

I would like the HTML page to work offline, and also I would like to preserve the version of 3d-force-graph that I know works with my application (whereas I presume the most recent version is always downloaded from unpkg).

What is the correct way to locally import 3d-force-graph into an HTML page?

When I have mygraph.html and the 3d-force-graph cloned repo folder in the same directory, the following very basic javascript import does not work:

<script src="3d-force-graph/src/3d-force-graph.js"></script>

Thanks for your help

vasturiano commented 3 years ago

@ben-s-e you'd need to download the bundled code file (not the source code, that is not browser ready (UMD)) and import that file in your script tag.

For example https://unpkg.com/3d-force-graph currently resolves to https://unpkg.com/3d-force-graph@1.70.5/dist/3d-force-graph.min.js and that's the bundled file you should download and include.

Additionally if you'd like to pin the version imported dynamically from unpkg, you can set that in the script URL, f.e.:

<script src="https://unpkg.com/3d-force-graph@1.70.0"></script>

And if you leave the https: out it just means to reuse whatever http protocol you webpage is already using, to avoid mixing protocols. So if it doesn't work, it possibly means you're not using https in your web server.

ben-s-e commented 2 years ago

Thanks for the fix. Regarding the https: issue, my graph is on a static HTML page on the local file system and launches through a file:/// protocol. In this esoteric case, I found https: to be required in the script include.