JSON配列のハイチャートシリーズ

Question

現在、ハイチャートで使用できるように、サーブレットからJSPにデータを渡そうとしているWebアプリケーションを行っています。動的オブジェクトのJSON配列を作成していて、AJAXを使用してJSPに渡しています。私は、これらの配列のそれぞれは"name"は、シリーズの名前で、"data"は毎月の売上を表す配列であるHighChartシリーズとして使用したい

[{"data":[2,4,6,6,0,0,0,0,0,0,0,0],"name":"DESIGN"}, 
{"data":[1,0,0,1,0,0,0,0,0,0,0,0],"name":"COLOUR"}] 

例：JSON配列は次のようになります。例のトンを読んだ後、私はまだ失敗したの線に沿って何かを私のAJAXの成功関数から配列を解析しようとしています：

$.ajax({ 
      type : 'GET', 
      url : '/InventoryManagement/dashboardData', 
      datatype : 'json', 
      success : function(data) { 
       var dataObj = JSON.parse(data); 
       var seriesArr = new Array(); 
       $.each(dataObj, function(key, d) { 
        var series = { 
         name : key, 
         data : [] 
        }; 
        series.key = key; 
        series.d = d; 

        seriesArr.push(series); 
       }); 


       $(function() { 
        var options = { 
         chart : { 
          renderTo : 'overallSales', 
          type : 'column' 
         }, 
         title : { 
          text : 'Overal Unit Sales' 
         }, 
         xAxis : { 
          categories : [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 
            'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ] 
         }, 
         yAxis : { 
          title : { 
           text : 'Units sold' 
          } 
         }, 
         series : seriesArr 

        }; 
        var chart = new Highcharts.Chart(options); 
       }); 
      } 

私はきちんと$.eachにデータを渡していないのです知っているが、これはあります私がAJAX、JSON、またはHighchartsで作業しているのは初めてですので、これを修正する方法を教えてください！

Answer 1

$(function() { 
     $('#container').highcharts({ 
      chart: { 
       type: 'column' 
      }, 
      title: { 
       text: 'Overal Unit Sales' 
      }, 
      xAxis: { 
       categories: [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 
        'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ], 
       title: { 
        text: null 
       } 
      }, 
      yAxis: { 
       min: 0, 
       title: { 
        text: 'Value', 
        align: 'high' 
       }, 
       labels: { 
        overflow: 'justify' 
       } 
      }, 
      tooltip: { 
       valueSuffix: 'unit' 
      }, 
      plotOptions: { 
       bar: { 
        dataLabels: { 
         enabled: true 
        } 
       } 
      }, 
      legend: { 
       layout: 'vertical', 
       align: 'right', 
       verticalAlign: 'top', 
       x: -40, 
       y: 80, 
       floating: true, 
       borderWidth: 1, 
       backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'), 
       shadow: true 
      }, 
      credits: { 
       enabled: false 
      }, 
      series: dataObj 
     }); 
    }); 

コンテナだけに配置された場合、あなたが言及しませんでしたHighchart.Inで、一連のオプションあなたのコードにあなたのdataObjを追加し、あなたのチャートを配置

ことをグラフ親要素のIDです。

DEMO