5 ms·

AngularJS + D3.js = Radian

99 points by zzenon 13y ago

egeozcan 13y ago
This looks much more meaning fult than a div soup or even a proper table, I'd say. I'd definitely use it... > There are some contractual encumbrances that prevent us from open-sourcing it right now, but that may change at some point in the future ...only if it were open source.
- zzenon 13y ago
  You can always make your own d3 directives. Relevant "how-to" blog: http://briantford.com/blog/angular-d3.html http://briantford.com/blog/angular-d3.html
- ian-ross 13y ago
  I'm the author of Radian. We're working on making it open source. If it comes down to it, I may just buy the IP back from the company I developed it for. It's to their benefit to have the thing open (more eyes). The only people who might lose out are the company's current start-up funders, but it's pretty clear that Radian doesn't actually have that much value as a closed source product.
LAMike 13y ago
This will definitely make data visualization easier... I want to make a bitcoin graph with it!
jwr 13y ago
"Radian is currently proprietary. There are some contractual encumbrances that prevent us from open-sourcing it right now, but that may change at some point in the future." So why would this be interesting for HN readers? The idea isn't that revolutionary, and there is no code and no way for people to do much.
- tinco 13y ago
  Agh, read this after upvoting the article :(
- zzenon 13y ago
  "So why would this be interesting for HN readers?" To show what you can do with AngularJS directives and that combining it with D3.js it can be quite powerful (even without source code). Anybody who worked with D3.js, should know how much boilerplate code needs to be written to have a visualisation. By abstracting that code in directives, it allows users to use out-of-the-box d3.js graphs. Someone could go ever further to implement an "interface" to customize these graphs through angularjs. To anyone who's interested: I replied to another comment with a tutorial blog of how to create d3.js directives
lucisferre 13y ago
I've been building a lot of stuff with Angular and D3 lately, they make a good pair. The author has some good ideas here I'm looking forward to trying them out. The author may not be able to but I'll be perfectly happy to open source it.
tel 13y ago
Angular + d3 is beautiful. d3 is great but often far too low level and imperative (despite trying quite hard to be declarative). Wrapping d3 manipulations inside of Angular directives gives them a great deal of simplicity. I find myself creating all kinds of different classes of graphs, parameterizing them on HTML attributes, and dropping them into Angular scopes. With a little bit of careful throttling and $applying you can even get highly interactive d3 graphs.
- chevreuil 13y ago
  Agreed, Angular and d3 are two of the most beautiful and useful pieces of JS out there. Radian's approach is very inspiring for the ones that use both of these awesome libraries. But I find it too low level : I don't see the point of manipulating <dot> and <line> directives : is'nt it what SVG does already? I'd rather use a <barchart> or a <piechart> directive.
roozbeh18 13y ago
I totally understand mean and standard deviation now. :D
smrtinsert 13y ago
An excellent example of why HTML5 should have included namespaces. How would this validate or do people not care about that anymore?
- joshuacc 13y ago
  If you're referring to the custom elements, Angular will also let you do things in a way that validates. Something like: <div data-plot="height=3, width=3"></div>
  - ganarajpr 13y ago
    I think they dont.. ( atleast I dont!! ) Anyway see this article http://programming.oreilly.com/2013/04/stop-standardizing-html.html http://programming.oreilly.com/2013/04/stop-standardizing-ht...
  - warfangle 13y ago
    Yeah, you use the A (is for attribute) filter on the directive instead of the E (is for element) filter.
doobius 13y ago
my word the font on that article is hard on my eyes
arafalov 13y ago
There is also Dangle (https://github.com/fullscale/dangle https://github.com/fullscale/dangle), which is D3+Angular backed by ElasticSearch. So, if Radian cannot be open sourced, perhaps Dangle can pick up the slack.
- jcomis 13y ago
  Thanks for sharing this, looks really interesting.
dsadas 13y ago
dsadsad
dsadas 13y ago
dsadsad

99 points by zzenon 13y ago

This looks much more meaning fult than a div soup or even a proper table, I'd say. I'd definitely use it... > There are some contractual encumbrances that prevent us from open-sourcing it right now, but that may change at some point in the future ...only if it were open source.

zzenon 13y ago
You can always make your own d3 directives. Relevant "how-to" blog: http://briantford.com/blog/angular-d3.html http://briantford.com/blog/angular-d3.html
ian-ross 13y ago
I'm the author of Radian. We're working on making it open source. If it comes down to it, I may just buy the IP back from the company I developed it for. It's to their benefit to have the thing open (more eyes). The only people who might lose out are the company's current start-up funders, but it's pretty clear that Radian doesn't actually have that much value as a closed source product.

LAMike 13y ago

This will definitely make data visualization easier... I want to make a bitcoin graph with it!

jwr 13y ago

"Radian is currently proprietary. There are some contractual encumbrances that prevent us from open-sourcing it right now, but that may change at some point in the future." So why would this be interesting for HN readers? The idea isn't that revolutionary, and there is no code and no way for people to do much.

tinco 13y ago
Agh, read this after upvoting the article :(
zzenon 13y ago
"So why would this be interesting for HN readers?" To show what you can do with AngularJS directives and that combining it with D3.js it can be quite powerful (even without source code). Anybody who worked with D3.js, should know how much boilerplate code needs to be written to have a visualisation. By abstracting that code in directives, it allows users to use out-of-the-box d3.js graphs. Someone could go ever further to implement an "interface" to customize these graphs through angularjs. To anyone who's interested: I replied to another comment with a tutorial blog of how to create d3.js directives

lucisferre 13y ago

I've been building a lot of stuff with Angular and D3 lately, they make a good pair. The author has some good ideas here I'm looking forward to trying them out. The author may not be able to but I'll be perfectly happy to open source it.

tel 13y ago

Angular + d3 is beautiful. d3 is great but often far too low level and imperative (despite trying quite hard to be declarative). Wrapping d3 manipulations inside of Angular directives gives them a great deal of simplicity. I find myself creating all kinds of different classes of graphs, parameterizing them on HTML attributes, and dropping them into Angular scopes. With a little bit of careful throttling and $applying you can even get highly interactive d3 graphs.

chevreuil 13y ago
Agreed, Angular and d3 are two of the most beautiful and useful pieces of JS out there. Radian's approach is very inspiring for the ones that use both of these awesome libraries. But I find it too low level : I don't see the point of manipulating <dot> and <line> directives : is'nt it what SVG does already? I'd rather use a <barchart> or a <piechart> directive.

roozbeh18 13y ago

I totally understand mean and standard deviation now. :D

smrtinsert 13y ago

An excellent example of why HTML5 should have included namespaces. How would this validate or do people not care about that anymore?

joshuacc 13y ago
If you're referring to the custom elements, Angular will also let you do things in a way that validates. Something like: <div data-plot="height=3, width=3"></div>
- ganarajpr 13y ago
  I think they dont.. ( atleast I dont!! ) Anyway see this article http://programming.oreilly.com/2013/04/stop-standardizing-html.html http://programming.oreilly.com/2013/04/stop-standardizing-ht...
- warfangle 13y ago
  Yeah, you use the A (is for attribute) filter on the directive instead of the E (is for element) filter.

doobius 13y ago

my word the font on that article is hard on my eyes

arafalov 13y ago

There is also Dangle (https://github.com/fullscale/dangle https://github.com/fullscale/dangle), which is D3+Angular backed by ElasticSearch. So, if Radian cannot be open sourced, perhaps Dangle can pick up the slack.

jcomis 13y ago
Thanks for sharing this, looks really interesting.

dsadas 13y ago

dsadsad

dsadas 13y ago

dsadsad