HighCharts и MVC: как загрузить полное определение графика и данные с помощью JSON?

Я хотел бы знать, как можно загрузить параметры и граф данных или всю структуру графа, возвращающую объект JSON?

В частности, я хотел бы динамически создавать параметры, категории, оси, данные и т. д. с помощью JSON; Я думаю, что это возможно, но я нашел только информацию, описывающую, как загружать данные и серии, а не параметры.

Например, я хотел бы определить title, xAxis и т. д., возвращая объект JSon:

 [...]

  title: {
     text: 'Total fruit consumtion, grouped by gender'
  },
  xAxis: {
     categories: []
  }, 

 [...]

В частности, мне нужно динамически создать более сложный график, подобный этому: http://www.highcharts.com/demo/column-stacked-and-grouped

Заранее спасибо!


person Larry    schedule 15.01.2012    source источник
comment
Я подумал... можно ли использовать ViewBag для создания частей javascripts??? Это настолько плохая идея? Спасибо   -  person Larry    schedule 17.01.2012
comment
Я думаю, вы можете просто создать маршрут/страницу, которая создает объект (содержащий те же свойства, что и диаграмма, заголовок, субплитка) и использовать System.Web.Script.Serialization.JavaScriptSerializer для сериализации и вывода диаграммы. На странице потребителя вы можете использовать jquery, чтобы сделать ajax-вызов службы REST, а затем инициализировать диаграмму с возвращенными данными. Я делаю то же самое прямо сейчас (однако на PHP).   -  person gremo    schedule 19.01.2012
comment
Спасибо @Гремо! Не могли бы вы привести мне пример этого решения, если это возможно? Спасибо еще раз!   -  person Larry    schedule 23.01.2012


Ответы (1)


С помощью DotNet.Highcharts можно создать диаграмму на стороне сервера по своему усмотрению без использования JavaScript или JSON. Вот пример, который вы хотели бы сделать с библиотекой:

Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Column })
.SetTitle(new Title { Text = "Total fruit consumtion, grouped by gender" })
.SetXAxis(new XAxis { Categories = new[] { "Apples", "Oranges", "Pears", "Grapes", "Bananas" } })
.SetYAxis(new YAxis
            {
                AllowDecimals = false,
                Min = 0,
                Title = new YAxisTitle { Text = "Number of fruits" }
            })
.SetTooltip(new Tooltip { Formatter = "TooltipFormatter" })
.SetPlotOptions(new PlotOptions { Column = new PlotOptionsColumn { Stacking = Stackings.Normal } })
.SetSeries(new[]
            {
                new Series
                {
                    Name = "John",
                    Data = new Data(new object[] { 5, 3, 4, 7, 2 }),
                    Stack = "male"
                },
                new Series
                {
                    Name = "Joe",
                    Data = new Data(new object[] { 3, 4, 4, 2, 5 }),
                    Stack = "male"
                },
                new Series
                {
                    Name = "Jane",
                    Data = new Data(new object[] { 2, 5, 6, 2, 1 }),
                    Stack = "female"
                },
                new Series
                {
                    Name = "Janet",
                    Data = new Data(new object[] { 3, 0, 4, 4, 3 }),
                    Stack = "female"
                }
            });

Вы можете найти множество примеров ASP.NET MVC здесь: http://dotnethighcharts.codeplex.com/releases/view/80650

person Vangi    schedule 29.01.2012