Convert D3 Observable to standalone webpage - like blocks.org?

Viewed 3873
2 Answers

Sadly, it's not that easy any more.

They have "archived" bl.ocks.org and are pushing the adoption of ObservableHQ notebooks. You can actually embed notebooks with a little effort, but they are served from https://api.observablehq.com. There are other options, but nothing that lets you easily pull out the html, javascript and css and host it yourself, as bl.ocks.org did. At best, you'll have to cobble a bunch more stuff together now. One method is to click the top-right context menu on some notebooks and select Export > Download code. Another possible option is this tool.

< relevant-humble-opinion > I don't know if d3 bl.ock.org examples just got so good that the suits moved in... or if Mike Bostock (our story's hero) really believed we needed "dataflow"... but things look bad from here... nothing good seems to last... < /relevant-humble-opinion >

On an Observable example page, I clicked the triple three dots next to the fork option. Then chose export and then "download code". I extracted the tar file to a folder on my machine. In the Readme it suggests that you run $ npx http-server in a terminal, to run a local server on your machine. Open up the location in your browser and it should show nearly the same thing as a web page. It should be close enough to what you are looking for.

Observable page used Reusable Choropleth Map

Related