5 ms·

Could anyone explain the benefit of using Dc.js vs google charts API or d3.js? Crossfilter seems really cool - but since it's another library, what is it that D

Could anyone explain the benefit of using Dc.js vs google charts API or d3.js? Crossfilter seems really cool - but since it's another library, what is it that Dc is offering?

Zikes 12y ago
Google Charts API is an external resource, and you're limited to the capabilities of that API, whereas d3.js lets you do just about anything you'd want to do with SVG/Canvas & javascript including animations and interactions. The benefits of crossfilter or dc.js over plain d3.js is the layer of abstraction making it easier to use.
- peterchon 12y ago
  I never understood why the external resource is such a concern for devs - most of your application will be online with online access. Google is not making a call out to send data, but to retrieve what it needs to render the different chart formats, it saves time.
  - pp19dd 12y ago
    Well, it's all fun and games with various APIs and remotely-hosted solutions, until those solutions start breaking and changing. For example, for awhile the news world loved making apps (simple infographics, interactives, etc) that used tabletop.js, which in turn pulled data from a google doc (spreadsheet, etc, which made it easier for text changes: programmers could program and editors could edit.) Then, bugs surfaced after google altered login procedures. What should have been a simple JSONP call was replaced with a broken login page being returned instead of JSONP, that is: only if you hadn't logged into your google account for awhile. People who've never logged in or were logged into a google service were fine. Then they started throttling connections - per computer, per account, random without announcing it, etc. Debugging these things was frustrating. So, in other words, a convenient feature becomes a liability very quickly.
gparted 12y ago
One reason: Not everyone has access to those services within the firewall, so it's nice to have this as an option.
- gparted 12y ago
  Just curious why this would be downvoted. I was trying to be helpful.
  - ludwigvan 12y ago
    Usually on mobile, people try to upvote, but accidentally downvote.
  - tinco 12y ago
    I think people downvoted you because you've misunderstood the question. Just trying to be helpful is not enough ;) (since the GP asked for both google charts and d3.js, the firewall answer was irrelevant)
zenocon 12y ago
see my post a couple down https://news.ycombinator.com/item?id=7868603 https://news.ycombinator.com/item?id=7868603 dc.js marries crossfilter.js with d3.js -- that's it in a nutshell. crossfilter allows you to group and filter your data in-memory very quickly, and potentially for a LOT of data See http://bl.ocks.org/milroc/7032589 http://bl.ocks.org/milroc/7032589 for a good intro to crossfilter (launch the demo on slide #39 -- loads 36M flight records). you likely already know what d3 does. dc.js makes it easy to generate dashboards where the user can interact with the charts (e.g. filter by Q1, Q2...see the NASDAQ example at https://dc-js.github.io/dc.js/ https://dc-js.github.io/dc.js/)
- peterchon 12y ago
  I guess there in lies my question - d3 makes it easy to marry the data to a dom, making it easy to add interactivity. So, i guess why would I chose to use Dc rather than to use d3 with crossfilter.js?
  - awjr 12y ago
    Dc provides a set of tools for very quick delivery of a set of charts married to a crossfilter. Most importantly it allows those charts to interact based on filters applied in one chart being reflected across all other charts. Of note Dc generates d3 charts...so you can manipulate them to your hearts content. In my case, part of the tabbing functionality (context switch) is to destroy any in memory crossfilters AND hunt through the DOM for any d3 svg elements and delete them to aid browser performance.
  - zenocon 12y ago
    Consider this example: https://square.github.io/crossfilter/#charts https://square.github.io/crossfilter/#charts and this example https://dc-js.github.io/dc.js/#yearly-bubble-chart https://dc-js.github.io/dc.js/#yearly-bubble-chart -- sure, you could probably do this without dc.js and crossfilter.js but it would be _a lot_ of work, and likely not re-usable. If you don't need interactive charts that you can drill-down into, don't use it. If you do, this is the best of breed right now for this kind of thing. dc.js doesn't abstract away the d3 api -- you can still use it to your hearts content, but it sure makes these kinds of examples really easy to spin up with minimal code.

