Drill Down Charts
There should be drill down facility charts. If I have a pie chart in which I have two data "Desktop" and "Mobile". If I click on "Mobile" part in pie chart it should redirect to column graph or bar graph (whichever i specify) and list ll the mobile device I had used.
Drill down charts are natively supported since 3.0.7
-
Jason Michael Nett commented
Thank you, that appears to produce the effect I'm looking for.
-
@Jason, it is settable from the outside, see http://api.highcharts.com/highcharts#drilldown.activeAxisLabelStyle
-
Jason commented
Nevermind. I found that the dark blue color #0d233a is actually hard coded into drilldown.js. Making that adjustable is my suggestion.
-
Jason commented
If you look at your example: http://www.highcharts.com/demo/column-drilldown/gray
and look at the darker colored themes, notice how the column title on the x-axis and the value on the bar (before any drill down) is set to a dark blue color that is difficult or impossible to read. After drilling down, the colors change the the gray they are set to. After much effort, I cannot figure out how to change that dark blue text color. None of the normal ways seems to have any effect.
For example, in the following, I can rotate the data values, which which suggest that I would be able to change the color from the same place, but I cannot. It always remains the dark blue.
plotOptions: {
series: {
borderWidth: 0,
dataLabels: {
enabled: false, // Show column values in-graph
rotation: -90,
color: '#999',
align: 'left',
style:
{
fontSize: '10px',
fontFamily: 'Ariel, Helvetica',
fontColor: 'white',
},
}
}, -
Anonymous commented
Hi, I am new to this place. Can we do something like this - http://www.adobe.com/devnet-apps/flex/tourdeflex/web/ (Other Components -> Chart Extensions -> Chart Drilldown Animations) for both Bar and Pie charts
-
You probably want to use the point.click event. See http://highcharts.com/ref/#plotOptions-pie-events--click.
Also, you have point seletion modes. Check out http://highcharts.com/ref/#plotOptions-pie--allowPointSelect and the associated events, http://highcharts.com/ref/#plotOptions-pie-point-events--select and http://highcharts.com/ref/#plotOptions-pie-point-events--unselect
-
MathiasG commented
I have got the click event to work, but that only works when clicking the background. I am doing rendering pie charts, and I'm unable to use the "selection" event. How do I do a drill down on a pie chart? The documentation states the "selection" event only works when specifying the zoomType (x for example). But that does not apply on a pie chart. Can anyone help? It seems strange that it is so difficult to do a drill down. Side note: I also think it's strange that the "click" event only works on the background. There should be a click event that if captured whenever they click anywhere on the canvas.
-
MathiasG commented
It appears to me that there needs to be an event listener called "dblclick" that allows for double clicking a specific chart area. The current "click" listener is restricted to only the plot background - which serves no purpose. While the "selector" listener requires a user to drag over a chart area - not very user friendly.
-
MathiasG commented
I see what it's doing. The callback method is fired when clicking the label, not that actual pie segment. is there a way to do a drill down on the pie segments itself?
-
MathiasG commented
Ok, I think I see how it works. But I'm having problems implementing it. I have this within my chart: {}
events: { click: callBackMethod }
But the callBackMethod() does not get fired when clicking the section of the pie. Any ideas? -
See http://highcharts.com/studies/drilldown.htm for a live demonstration
-
MathiasG commented
Can you provide a simple example of how to use a callback to simulate a drill down?
-
ph1g commented
This can be accomplished by adding callbacks on click events.