阿贾克斯JSON中Highcharts饼图JSON、阿贾克斯、饼图、Highcharts

2023-09-10 17:05:41 作者:依然、为你疯狂

我已经遇到与ajaxing在一些样本JSON数据,过去几天的问题从一个外部文件中使用Highcharts库来填充饼图。

下面是我的文件样本JSON数据:data.json

  [
     [苹果,43.0]
     [梨,57.0]
   ]
 

下面是我的实现highcharts和我的AJAX调用的: (我省略了不相关的code)

 <脚本类型=文/ JavaScript的>
     $(函数(){
       VAR的选择= {
            图表: {
                renderTo:图表,
                defaultSeriesType:馅饼
            },
            标题: {
               文字:水果
             },

            plotOptions:{
                 馅饼: {
                     allowPointSelect:真正的,
                     光标:指示器,
                     dataLabels:{
                        启用:真,
                        颜色:#000000,
                        connectorColor:#000000,

                     }
                 }
            },
            系列: [{
               类型:'馅饼',
               名称:'水果',
               数据: []
            }]
         };

        $ .getJSON('data.json',函数(JSON){

           options.series.push(JSON);
           VAR图=新Highcharts.Chart(选件);
         })错误(函数(){执行console.log('错误');});


     });
< / SCRIPT>
 
欧冠 阿贾克斯VS尤文图斯预测 淘汰皇马阿贾克斯不惧尤文

基本上,我想通过在JSON,到options.series []。数据[]。当进行

  options.series.push(JSON);
 

我得到:

  [对象,数组[2] //凡客体包含。名称和.TYPE和Array [2]是我的数据
 

我是pretty的肯定,我需要这样的:

  [对象] //其中包含的.data,.name和.TYPE
 

解决方案

我实际上是能够通过构建我的JSON等来解决我的问题,所以:

  [
     {
          类型:馅饼,
          名:水果,
          数据 : [
               [
                    苹果,
                     43.0
               ]
               [
                    梨,
                    57.0
               ]
           ]
     }
]
 

而不是做一个数组推

我设置了​​一系列参数的JSON是这样的:

  $ .getJSON(data.json功能(JSON)){
    options.series = json的;
    VAR图=新Highcharts.chart(选件);
 }
 

I have been encountering issues for the past few days with ajaxing in some sample json data from an external file to populate a pie chart using the Highcharts library.

Here is my sample JSON data in file: data.json

   [
     ["Apples", 43.0],
     ["Pears", 57.0]
   ]

Here is my implementation of highcharts and my AJAX call: (I have omitted unrelated code)

<script type="text/javascript">
     $(function() {
       var options = {
            chart: {
                renderTo: 'Chart',
                defaultSeriesType: 'pie'
            },
            title: {
               text:'Fruits'
             },

            plotOptions: {
                 pie: {
                     allowPointSelect: true,
                     cursor: 'pointer',
                     dataLabels: {
                        enabled: true,
                        color: '#000000',
                        connectorColor: '#000000',

                     }
                 }
            },
            series: [{
               type: 'pie',
               name: 'Fruits',
               data: []
            }]
         };

        $.getJSON('data.json', function(json) {

           options.series.push(json);               
           var chart = new Highcharts.Chart(options);
         }).error(function() {console.log('error');});


     });
</script>

Basically, I want to pass in the JSON, into options.series[].data[]. When proceed with

options.series.push(json);

I get:

[Object, Array[2]] // where the Object contains .name and .type and the Array[2] is my data

I'm pretty sure I need this:

[Object] // which contains .data , .name, .type

解决方案

I was actually able to solve my problem by structuring my JSON like so:

[
     {
          "type" : "pie",
          "name" : "Fruits",
          "data" : [
               [
                    "Apple",
                     43.0
               ],
               [  
                    "Pear",
                    "57.0"
               ]
           ]
     }
]

and instead of doing an array push,

I set the series parameter to the JSON like this:

 $.getJSON("data.json", function(json)) {
    options.series = json;
    var chart = new Highcharts.chart(options);
 }