Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/414.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Highcharts棱锥图不显示带有JSON、PHP的数据_Javascript_Php_Jquery_Json_Highcharts - Fatal编程技术网

Javascript Highcharts棱锥图不显示带有JSON、PHP的数据

Javascript Highcharts棱锥图不显示带有JSON、PHP的数据,javascript,php,jquery,json,highcharts,Javascript,Php,Jquery,Json,Highcharts,在Highcharts中将JSON与金字塔图一起使用时,控制台日志中没有任何错误,但没有显示任何数据 我有charts.php,结果是: {"success":1,"data":[{"name":"John Spoon","data":300}, {"name":"Dave Jones","data":200},{"name":"Other","data":500}]} 这就是我尝试过的,它不返回任何数据 <div id="chart" style=

在Highcharts中将JSON与金字塔图一起使用时,控制台日志中没有任何错误,但没有显示任何数据

我有charts.php,结果是:

{"success":1,"data":[{"name":"John Spoon","data":300}, {"name":"Dave Jones","data":200},{"name":"Other","data":500}]}
这就是我尝试过的,它不返回任何数据

<div id="chart"  style=
                        "height:600px;width:100%;"></div>

<script>
$(function () {
    $("#chart").html("Loading Activity Log Graph...");

    var options = {
        chart: {
            type: 'pyramid',
            renderTo: 'chart',
            marginRight: 100
        },
        title: {
            text: 'Activity',
            x: -50
        },
        plotOptions: {
            series: {
                dataLabels: {
                    enabled: true,
                    format: '<b>{point.name}</b> ({point.y:,.0f})',
                    color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
                    softConnector: true
                }
            }
        },
        legend: {
            enabled: false
        },
        name: 'Activity Count',
        series: [{}]
   };

    $.ajax({
        url: "charts.php",
        type:'post',
        dataType: "json",
        success: function(data){
            options.series = data.data;
            var chart = new Highcharts.Chart(options);          
        }
    });

}); 
</script>

$(函数(){
$(“#图表”).html(“加载活动日志图…”);
变量选项={
图表:{
类型:'金字塔',
renderTo:'图表',
marginRight:100
},
标题:{
文本:“活动”,
x:-50
},
打印选项:{
系列:{
数据标签:{
启用:对,
格式:“{point.name}({point.y:,.0f})”,
颜色:(Highcharts.theme&&Highcharts.theme.ContractTextColor)| |“黑色”,
软连接器:正确
}
}
},
图例:{
已启用:false
},
名称:'活动计数',
系列:[{}]
};
$.ajax({
url:“charts.php”,
类型:'post',
数据类型:“json”,
成功:功能(数据){
options.series=data.data;
var图表=新的Highcharts.图表(选项);
}
});
}); 
这是我想要的结果,在不使用JSON的情况下显示:

我需要更改什么才能显示数据?

查看,数据必须以单个系列的形式显示,每个数据点都是
[name,value]
的数组。您有两个选项,更改PHP以输出正确的格式,或者用javascript修改PHP输出。由于您没有发布PHP代码,我将稍后再发布:

var data = {"success":1,"data":[{"name":"John Spoon","data":300}, {"name":"Dave Jones","data":200},{"name":"Other","data":500}]};    

options.series = [{
    data: $.map(data.data, function(i){ // loop outputted data
        return [[i.name, i.data]]; // coerce into an array of [name,value]
    })
}];

这是一个有效的方法。

谢谢你的回复,我尝试将ajax成功函数从我的改为
success:function(data){options.series=[{data:$.map(data.data,function(I){return[[I.name,I.data]];}];var chart=new Highcharts.chart(options);}
但是我在控制台日志中得到一个格式错误,它将我引向这里:忽略上面的内容,我在PHP中更改了一些内容,这会破坏它。这很有效,谢谢!