Could anyone explain the benefit of using Dc.js vs google charts API or d3.js? Crossfilter seems really cool - but since it's another library, what is it that Dc is offering?

Zikes 12y ago

Google Charts API is an external resource, and you're limited to the capabilities of that API, whereas d3.js lets you do just about anything you'd want to do with SVG/Canvas & javascript including animations and interactions. The benefits of crossfilter or dc.js over plain d3.js is the layer of abstraction making it easier to use.

peterchon 12y ago
I never understood why the external resource is such a concern for devs - most of your application will be online with online access. Google is not making a call out to send data, but to retrieve what it needs to render the different chart formats, it saves time.
- pp19dd 12y ago
  Well, it's all fun and games with various APIs and remotely-hosted solutions, until those solutions start breaking and changing. For example, for awhile the news world loved making apps (simple infographics, interactives, etc) that used tabletop.js, which in turn pulled data from a google doc (spreadsheet, etc, which made it easier for text changes: programmers could program and editors could edit.) Then, bugs surfaced after google altered login procedures. What should have been a simple JSONP call was replaced with a broken login page being returned instead of JSONP, that is: only if you hadn't logged into your google account for awhile. People who've never logged in or were logged into a google service were fine. Then they started throttling connections - per computer, per account, random without announcing it, etc. Debugging these things was frustrating. So, in other words, a convenient feature becomes a liability very quickly.

gparted 12y ago

One reason: Not everyone has access to those services within the firewall, so it's nice to have this as an option.

gparted 12y ago
Just curious why this would be downvoted. I was trying to be helpful.
- ludwigvan 12y ago
  Usually on mobile, people try to upvote, but accidentally downvote.
- tinco 12y ago
  I think people downvoted you because you've misunderstood the question. Just trying to be helpful is not enough ;) (since the GP asked for both google charts and d3.js, the firewall answer was irrelevant)

zenocon 12y ago

see my post a couple down https://news.ycombinator.com/item?id=7868603 https://news.ycombinator.com/item?id=7868603 dc.js marries crossfilter.js with d3.js -- that's it in a nutshell. crossfilter allows you to group and filter your data in-memory very quickly, and potentially for a LOT of data See http://bl.ocks.org/milroc/7032589 http://bl.ocks.org/milroc/7032589 for a good intro to crossfilter (launch the demo on slide #39 -- loads 36M flight records). you likely already know what d3 does. dc.js makes it easy to generate dashboards where the user can interact with the charts (e.g. filter by Q1, Q2...see the NASDAQ example at https://dc-js.github.io/dc.js/ https://dc-js.github.io/dc.js/)

peterchon 12y ago
I guess there in lies my question - d3 makes it easy to marry the data to a dom, making it easy to add interactivity. So, i guess why would I chose to use Dc rather than to use d3 with crossfilter.js?
- awjr 12y ago
  Dc provides a set of tools for very quick delivery of a set of charts married to a crossfilter. Most importantly it allows those charts to interact based on filters applied in one chart being reflected across all other charts. Of note Dc generates d3 charts...so you can manipulate them to your hearts content. In my case, part of the tabbing functionality (context switch) is to destroy any in memory crossfilters AND hunt through the DOM for any d3 svg elements and delete them to aid browser performance.
- zenocon 12y ago
  Consider this example: https://square.github.io/crossfilter/#charts https://square.github.io/crossfilter/#charts and this example https://dc-js.github.io/dc.js/#yearly-bubble-chart https://dc-js.github.io/dc.js/#yearly-bubble-chart -- sure, you could probably do this without dc.js and crossfilter.js but it would be _a lot_ of work, and likely not re-usable. If you don't need interactive charts that you can drill-down into, don't use it. If you do, this is the best of breed right now for this kind of thing. dc.js doesn't abstract away the d3 api -- you can still use it to your hearts content, but it sure makes these kinds of examples really easy to spin up with minimal code.