Jquery 如何使用一个函数更新多个highcharts

我在第页有4张图表

<div id="section">
    <div id="all" style="min-width: 400px;   height: 400px; margin: 0 auto"></div>
    <div id="top10" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    <div id="edu" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    <div id="eqp" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
</div>

例如，data.top10是json字符串

{
    "top10": {
        "data": "147,139,97,89,63,51,44,41,41,28",
        "xlabel": "a, b, c, d, e, f, g, h, i, j"
    }
}

前10名看起来像这样

$('#top10').highcharts({
            chart: {
                type: 'column',
                margin: [ 50, 50, 100, 80]
            },
            title: {
                text: 'TOP10 reasons'
            },
            subtitle: {
                text: 'some subtitle text'
            },
            xAxis: {
                categories: [
                    'Tokyo',
                    'Jakarta',
                    'New York',
                    'Seoul',
                    'Manila',
                    'Mumbai',
                    'Sao Paulo',
                    'Mexico City',
                    'Dehli',
                    'Osaka',
                    'Cairo',
                    'Kolkata',
                    'Los Angeles',
                    'Shanghai',
                    'Moscow',
                    'Beijing',
                    'Buenos Aires',
                    'Guangzhou',
                    'Shenzhen',
                    'Istanbul'
                ],
                labels: {
                    rotation: -45,
                    align: 'right',
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif'
                    }
                }
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Population (millions)'
                }
            },
            legend: {
                enabled: false
            },
            tooltip: {
                formatter: function() {
                    return '<b>'+ this.x +'</b><br/>'+
                        'Population in 2008: '+ Highcharts.numberFormat(this.y, 1) +
                        ' millions';
                }
            },
            series: [{
                name: 'Population',
                data: top10_data,
                dataLabels: {
                    enabled: true,
                    rotation: -90,
                    color: '#FFFFFF',
                    align: 'right',
                    x: 4,
                    y: 10,
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif'
                    }
                }
            }]
        });

$（'#top10'）。高图({
图表：{
键入：“列”，
保证金：[50,50,100,80]
},
标题：{
文字：“十大理由”
},
副标题:{
文本：“一些字幕文本”
},
xAxis：{
类别：[
"东京",，
“雅加达”，
“纽约”，
"汉城",，
“马尼拉”，
“孟买”，
“圣保罗”，
“墨西哥城”，
"德里",，
"大阪",，
“开罗”，
“加尔各答”，
“洛杉矶”，
"上海",，
“莫斯科”，
"北京",，
“布宜诺斯艾利斯”，
"广州",，
"深圳",，
“伊斯坦布尔”
],
标签：{
轮调：-45，
对齐：“右”，
风格：{
fontSize:'13px'，
fontFamily:“Verdana，无衬线”
}
}
},
亚克斯：{
分:0,，
标题：{
正文：“人口（百万）”
}
},
图例：{
已启用：false
},
工具提示：{
格式化程序：函数（）{
返回“+this.x+”
+
“2008年人口：”+Highcharts.numberFormat（this.y，1）+
“百万”；
}
},
系列：[{
姓名：'人口'，
数据：排名前10位的数据，
数据标签：{
启用：对，
轮换：-90，
颜色：“#FFFFFF”，
对齐：“右”，
x:4，
y:10，
风格：{
fontSize:'13px'，
fontFamily:“Verdana，无衬线”
}
}
}]
});

Ths格式：

{
  "top10": {
    "data": "147,139,97,89,63,51,44,41,41,28",
    "xlabel": "a, b, c, d, e, f, g, h, i, j"
  }
}

与Highcharts不兼容，您能改成这个吗

{
  "top10": {
    "data": [147,139,97,89,63,51,44,41,41,28],
    "xlabel": ['a', 'b', 'c', 'd','e', 'f', 'g', 'h', 'i', 'j']
  }
}

那么您的代码应该如下所示：

$.getJSON("index.php/ajax",{start:date},function(data){
  var top = $('#top10').highcharts(),
      all = $('#all').highcharts();

  top.xAxis[0].setCategories(data.top10.xlabel, false);
  top.series[0].setData(data.top10.data);

  all.xAxis[0].setCategories(data.all.xlabel, false);
  all.series[0].setData(data.all.data);

});

---

在PHP中，您可以使用

$data[]=“[0.3,0.4]”然后在highcharts中使用联接

series: [{
            color:'#185aa9',
            data: [<?php echo join($data, ',') ?>]
              }]

系列：[{
颜色：“#185aa9”，
数据：[]
}]

如果您不使用AJAX，在其他情况下您需要使用json_encode（）。
好的，但是如何更改它，您可以给出任何建议吗？请参阅更新的脚本抱歉，我不是PHP爱好者，但对我来说：
内爆（“，”，$array['suma'）
不是您需要的。也许你应该使用简单的
$array['suma']
或者使用
json\u encode（）
？谢谢，我知道了。我需要使用json进行双重编码，第一个在模型中，第二个在控制器中。现在工作完美！Thx Paweł再次：）您能告诉我如何更新图表，但要使用向下钻取吗？我想再次使用图表，并使用ajax请求更新向下钻取…我的意思是，如果我想要4个深度钻取，json字符串应该是什么样子
series: [{
            color:'#185aa9',
            data: [<?php echo join($data, ',') ?>]
              }]