显示高图并使用php从mysql数据库获取图表的数据

时间:2016-01-15 05:13:37

标签: javascript php jquery ajax highcharts

当我从数据库中读取数据并使用它来显示图表时,Highchart不会显示任何内容。

$.post('ajax/like_get_option1.php' , function(data){op1= data;}); //php file is called which connects to database and echo out the result
$.post('ajax/like_get_option2.php' , function(data){op2= data;});
$.post('ajax/like_get_option3.php' , function(data){op3= data;});
$.post('ajax/like_get_option4.php' , function(data){op4= data;});
$.post('ajax/like_get_option5.php' , function(data){op5= data;});
$.post('ajax/like_get_option6.php' , function(data){op6= data;});


     var arr = [op1,op2,op3,op4,op5,op6]; //making array of all the values to pass in highchart

    var options = {
        chart:{
        type: 'column',
        margin: 150,
        options3d:{
            enabled: true,
            alpha: 10,
            beta: 25,
            depth: 70,
            viewDistance: 25
        }


    },
    title:{
        text: 'Demo'
    },
    subtitle:{
        text:'Test'
    },
    plotOptions:{
        column:{
            depth: 25
        }
    },
     xAxis: {
            categories:['x','y','z','a','b','c']
        },
    yAxis: {
        title: {
            text: null
        }
    },
    series: [{
        name: 'Poll',
            data: arr
        }]

    };


var y = $('#container');  

var tween4 =y.highcharts(options); // passing values to highchart

我只需要访问我的数据库来获取值并将其传递给高图。任何建议都将受到赞赏??

4 个答案:

答案 0 :(得分:0)

带有来自mysql数据库的数据的简单高图图

$(function () {
$('#container').highcharts({
    chart: {
        type: 'line'
    },
    title: {
        text: 'Monthly Average Temperature'
    },
    subtitle: {
        text: 'Source: WorldClimate.com'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    yAxis: {
        title: {
            text: 'Temperature (°C)'
        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: true
            },
            enableMouseTracking: false
        }
    },
    <?php 
    $sql = 'SELECT count(*) as counter FROM example limit 12';
    mysql_select_db('test_db');
    $retval = mysql_query( $sql, $conn );

    echo 'series: [{
        name: 'Example',
        data: [
        while($row = mysql_fetch_array($retval, MYSQL_ASSOC)) {
        echo $row['counter'].",";
       }]
    }]';
    ?>
});
});

答案 1 :(得分:0)

你可以在php中使用implode函数用逗号分割数组并转换成字符串

series: [{
    name: 'Poll',
        data: [<?php echo implode(",",$arr); ?>]
    }]
};

结果

data : [op1,op2,op3....]

答案 2 :(得分:0)

您的代码的一般问题是您在调用所有ajax之前初始化图表。您应该在回调中使用$.when() then() jquery和init图表。

答案 3 :(得分:0)

1,DOMAIN example.com: ns0.example.com. Vulnerable
1,DOMAIN example.com: ns1.example.com. Not Vulnerable
2,DOMAIN abc.com    : ns1.abc.com. Not Vulnerable  
3,DOMAIN mno.com    : .............
4,DOMAIN xyz.com    : .............
5,DOMAIN prq.com    : .............

我使用简单循环在其他内部执行ajax调用,然后在最后调用highchart并且它有效。我也是直接从php文件传递数据到highchart,这是即将到来的字符串。所以我使用parseInt来转换int中的值,并在经过一些考验之后起作用。