4 ms·

Is anybody else annoyed by how tightly coupled D3.js is with https://observablehq.com https://observablehq.com? It's basically impossible to get started with D

Is anybody else annoyed by how tightly coupled D3.js is with https://observablehq.com https://observablehq.com? It's basically impossible to get started with D3 without using the Observable online playground, I find it so frustrating.

helaoban 6y ago
What’s stopping you from just pulling d3 from a cdn or npm and just hacking away like any js lib?
deleted 6y ago
[deleted]
deleted 6y ago
[deleted]
contrast 6y ago
D3 was around for years before Observable, there’s plenty of books and tutorials around that don’t use Observable, it’s an open source library that doesn’t need Observable, and there must be plenty of people like me using D3 in production code today that didn’t learn it using Observable. It simply is not “tightly coupled”. It is very straightforward to get started without using Observable. Observable does exist, it is related to D3. It is “loosely coupled” in metaphorical terms because there are no dependencies in the code. It seems like a useful tool. Is the nature of your complaint that the team provided a learning environment alongside D3? That they recommend their learning & collaboration platform as well as their vis library? These strike me as good things to do. I’ve certainly thought of other people’s Observables as valuable resources.
curran_k 6y ago
Try https://vizhub.com/ https://vizhub.com/
alphachloride 6y ago
Conversely, I just use a code editor, a web browser, and the refresh button. I've never felt the need to use something like ObservableHQ, before and after it came into being.
jiofih 6y ago
Hmm no. It is not coupled to Observable at all, what problems exactly are you facing to use it elsewhere?
- jakecopp 6y ago
  Both the introduction link [1] and examples link [2] on the D3 homepage [3] and Github [4] only shows sketches on Observable - is there any official D3 getting started documentation not on Observable? Similar frustations are aired in a forum post: "I want to learn D3. I don`t want to learn Observable. Is that ok?" [5]. [1]: https://observablehq.com/@d3/learn-d3 https://observablehq.com/@d3/learn-d3 [2]: https://observablehq.com/@d3/gallery https://observablehq.com/@d3/gallery [3]: https://d3js.org/ https://d3js.org/ [4]: https://github.com/d3/d3/wiki https://github.com/d3/d3/wiki [5]: https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-want-to-learn-observable-is-that-ok/1957 https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-w...
  - addicted 6y ago
    The vast majority of library documentation of even major libraries is simply text with no playground. The fact that they’ve made the effort to add a playground by leveraging a fairly easy to use tech should not be held against the open source maintainers! Besides, all those examples are trivially reproducible locally, the way you would have to do it for the vast majority of languages which don’t give such fancy interactivity in their tutorials.
- soul_grafitti 6y ago
  I am a fan of D3 and Mike but I also agree with the point - it's not at all simple to take the examples from Observable and implement them in a non-Observable page. Or maybe it is simple but it's not intuitive unless you are familiar with Observable. So perhaps the solution is to have a page that describes how to move the examples from Observable to an HTML page? eg. where to put the scripts and where to put the HTML.
jwilber 6y ago
I disagree for two reasons: 1. There are multiple online/physical books about D3, online tutorials/courses on YouTube/udemy/etc., blog-posts, blockbuilder.org (deprecated but still useful), and the d3 documentation itself, all of which aren’t tied to observable. 2. I do agree that observable is a bit difficult to use when you first try it, but if the issue is porting a d3 example to an index.html, you need only remove a few lines of observable scaffolding to do so. This is a far cry from, “basically impossible.”
- jakecopp 6y ago
  I disagree with both of your points. I know it's hard to refute your first point as you could point to any example, but if I'm just trying to follow the happy, well-trodden path it's hard. Eg. I go to D3 website [1], I click "documentation" link [2] in header which takes me to the Github, I click the first link "introduction" and the page is actually hosted on Observable [3]. If I click on the "examples" link on the Github or website...it takes me back to observable.org gallery!! [4] This forum thread (on Observable) summarised exactly what I was thinking: "I want to learn D3. I don`t want to learn Observable. Is that ok?" [5] One person asks "Why can we not simply download vanilla code examples without any “Observableness” in them?" The reply by Mike is dismissive of their viewpoint and basically says learning D3 outside of Observable isn't supported: > We recognize that this is a change and a disruption: a new thing to learn. And we need to do a better job of helping you learn Observable (and explaining why you should bother). > Yet despite our shortcomings, we fundamentally believe that Observable is a better way to code 2: easier to understand, easier to tinker, easier to adapt and reuse, easier to collaborate and share. Maybe basically impossible isn't the right description, but they don't make it easy to get started without using Observable. On your second point, here is a HN discussion [6] on why Observable isn't JS. Observable has a _whole standard library_ [7]. Porting from Observable to vanilla JS is not just "removing a few lines of observable scaffolding". [1]: https://d3js.org/ https://d3js.org/ [2]: https://github.com/d3/d3/wiki https://github.com/d3/d3/wiki [3]: https://observablehq.com/@d3/learn-d3 https://observablehq.com/@d3/learn-d3 [4]: https://observablehq.com/@d3/gallery https://observablehq.com/@d3/gallery [5]: https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-want-to-learn-observable-is-that-ok/1957 https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-w... [6]: https://news.ycombinator.com/item?id=20184181 https://news.ycombinator.com/item?id=20184181 [7]: https://github.com/observablehq/stdlib/blob/master/README.md https://github.com/observablehq/stdlib/blob/master/README.md
