Question

data.php正在返回：

{name: 'orcamento', data: [14000.00,8500.00,0.00]},{name: 'real', data: [2038.00,120.00,15000.00]},{name: 'desvio', data: [-11962.00,-8380.00,15000.00]}

我想使用这些数据来提供图表。如果我键入以下代码，则效果很好：

$(document).ready(function(){
    var options={
        chart: {
            renderTo:'container',
            type: 'bar'
        },
        title: {
            text: 'Total Anual'
        },
        xAxis: {
            categories: ['Vendas', 'Serviços', 'Outras']
        },
        series: [{name: 'orcamento', data: [14000.00,8500.00,0.00]},{name: 'real', data: [2038.00,120.00,15000.00]},{name: 'desvio', data: [-11962.00,-8380.00,15000.00]}]
    };
});

但是以下代码不起作用：

$(document).ready(function(){
    var options={
        chart: {
            renderTo:'container',
            type: 'bar'
        },
        title: {
            text: 'Total Anual'
        },
        xAxis: {
            categories: ['Vendas', 'Serviços', 'Outras']
        },
        series: [$.get('data.php')]
    };
});

为什么？

编辑：我也没试过这个尝试过：

$(document).ready(function(){
    var dados=[];
    $.ajax({
        url:'data.php',
        success: function(response){
            dados=response
        }
    });

    var options={
        chart: {
            renderTo:'container',
            type: 'bar'
        },
        title: {
            text: 'Total Anual'
        },
        xAxis: {
            categories: ['Vendas', 'Serviços', 'Outras']
        },
        series: [dados] 
    };
});

EDIT2：还尝试了以下内容，但我得到一张空图表：

$(document).ready(function(){
    var dados=[];

    $.ajax({
        url:'data.php',
        success: function(response){
            dados=response
        },
        async:false
    });

    var options={
        chart: {
            renderTo:'container',
            type: 'bar'
        },
        title: {
            text: 'Total Anual'
        },
        xAxis: {
            categories: ['Vendas', 'Serviços', 'Outras']
        },
        series: [dados] 
    };

    var chart = new Highcharts.Chart(options);
});

在JSONLint中，我收到错误：

Parse error on line 1:
{    name: 'orcamento', 
-----^
Expecting 'STRING', '}'

Answer 1

在编辑问题中，定义选项时可能没有设置dados var。因为ajax响应是异步的。尝试编辑如下：

$(document).ready(function(){
    var dados=[];
    var options = {};
    $.ajax({
        url:'data.php',
        success: function(response){
            dados=$.parseJSON(response); // EDITED
            options={
                chart: {
                    renderTo:'container',
                    type: 'bar'
                },
                title: {
                    text: 'Total Anual'
                },
                xAxis: {
                    categories: ['Vendas', 'Serviços', 'Outras']
                },
                series: [dados] 
            };
            var chart = new Highcharts.Chart(options);
        }
    });
});

在PHP JSON结果中，像这样放置[]：

[{name：＆＃39; orcamento＆＃39;，data：[14000.00,8500.00,0.00]}，{name：＆＃39; real＆＃39;，数据：[2038.00,120.00,15000.00]}，{name：＆＃39; desvio＆＃39;，数据： [-11962.00，-8380.00,15000.00]}]

Answer 2

$。get（'data.php'）将忽略返回结果。见https://api.jquery.com/jQuery.get/

你必须使用回调。

干杯， Ĵ

PHP：从数据库获取数据以提供JQuery图表

2 个答案: