dsfe167834 2015-07-20 09:29
浏览 182

Highcharts饼图无法加载

I'm trying to create a Pie Graph with High charts. I get all the values from the database through PHP, as well as the series, which are send to jQuery through JSON in which I parse that JSON and get it to the function that creates the graph.

$query = [array('name'=>'SAP', 'id'=>48), array('name'=>'EIS', 'id'=>65), array('name'=>'P2P', 'id'=>84), array('name'=>'Portal Gift Card', 'id'=>92), array('name'=>'Tenants Survey', 'id'=>74), array('name'=>'Outros', 'id'=>17)];
            $series = array('name' => 'Effort');
            $seriesData = array();
            foreach ($query as $data){
                $rslt = $this->gm->getEffortApp($data['id']);
                array_push($seriesData, array('name' => $data['name'], 'y' => $rslt));
            }
            $series['data'] = $seriesData;
            echo json_encode($series, JSON_NUMERIC_CHECK);

This are the codes that get me the data and send it to the jQuery through JSON.

$(document).ready(function(){
    var param = '<?=$graphdata['param']?>';
    asyncCall('post', '?/graphAsync/getSeries/'+<?=$graphdata['graph_id']?>,{param: param}, 'text',function(data){                                              //returns the right array to populate the graph
        var series = $.parseJSON(data);
        setChartData($('#graph'+<?=$graphdata['id']?>), '<?=$graphdata['graph_type']?>', '<?=$graphdata['graph_title']?>', 'Teste', '<?=$graphdata['graph_titleY']?>', series);
    });      
}); 

This is the code that receives all the graph data and parses the JSON string.

function setChartData(elem, type, title, categories, titleY, series){
elem.highcharts({
    chart: {
        type: type
    },
    title: {
        text: title
    },
    xAxis: {
        categories: categories
    },
    yAxis: {
        min: 0,
        title: {
            text: titleY
        },
        stackLabels: {
            enabled: true,
            style: {
                fontWeight: 'bold',
                color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
            }
        }
    },
    plotOptions: {
        column: {
            stacking: 'normal',
            dataLabels: {
                enabled: true,
                color: (Highcharts.theme && Highcharts.theme.textColor) || 'white',
                style: {
                    textShadow: '0 0 3px black'
                }
            }
        },
        pie: {
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
                enabled: true,
                style: {
                    color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                }
            }
        }
    },
    series: series,
    credits: {
        enabled: false
    }
});
}

This is the function that creates the graph.

The rest of the graph data comes from the controller load (CodeIgniter) and seems to be fine.

The output of the server (JSON string) is as follows:

[{"name":"SAP","y":9420.35},{"name":"EIS","y":2282.5},{"name":"P2P","y":218.5},{"name":"Portal Gift Card","y":203},{"name":"Tenants Survey","y":323},{"name":"Outros","y":1}]

And the input in the function of the series is something like this:

series=[object,object,object,object,object,object]

And each object is as follows:

object:[name:'something', y:*number*]

The graph loads empty, only with the title and the export button. For some reason I can't post images so that's why I didn't put any image of the graph output.

thanks in advance.

EDIT: here is the jsfiddle, although for some reason I can't get it to work the way it is in localhost. That's essentially what I'm doing, but instead i'm passing the arguments through PHP variables.

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 我想咨询一下路面纹理三维点云数据处理的一些问题,上传的坐标文件里是怎么对无序点进行编号的,以及xy坐标在处理的时候是进行整体模型分片处理的吗
    • ¥15 CSAPPattacklab
    • ¥15 一直显示正在等待HID—ISP
    • ¥15 Python turtle 画图
    • ¥15 关于大棚监测的pcb板设计
    • ¥15 stm32开发clion时遇到的编译问题
    • ¥15 lna设计 源简并电感型共源放大器
    • ¥15 如何用Labview在myRIO上做LCD显示?(语言-开发语言)
    • ¥15 Vue3地图和异步函数使用
    • ¥15 C++ yoloV5改写遇到的问题