3 ms·

I don't get what the author is complaining about, D3 has great documentation on GitHub; With or without Observable the way to use D3 is pretty much the same. Y

by kesor 5y ago

I don't get what the author is complaining about, D3 has great documentation on GitHub; With or without Observable the way to use D3 is pretty much the same. Yes, the best tutorials for D3 are on Observable; But translating these to pure JavaScript is trivial for anyone who knows some basic javascript syntax. Those who have zero experience with using JavaScript in the first place should first learn the language, and only then try and attempt at using the more advanced libraries such as D3. It is going to be a real pain to try and get anything done with D3 without understanding some basic JavaScript syntax first.

guru-mediation 5y ago
Not only that but: "You can download the vanilla JavaScript for any notebook by clicking Download Code in the notebook menu." So... you don't even have to do the trivial transform yourself. Provided those kinds of tools remain available I'm struggling to see the problem. I think obervable is coming from a good place and committed to making their tech as accessable as possible overall. I'm sure there's plenty of less technical users who would have shied away from just a github homepage that might get into it now.
- throwawaybutwhy 5y ago
  I have tried just that, and the resulting code is underwhelming, to the tune of 'import antigravity': <div id="observablehq-chart-6aa5c38e"></div> <p>Credit: <a href="https://observablehq.com/@d3/contours">Contours by D3</a></p> <script type="module"> import {Runtime, Inspector} from "https://cdn.jsdelivr.net/npm/@observablehq/runtime@4/dist/runtime.js"; import define from "https://api.observablehq.com/@d3/contours.js?v=3"; new Runtime().module(define, name => { if (name === "chart") return new Inspector(document.querySelector("#observablehq-chart-6aa5c38e")); }); </script>
  - jacobolus 5y ago
    The result is: import the open-source Observable runtime and then use it to run the reactive notebook code. What else would you expect? The reactive notebook code is written to work when run against the runtime. If you want to translate it to run in a different context where there is no reactivity, you are going to need to read the code and modify the parts that depend on that reactivity. For example, if a cell depends on a variable that was set to be the reactive output of an HTML slider, then you are going to need to put the slider separately into your page, and write the code yourself to hook up the slider’s event handling logic. This is not too difficult, but the notebook version is typically nicer and more legible.

by kesor 5y ago

guru-mediation 5y ago

Not only that but: "You can download the vanilla JavaScript for any notebook by clicking Download Code in the notebook menu." So... you don't even have to do the trivial transform yourself. Provided those kinds of tools remain available I'm struggling to see the problem. I think obervable is coming from a good place and committed to making their tech as accessable as possible overall. I'm sure there's plenty of less technical users who would have shied away from just a github homepage that might get into it now.

throwawaybutwhy 5y ago
I have tried just that, and the resulting code is underwhelming, to the tune of 'import antigravity': <div id="observablehq-chart-6aa5c38e"></div> <p>Credit: <a href="https://observablehq.com/@d3/contours">Contours by D3</a></p> <script type="module"> import {Runtime, Inspector} from "https://cdn.jsdelivr.net/npm/@observablehq/runtime@4/dist/runtime.js"; import define from "https://api.observablehq.com/@d3/contours.js?v=3"; new Runtime().module(define, name => { if (name === "chart") return new Inspector(document.querySelector("#observablehq-chart-6aa5c38e")); }); </script>
- jacobolus 5y ago
  The result is: import the open-source Observable runtime and then use it to run the reactive notebook code. What else would you expect? The reactive notebook code is written to work when run against the runtime. If you want to translate it to run in a different context where there is no reactivity, you are going to need to read the code and modify the parts that depend on that reactivity. For example, if a cell depends on a variable that was set to be the reactive output of an HTML slider, then you are going to need to put the slider separately into your page, and write the code yourself to hook up the slider’s event handling logic. This is not too difficult, but the notebook version is typically nicer and more legible.