Note: the example is a misconception and not what's meant by "binding to data." In D3, binding to data refers to using the `.data()` method to supply an object (typically an array) which you can then use in a function callback in the accessors, so like `.attr('x1', d => /* access the item here */)`. This allows you to easily and intuitively bind a dataset to a graphical representation and use its attributes to inform the properties of the visualization.
I'd also argue that D3 is no more verbose than vanilla JS (at least for this example). What's the alternative for creating a line in SVG?
This is very fair: I went for a metaphorical explanation, rather than a literal one. (For instance, I'd actually have had to write down the code for an SVG, and I was quickly writing this on my lunch break).
The `.selectAll().data().join()` data binding method (or `.enter()` on older versions) is very intuitive once you understand it, but for the layman coming in, it's inaccessible AF. I fudged a little in my explanation to make it more accessible. But hey. That's learning.
I am still proud of the D3 gadget I made about 8 years back as a green web dev. Couldn't have made it any other way, not sure if I could with any other library today. Wouldn't want to do it again, though, unless I was a dedicated front-end guy.
biowaffeln · 38m ago
recently i've been having a lot of success with working with d3 + solid.js. I use d3 as the data processing layer, and solid for actually rendering svgs from the data. the combination is lovely, you get all the power of d3, while the parts that usually end up verbose are written succinctly in jsx. and it's a lot less pain than doing it in react, because the mental models of solid/d3 feel much more aligned
TheHeasman · 31s ago
I'll check that out. At the moment I'm just building up a bunch of template code which I'll re-use. But might check out solid.js.
esafak · 1h ago
I feel like D3 ought to be the for-computer substrate for libraries that are actually for humans.
I suppose it matters less now in the LLM age.
lionkor · 51m ago
If your LLM is the only one that can reasonably maintain your software, you essentially created a new kind of lock-in, similar to what we already solved with open source a long, long time ago.
Once your LLM gets too expensive, goes out of business, and the competitors just don't quite do it the way your favorite LLM does it, you have a problem.
esafak · 49m ago
Speaking for myself, when it comes to D3 the problem is being locked out :)
thrown-0825 · 10m ago
I love D3, but its a library not a language.
TheHeasman · 7m ago
Agreed. I fudged quite a lot in my post to make it accessible to the layman. Trying to explain to a UX designer I know that "D3 is a library for JavaScript that..." And I saw their brain switch off live in front of me.
Semantics matter more than literals sometimes.
z3ratul163071 · 26m ago
the author was inspired by early directx apis
moron4hire · 1h ago
This is why I've always found it weird that people consider D3 to be a charting tool. Yes, people have used it to build a lot of charts, but it's really just a streaming data processing tool. It doesn't provide anything specific to charting[0]. All of that part, you're still left to figure out on your own.
[0] At least in the core, I'm not too familiar with the full ecosystem and what is considered official in terms of plugins. Everytime I've tried to use it, I've not found the documentation leading me to using anything more specifically oriented towards charting.
TheHeasman · 2m ago
Yaaasss. I think of it as being able to use a pencil to draw charts (and do creative stuff like Florence Nightingale's original polar area graph), instead of having a stencil that can draw things for you. It's a way to visually manipulate the DOM in a way if you're comfortable with data.
You can simply just use Tableau or Power BI and take screenshots otherwise.
digitalWestie · 47m ago
This is the answer. People need to consider D3 more as a graphics/dom manipulation library than a charting library.
No comments yet
yieldcrv · 27m ago
D3 is painful, we don't have to appeal to authority to admit that.
Mike Bostock is an interesting person, and a case study in why don't design languages from a single person's genius.
balamatom · 1h ago
I'd say because JavaScript is insufficiently expressive. No macros, no arrow operator, and the premier way of writing it 4x as verbose than what I'd consider reasonable. D3 is a great library though.
TheHeasman · 5m ago
Uh, there are arrow operators in JS. D3.JS in Action Third Edition exclusively uses arrow operators.
(Trust me. I don't know jack about JavaScript, I had to get through the MDN docs to understand what they were, and once I did, made a whole lot more sense).
Something like a(b(c(d(e(7)))))) in Javascript could be written (-> 7 e d c b a) in Clojure?
lionkor · 49m ago
Maybe overloadable operators like in C++, where -> usually demotes some kind of deeper access into the object or abstraction? Or, the opposite, and abstracted access.
I'd also argue that D3 is no more verbose than vanilla JS (at least for this example). What's the alternative for creating a line in SVG?
The `.selectAll().data().join()` data binding method (or `.enter()` on older versions) is very intuitive once you understand it, but for the layman coming in, it's inaccessible AF. I fudged a little in my explanation to make it more accessible. But hey. That's learning.
I am still proud of the D3 gadget I made about 8 years back as a green web dev. Couldn't have made it any other way, not sure if I could with any other library today. Wouldn't want to do it again, though, unless I was a dedicated front-end guy.
I suppose it matters less now in the LLM age.
Once your LLM gets too expensive, goes out of business, and the competitors just don't quite do it the way your favorite LLM does it, you have a problem.
Semantics matter more than literals sometimes.
[0] At least in the core, I'm not too familiar with the full ecosystem and what is considered official in terms of plugins. Everytime I've tried to use it, I've not found the documentation leading me to using anything more specifically oriented towards charting.
You can simply just use Tableau or Power BI and take screenshots otherwise.
No comments yet
Mike Bostock is an interesting person, and a case study in why don't design languages from a single person's genius.
(Trust me. I don't know jack about JavaScript, I had to get through the MDN docs to understand what they were, and once I did, made a whole lot more sense).
https://blog.frankel.ch/learning-clojure/2/
Something like a(b(c(d(e(7)))))) in Javascript could be written (-> 7 e d c b a) in Clojure?