I had the situation where I want to show Countries along the x (horizontal) axis, but for the drill down on the click event I wanted to use the Id for the item. The solution is surprisingly simple although did cause some head scratching for an hour or so.
We are going to store the additional information in an additional Y axis. To do so we need to tell the chart we are going to have an additional Y Value. The example below is for a Line chart, for other charts this might be different.
- Chart.Series["Series"].YValuesPerPoint = 2;
Then I am binding using Points.DataBind to bind the data. I have a dataset (items) with Destination which is my Country Name, DestinationId it’s primary key then PercentageErrorRate is my point on the graph.
- PercentErrorRateVTargetbyRAREgion.Series["ErrorRate"].YValuesPerPoint = 2;
- PercentErrorRateVTargetbyRAREgion.Series["ErrorRate"].Points.DataBind(items, "Destination", "PercentErrorRate,DestinationId", "");
On the y axis we are defining "PercentErrorRate,DestinationId" this list is comma delimited the first is the point shown on the graph then the rest can be accessed separately.
I am accessing this information on a click event, and have the following function.
- public static void SetAttributes(Chart chart, int year, string month, string countries)
- {
- foreach (Series series in chart.Series)
- {
- //I know this could be in one string but this is easier to read.
- var onclick = "Onclick=\"javascript:DundasHandler('" + chart.ID + "','#VALY2','" + year + "','" + month + "','" + countries + "','#SERIESNAME');\"";
- var onMouseOver = "OnMouseOver=\"javascript:DundasHandIn('" + chart.ID + "', 'pointer'); \"";
- var onMouseOut = "OnMouseOut=\"javascript:DundasHandOut('" + chart.ID + "'); \"";
- series.MapAreaAttributes = onclick + onMouseOut + onMouseOver;
- }
- }
The bit we are interested in is #VALY2 this tells Dundas to insert the y2 value here, in this case DestinationId. I then have a javascript function which opens a new window and builds the URL. I am using Telerik controls which is why I have radopen.
- function DundasHandler(chartName, point, year, month, country, seriesName) {
- var ownd = radopen("GridDialog.aspx?chartName=" + chartName + '&point=' + point + '&month=' + month + '&year=' + year + '&country=' + country + '&point2=' + seriesName, "RadWindow1");
- }
There you go I hope it helps.
No comments:
Post a Comment