Pie chart point click event

Sep 3, 2012 at 7:29 PM
Edited Sep 4, 2012 at 3:32 PM

I am trying to create a pie chart that allows the user to click a section of the chart to navigate to a details page. I have search through several forums trying to find an answer, but have yet to find one. I am new to MVC3, java script, and jquery, that is why I am trying to use this library. BTW I realize that the code in the AddJavascripFunction is not correct, that is just the desired functionality. Any help would be appreciated. Below is the code to my controller:

public ActionResult Dashboard()
{
     Highcharts chart = new Highcharts("chart")
          .InitChart(new Chart
                {
  BorderWidth = 0, BorderRadius = 15, PlotBackgroundColor = null, PlotShadow = false, PlotBorderWidth = 0, Events = new ChartEvents { Click = "@Navigate()" }, BackgroundColor = new BackColorOrGradient(new Gradient { LinearGradient = new[] { 0, 0, 0, 400 }, Stops = new object[,] { { 0, Color.FromArgb(255, 96, 96, 96) }, { 1, Color.FromArgb(255, 16, 16, 16) } }
}), }) .SetCredits(new Credits { Enabled = false }) .SetOptions(new GlobalOptions { Colors = new[] {
  ColorTranslator.FromHtml("#DDDF0D"), ColorTranslator.FromHtml("#7798BF"), ColorTranslator.FromHtml("#55BF3B"), ColorTranslator.FromHtml("#DF5353"), ColorTranslator.FromHtml("#DDDF0D"), ColorTranslator.FromHtml("#aaeeee"), ColorTranslator.FromHtml("#ff0066"), ColorTranslator.FromHtml("#eeaaee") } }) .SetTitle(new Title { Text = "Devices Not Responding", Style = "color: '#FFF', font: '16px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'" }) .SetTooltip(new Tooltip { Formatter = "function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; }" }) .SetPlotOptions(new PlotOptions { Pie = new PlotOptionsPie { AllowPointSelect = true, Cursor = Cursors.Pointer, DataLabels = new PlotOptionsPieDataLabels { Color = ColorTranslator.FromHtml("#000000"), ConnectorColor = ColorTranslator.FromHtml("#000000"), Formatter = "function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; }" } } }) .SetSeries(new Series { Type = ChartTypes.Pie, Name = "Browser share", Data = new Data(new object[] { new DotNet.Highcharts.Options.Point { Name = "Responding", Y = 40, Sliced = true, Selected = true, Color = Color.Gray, }, new DotNet.Highcharts.Options.Point { Name = "Not Responding" , Y = 60, Color = Color.Black, Events = new PointEvents {Click = "PieClickEvent"} } }) }).AddJavascripFunction("PieClickEvent", @Html.Action("PlotBandEvents", "Dashboard")); return View(chart); }
Aug 6, 2013 at 4:08 PM
Hye !

It seems a solution has been found :

http://dotnethighcharts.codeplex.com/discussions/358783