HighchartsとJSON形式

Question

私は、ファイル内のクエリのために、このコードを持っているがquerytojson.php呼ば

[{"UploadSpeed":"0.342153197182936","DownloadSpeed":"4.35602301750153","Latency":"110.290067528565","Jitter":"0.0333323723888251","PacketLoss":"0.164373075044556"}] 

今、私が作成したいと思いますこのようなHighchartsライブラリとグラフ、ファイルがindex1.htmlと呼ばれている：

$(document).ready(function() { 
     var options = { 

      chart: { 

       renderTo: 'container', 

       defaultSeriesType: 'column' 

      }, 

      title: { 

       text: 'HOBBIT' 

      }, 
      tooltip: { 

      }, 
      labels: { 
       html: 'index.html' 
      }, 

      xAxis: { 
       categories: [] 
      }, 
      yAxis: { 

       title: { 

        text: 'Velocità di connessione' 

       } 

      }, 

      series: [] 

     }; 
}) 

私はJを通過したいと思います息子のデータを直接index.htmlに送ります。

Answer 1

私はこれに似た何かをしました。私がやったやり方は、私はsperate jsファイルでチャートを作成し、そのチャートを変数としてJSONオブジェクトを渡す関数として呼び出しただけです。これは私のサイトで使用しているスクリプトの例です。あなたのケースでは、ラベルと値は同じ変数なので、ループの反復は異なりますが、考え方は変わりません。

var chart; 
function pieChart(id, values, labels, animate){ 
    if (animate === undefined){ 
     animate = true; 
    } 
    var arrays = new Array(); 
    for (i=0;i<values.length;i++) { 
     arrays[i] = [labels[i], values[i]]; 
    } 

chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: id, 
     plotBackgroundColor: null, 
     plotBorderWidth: null, 
     plotShadow: false 
    }, 
    credits: { 
     enabled: false 
    }, 
    title: { 
     text: 'Event Occurrence', 
     style: { 
      color: '#000000' 
     } 
    }, 
    tooltip: { 
     formatter: function() { 
      return '<b>'+ this.point.name +'</b>: '+ this.y +' %'; 
     } 
    }, 
    plotOptions: { 
     pie: { 
      allowPointSelect: true, 
      cursor: 'pointer', 
      dataLabels: { 
       enabled: true, 
       color: '#000000', 
       connectorColor: '#000000', 
       formatter: function() { 
        return '<b>'+ this.point.name +'</b>: '+ this.y +' %'; 
       } 
      } 
     }, 
     series: { 
      animation: animate 
      } 
    }, 
    series: [{ 
     type: 'pie', 
     name: 'Probability', 
     data: arrays 
    }] 
}); 
}