quda 6y ago
I agree. Very hard to decouple the example from the bloody Observablabla and an implement in your own app.

helaoban 6y ago

What’s stopping you from just pulling d3 from a cdn or npm and just hacking away like any js lib?

deleted 6y ago

[deleted]

deleted 6y ago

[deleted]

contrast 6y ago

D3 was around for years before Observable, there’s plenty of books and tutorials around that don’t use Observable, it’s an open source library that doesn’t need Observable, and there must be plenty of people like me using D3 in production code today that didn’t learn it using Observable. It simply is not “tightly coupled”. It is very straightforward to get started without using Observable. Observable does exist, it is related to D3. It is “loosely coupled” in metaphorical terms because there are no dependencies in the code. It seems like a useful tool. Is the nature of your complaint that the team provided a learning environment alongside D3? That they recommend their learning & collaboration platform as well as their vis library? These strike me as good things to do. I’ve certainly thought of other people’s Observables as valuable resources.

curran_k 6y ago

Try https://vizhub.com/ https://vizhub.com/

alphachloride 6y ago

Conversely, I just use a code editor, a web browser, and the refresh button. I've never felt the need to use something like ObservableHQ, before and after it came into being.

jiofih 6y ago

Hmm no. It is not coupled to Observable at all, what problems exactly are you facing to use it elsewhere?

jakecopp 6y ago
Both the introduction link [1] and examples link [2] on the D3 homepage [3] and Github [4] only shows sketches on Observable - is there any official D3 getting started documentation not on Observable? Similar frustations are aired in a forum post: "I want to learn D3. I don`t want to learn Observable. Is that ok?" [5]. [1]: https://observablehq.com/@d3/learn-d3 https://observablehq.com/@d3/learn-d3 [2]: https://observablehq.com/@d3/gallery https://observablehq.com/@d3/gallery [3]: https://d3js.org/ https://d3js.org/ [4]: https://github.com/d3/d3/wiki https://github.com/d3/d3/wiki [5]: https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-want-to-learn-observable-is-that-ok/1957 https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-w...
- addicted 6y ago
  The vast majority of library documentation of even major libraries is simply text with no playground. The fact that they’ve made the effort to add a playground by leveraging a fairly easy to use tech should not be held against the open source maintainers! Besides, all those examples are trivially reproducible locally, the way you would have to do it for the vast majority of languages which don’t give such fancy interactivity in their tutorials.
soul_grafitti 6y ago
I am a fan of D3 and Mike but I also agree with the point - it's not at all simple to take the examples from Observable and implement them in a non-Observable page. Or maybe it is simple but it's not intuitive unless you are familiar with Observable. So perhaps the solution is to have a page that describes how to move the examples from Observable to an HTML page? eg. where to put the scripts and where to put the HTML.

jwilber 6y ago

I disagree for two reasons: 1. There are multiple online/physical books about D3, online tutorials/courses on YouTube/udemy/etc., blog-posts, blockbuilder.org (deprecated but still useful), and the d3 documentation itself, all of which aren’t tied to observable. 2. I do agree that observable is a bit difficult to use when you first try it, but if the issue is porting a d3 example to an index.html, you need only remove a few lines of observable scaffolding to do so. This is a far cry from, “basically impossible.”

jakecopp 6y ago
I disagree with both of your points. I know it's hard to refute your first point as you could point to any example, but if I'm just trying to follow the happy, well-trodden path it's hard. Eg. I go to D3 website [1], I click "documentation" link [2] in header which takes me to the Github, I click the first link "introduction" and the page is actually hosted on Observable [3]. If I click on the "examples" link on the Github or website...it takes me back to observable.org gallery!! [4] This forum thread (on Observable) summarised exactly what I was thinking: "I want to learn D3. I don`t want to learn Observable. Is that ok?" [5] One person asks "Why can we not simply download vanilla code examples without any “Observableness” in them?" The reply by Mike is dismissive of their viewpoint and basically says learning D3 outside of Observable isn't supported: > We recognize that this is a change and a disruption: a new thing to learn. And we need to do a better job of helping you learn Observable (and explaining why you should bother). > Yet despite our shortcomings, we fundamentally believe that Observable is a better way to code 2: easier to understand, easier to tinker, easier to adapt and reuse, easier to collaborate and share. Maybe basically impossible isn't the right description, but they don't make it easy to get started without using Observable. On your second point, here is a HN discussion [6] on why Observable isn't JS. Observable has a _whole standard library_ [7]. Porting from Observable to vanilla JS is not just "removing a few lines of observable scaffolding". [1]: https://d3js.org/ https://d3js.org/ [2]: https://github.com/d3/d3/wiki https://github.com/d3/d3/wiki [3]: https://observablehq.com/@d3/learn-d3 https://observablehq.com/@d3/learn-d3 [4]: https://observablehq.com/@d3/gallery https://observablehq.com/@d3/gallery [5]: https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-want-to-learn-observable-is-that-ok/1957 https://talk.observablehq.com/t/i-want-to-learn-d3-i-don-t-w... [6]: https://news.ycombinator.com/item?id=20184181 https://news.ycombinator.com/item?id=20184181 [7]: https://github.com/observablehq/stdlib/blob/master/README.md https://github.com/observablehq/stdlib/blob/master/README.md

quda 6y ago

I agree. Very hard to decouple the example from the bloody Observablabla and an implement in your own app.