Having hard time to understand d3.js logic

[EthernalHusky]

Well my problem is that I am interested in learning d3.js in https://d3js.org/ and site said that all I need to start coding is to add this:

<script src="https://d3js.org/d3.v7.min.js"></script>

but when I click examples it leads me to Gallery / D3 / Observable which is confusing for me and when I download source code of graphs, code DOES NOT HAVE ANY:

<script src="https://d3js.org/d3.v7.min.js"></script>

just a runtime.js and stuff like observable stuff.

How can I give usefulness to

<script src="https://d3js.org/d3.v7.min.js"></script>

because downloaded code from examples does not have it. I mean after all I just want to learn d3.js not observable stuff because I find this complex. Or are you linked to d3.js?

[martinnormark]

D3.js was originally created by Mike Bostock, who founded ObservableHQ. So the two are at least related.

D3.js is baked into Observable, meaning you don’t have to do any imports in a notebook to start using D3.

If you want to play around with data visualisation I can highly recommend doing it here in Observable notebooks. You get a lot of things for free and the documentation is really good. Use the Snippets pane at upper right side of your notebook to help insert charts, input elements, tables etc:

Anyway, if you want to start in a flat HTML file, the gist here will get you started: Minimal D3 Example · GitHub

[mootari]

Note that some of the examples have been rewritten to make them easier to use outside of Observable. You can find an overview of these updated charts here:

D3 Charts