Chart.js-使用mysql和php从数据库获取数据

我正在尝试将静态数据转换为使用数据库结果。我将使用 和 。

var randomScalingFactor = function(){ return Math.round(Math.random()*100)};

var lineChartData = {

labels : ["January","February","March","April","May","June","July"],

datasets : [

{

label: "My First dataset",

fillColor : "rgba(220,220,220,0.2)",

strokeColor : "rgba(220,220,220,1)",

pointColor : "rgba(220,220,220,1)",

pointStrokeColor : "#fff",

pointHighlightFill : "#fff",

pointHighlightStroke : "rgba(220,220,220,1)",

data : [randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor()]

},

{

label: "My Second dataset",

fillColor : "rgba(151,187,205,0.2)",

strokeColor : "rgba(151,187,205,1)",

pointColor : "rgba(151,187,205,1)",

pointStrokeColor : "#fff",

pointHighlightFill : "#fff",

pointHighlightStroke : "rgba(151,187,205,1)",

data : [randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor()]

}

]

}

window.onload = function(){

var ctx = document.getElementById("canvas").getContext("2d");

window.myLine = new Chart(ctx).Line(lineChartData, {

responsive: true

});

}

$result = mysql_query("SELECT COUNT(*) FROM customer WHERE month='january'") or die(mysql_error());

$row1 = mysql_fetch_array( $result );

$result = mysql_query("SELECT COUNT(*) FROM customer WHERE month='february'") or die(mysql_error());

$row2 = mysql_fetch_array( $result );

$result = mysql_query("SELECT COUNT(*) FROM customer WHERE month='march'") or die(mysql_error());

$row3 = mysql_fetch_array( $result );

如何使用count()我的MySQL查询中的那些并将其实现到chartjs上的数据集?我也希望标签也可以从我的MySQL查询中生成。我应该在jQuery代码内部循环数据集吗?

这是我正在使用的插件:http :

//www.chartjs.org/docs/#line-chart-

introduction

回答:

请将您的php代码放入另一个文件中,api.php并使用 *json_encode()

我提供了示例示例,您可以在这里看到。

请参考以下代码示例:

  1. api.php

    $arrLabels = array("January","February","March","April","May","June","July");

    $arrDatasets = array(‘label’ => “My First dataset”,’fillColor’ => “rgba(220,220,220,0.2)”, ‘strokeColor’ => “rgba(220,220,220,1)”, ‘pointColor’ => “rgba(220,220,220,1)”, ‘pointStrokeColor’ => “#fff”, ‘pointHighlightFill’ => “#fff”, ‘pointHighlightStroke’ => “rgba(220,220,220,1)”, ‘data’ => array(‘28’, ‘48’, ‘40’, ‘19’, ‘86’, ‘27’, ‘90’));

    $arrReturn = array(array(‘labels’ => $arrLabels, ‘datasets’ => $arrDatasets));

    print (json_encode($arrReturn));

  2. example.html

    $.ajax({

    type: ‘POST’,

    url: ‘api.php’,

    success: function (data) {

    lineChartData = data;//alert(JSON.stringify(data));

    var myLine = new Chart(document.getElementById(“canvas”).getContext(“2d”)).Line(lineChartData);

    var ctx = document.getElementById(“canvas”).getContext(“2d”);

    window.myLine = new Chart(ctx).Line(lineChartData, {responsive: true});

    }

    });

请注意,您应该传递价值randomScalingFactor()api.php

请检查并告知我是否需要其他帮助。

以上是 Chart.js-使用mysql和php从数据库获取数据 的全部内容, 来源链接: utcz.com/qa/427068.html

回到顶部