Drill down chart in angular

Question

I want to have a column chart in my angular app that could be drilled down to a line chart. I think the main problem is to be able to handle click event on each column that I could not find it highchart nor angular-chart. Can you tell me a way to construct such thing?

Is it the one http://jsfiddle.net/pablojim/Cp73s/?? – Reena Apr 15 '15 at 10:44 — Reena, Apr 15 '15 at 10:44
I see nothing in this link :-? – RezKesh Apr 15 '15 at 12:27 — RezKesh, Apr 15 '15 at 12:27

mike-schultz · Answer 1 · 2015-04-15T15:30:16.417

6

ZingChart has an Angular directive that works well with your use case. You can use the directive with ZingChart's internal events to bind to just about anything on the chart :

zingchart.node_click = function(p) {
  ....
}

Demo : http://jsfiddle.net/mschultz/ck84wjce/

Angular Directive: https://github.com/zingchart/ZingChart-AngularJS

Docs : http://www.zingchart.com/docs/api/api-events/

It can also perform drilldowns fairly easily across different types of charts: http://www.zingchart.com/blog/2014/09/02/chart-drilldown-interactive-feature/

If you need any help, feel free to reach out - I work for the ZingChart team!

edited Apr 15 '15 at 15:30

answered Apr 15 '15 at 15:22

mike-schultz

2,354
10
13

Is it free to use? Is it open source? – RezKesh Apr 26 '15 at 14:51
It is not open source, but it is free to use with the watermark. We do offer paid packages with support and without the watermark for commercial and enterprise use as well. – mike-schultz Apr 27 '15 at 15:09

score 0 · Answer 2 · answered Jul 20 '22 at 08:41

0

Check out this page for an example on Angular Drill Down chart using CanvasJS Angular Chart. It also includes angular source code or download angular sample from download page.

Check this StackBlitz for a simple example.

answered Jul 20 '22 at 08:41

Vishwas R

3,340
1
16
37

Drill down chart in angular

2 Answers2