4 ms·

Strokes: Let's pretend D3 was written in ClojureScript

46 points by sebg 11y ago

mrcactu5 11y ago
I remember getting excited about functional approaches to d3, but then the excitement died down https://keminglabs.com/c2/ https://keminglabs.com/c2/ https://github.com/seliopou/elm-d3 https://github.com/seliopou/elm-d3 In all fairness mBostock works very hard on d3 and he is prolific at it as evidence by his bl.ocks.org pages but his library is very opinionated as well
- pyvpx 11y ago
  I got really excited reading about c2, and then saw on github the last update was two years ago. :(
- seliopou 11y ago
  Author of elm-d3 here. The project's still being maintained, but I've been slow to update it to 0.16 for a number of reasons. First, there's dealing with cabal hell after every release. Second, Elm's FFI is undocumented, so it's always a bit of a pain to dig into the internals get things working again. Second, most of my D3 efforts are now focused on ocaml-d3[0], which is the library that I use day-to-day for building front-end interfaces, not just visualizations. If there's somebody from the Elm community that would like to help out in maintaining elm-d3, let me know. Experience with the FFI that you can point to is required. [0]: https://github.com/seliopou/ocaml-d3 https://github.com/seliopou/ocaml-d3
- jdminhbg 11y ago
  Most of what C2 provided is now better-provided by React and a ClojureScript layer over top of it -- I upgraded my C2 project to use Reagent. I think this is actually why C2 is abandoned, although I don't know for sure.
  - lynaghk 11y ago
    I'm the author of C2, and you're exactly right. React provides everything that C2's underlying DOM manipulation library (https://github.com/lynaghk/singult/ https://github.com/lynaghk/singult/) does. React is faster, capable with more browsers, and has better API hooks that let callers control the low-level details.
    - jdminhbg 11y ago
      Oh nice, and thanks for C2. Really all I had to do was write my own scaling fn and just move the state into a Reagent atom and it all worked the same as before.
    - harperlee 11y ago
      Thanks for C2! I've just looked and it is indeed indicated as "Deprecated" in github, but in keminglabs.com it still states "C2 is a very early project, and there’s a lot left to do." Perhaps that could be updated... I remember some time ago I wondered this, and I didn't see the "Deprecated" in github, if it already was.
jbranchaud 11y ago
Is anyone working on a library similar to d3 that is written from the ground up in ClojureScript?
arohner 11y ago
I've recently had good success writing raw SVG from ClojureScript. What does D3 provide on top of that?
- pgbovine 11y ago
  a principled way to think about layering graphics and animations ... it's a bit higher level of abstraction than generating raw SVG. paper here: http://vis.stanford.edu/files/2011-D3-InfoVis.pdf http://vis.stanford.edu/files/2011-D3-InfoVis.pdf
- athenot 11y ago
  D3 provides bindings between data structures and DOM elements; that's where a lot of the power comes from, specifically for doing in-place updates. I've used d3 as a replacement for react and it performs quite well—though you have to be a bit more explicit when it comes to updates.
- cpbotha 11y ago
  Probably the most important innovation of d3 is the idea of the DOM - data join. Mike Bostock, handsome father of d3.js and maker of all that is pure and wonderful (I have the good fortune to spend lots of work time using d3), mentioned this himself during his reddit AMA, see https://www.reddit.com/r/dataisbeautiful/comments/3k3if4/hi_im_mike_bostock_creator_of_d3js_and_a_former/cuul8go https://www.reddit.com/r/dataisbeautiful/comments/3k3if4/hi_... In short, you get some data, you join it with a selection of wholly or partially non-existent DOM, and then you work with the enter (new), update (existing) and exit (not required for the new data) selection. This is an extremely powerful metaphor for representing data and performing dynamic data updates using arbitrary mixes of SVG (or any other DOM) elements. (oh, based on this mechanism, you can build really beautiful visual transitions) Here's a short introduction to the join idea in d3: https://bost.ocks.org/mike/join/ https://bost.ocks.org/mike/join/ BTW, programming in d3.js already feels a whole lot like programming in a functional language.
- coldtea 11y ago
  Literally, TONS. From handling mappings between ranges to converting geolocations, and from automatically keeping track of things added/removed from an SVG based diagram/plot to picking nice tick marks on your axis.
woah 11y ago
I like all the stuff that D3 has, but it's all done through the most obnoxious cute chaining API. Why can't a low level library have simple, if more verbose, normal function calls? I see that this thing doesn't try to solve the problem at all.
pandeiro 11y ago
toxi's thi-ng/geom[1] library deserves a mention in this space. [1]: https://github.com/thi-ng/geom https://github.com/thi-ng/geom
- reitzensteinm 11y ago
  I recently attended a workshop with Karsten (in fact, the last commit to geom was a small bugfix I authored there). He's a really smart guy and the amount of ground covered by the libraries is bewildering. Probably worth checking out the main site for an overview if you haven't seen it before: http://thi.ng/ http://thi.ng/
jraines 11y ago
the example links (s.trokes.org) are broken. HN hug? Although my browser is saying it's a DNS resolution issue.
- dribnet 11y ago
  sorry - s.trokes.org was just a clone of bl.ocks.org with syntax highlight support for clojure. I've updated the links to blocks and the examples are working again.

46 points by sebg 11y ago

I remember getting excited about functional approaches to d3, but then the excitement died down https://keminglabs.com/c2/ https://keminglabs.com/c2/ https://github.com/seliopou/elm-d3 https://github.com/seliopou/elm-d3 In all fairness mBostock works very hard on d3 and he is prolific at it as evidence by his bl.ocks.org pages but his library is very opinionated as well

pyvpx 11y ago
I got really excited reading about c2, and then saw on github the last update was two years ago. :(
seliopou 11y ago
Author of elm-d3 here. The project's still being maintained, but I've been slow to update it to 0.16 for a number of reasons. First, there's dealing with cabal hell after every release. Second, Elm's FFI is undocumented, so it's always a bit of a pain to dig into the internals get things working again. Second, most of my D3 efforts are now focused on ocaml-d3[0], which is the library that I use day-to-day for building front-end interfaces, not just visualizations. If there's somebody from the Elm community that would like to help out in maintaining elm-d3, let me know. Experience with the FFI that you can point to is required. [0]: https://github.com/seliopou/ocaml-d3 https://github.com/seliopou/ocaml-d3
jdminhbg 11y ago
Most of what C2 provided is now better-provided by React and a ClojureScript layer over top of it -- I upgraded my C2 project to use Reagent. I think this is actually why C2 is abandoned, although I don't know for sure.
- lynaghk 11y ago
  I'm the author of C2, and you're exactly right. React provides everything that C2's underlying DOM manipulation library (https://github.com/lynaghk/singult/ https://github.com/lynaghk/singult/) does. React is faster, capable with more browsers, and has better API hooks that let callers control the low-level details.
  - jdminhbg 11y ago
    Oh nice, and thanks for C2. Really all I had to do was write my own scaling fn and just move the state into a Reagent atom and it all worked the same as before.
  - harperlee 11y ago
    Thanks for C2! I've just looked and it is indeed indicated as "Deprecated" in github, but in keminglabs.com it still states "C2 is a very early project, and there’s a lot left to do." Perhaps that could be updated... I remember some time ago I wondered this, and I didn't see the "Deprecated" in github, if it already was.

jbranchaud 11y ago

Is anyone working on a library similar to d3 that is written from the ground up in ClojureScript?

arohner 11y ago

I've recently had good success writing raw SVG from ClojureScript. What does D3 provide on top of that?

pgbovine 11y ago
a principled way to think about layering graphics and animations ... it's a bit higher level of abstraction than generating raw SVG. paper here: http://vis.stanford.edu/files/2011-D3-InfoVis.pdf http://vis.stanford.edu/files/2011-D3-InfoVis.pdf
athenot 11y ago
D3 provides bindings between data structures and DOM elements; that's where a lot of the power comes from, specifically for doing in-place updates. I've used d3 as a replacement for react and it performs quite well—though you have to be a bit more explicit when it comes to updates.
cpbotha 11y ago
Probably the most important innovation of d3 is the idea of the DOM - data join. Mike Bostock, handsome father of d3.js and maker of all that is pure and wonderful (I have the good fortune to spend lots of work time using d3), mentioned this himself during his reddit AMA, see https://www.reddit.com/r/dataisbeautiful/comments/3k3if4/hi_im_mike_bostock_creator_of_d3js_and_a_former/cuul8go https://www.reddit.com/r/dataisbeautiful/comments/3k3if4/hi_... In short, you get some data, you join it with a selection of wholly or partially non-existent DOM, and then you work with the enter (new), update (existing) and exit (not required for the new data) selection. This is an extremely powerful metaphor for representing data and performing dynamic data updates using arbitrary mixes of SVG (or any other DOM) elements. (oh, based on this mechanism, you can build really beautiful visual transitions) Here's a short introduction to the join idea in d3: https://bost.ocks.org/mike/join/ https://bost.ocks.org/mike/join/ BTW, programming in d3.js already feels a whole lot like programming in a functional language.
coldtea 11y ago
Literally, TONS. From handling mappings between ranges to converting geolocations, and from automatically keeping track of things added/removed from an SVG based diagram/plot to picking nice tick marks on your axis.

woah 11y ago

I like all the stuff that D3 has, but it's all done through the most obnoxious cute chaining API. Why can't a low level library have simple, if more verbose, normal function calls? I see that this thing doesn't try to solve the problem at all.

pandeiro 11y ago

toxi's thi-ng/geom[1] library deserves a mention in this space. [1]: https://github.com/thi-ng/geom https://github.com/thi-ng/geom

reitzensteinm 11y ago
I recently attended a workshop with Karsten (in fact, the last commit to geom was a small bugfix I authored there). He's a really smart guy and the amount of ground covered by the libraries is bewildering. Probably worth checking out the main site for an overview if you haven't seen it before: http://thi.ng/ http://thi.ng/

jraines 11y ago

the example links (s.trokes.org) are broken. HN hug? Although my browser is saying it's a DNS resolution issue.

dribnet 11y ago
sorry - s.trokes.org was just a clone of bl.ocks.org with syntax highlight support for clojure. I've updated the links to blocks and the examples are working again.