将chartjs的php sql值检索到jquery/ajax中

Question

我试图在检索数据库值时使用http://www.chartjs.org/ 创建饼图。以下是我的代码

callactiveinactive.php

<?php
require connectDB.php;

$sql = "SELECT Player_Status from player
WHERE Player_Status = 'Active' ";
$res = $conn->query($sql);
$active = $res->num_rows;

$sql = "SELECT Player_Status from player
WHERE Player_Status = 'Suspended' ";
$res = $conn->query($sql);
$suspended = $res->num_rows;

echo json_encode(array($active,$suspended));
?>

主显示页面

 <canvas id="pieChart" style="height: 399px; width: 798px;" width="798"
> height="399"></canvas> 
><script> 
>$.ajax({       
>url:'callactiveinactive.php',
>      dataType: 'json'
> 
>      success:function(data){       
>var active = data["active"];        
>var suspended = data["suspended"];
>      } });
> 
>     var pieChartCanvas = $("#pieChart").get(0).getContext("2d");
>     var pieChart = new Chart(pieChartCanvas);
> 
> 
> 
>   
>     var PieData = [
>       {
>         value: var active,
>         color: "#f56954",
>         highlight: "#f56954",
>         label: "Active"
>       },
>       {
>         value: var suspended,
>         color: "#00a65a",
>         highlight: "#00a65a",
>         label: "Suspended"
>       },
> 
>     ];  pieChart.Doughnut(PieData, pieOptions); </script>

我知道我的 .ajax 搞砸了，请原谅我，因为我是新手。

Answer 1

value: var active,这行应该是value: active,

var PieData = [
>       {
>         value: active,
>         color: "#f56954",
>         highlight: "#f56954",
>         label: "Active"
>       },
>       {
>         value: suspended,
>         color: "#00a65a",
>         highlight: "#00a65a",
>         label: "Suspended"
>       },
> 
>     ];

编辑：

var active ;        
var suspended;
$.ajax({       
    url:'callactiveinactive.php',
    dataType: 'json', 
    success:function(data){       
        active = data["active"];        
        suspended = data["suspended"];
      }
});

var pieChartCanvas = $("#pieChart").get(0).getContext("2d");
var pieChart = new Chart(pieChartCanvas);

 //in case it till not work un-comment below line and check if it alert - number 
 //alert(typeof active);


var PieData = [
       {
         value: active,
         color: "#f56954",
         highlight: "#f56954",
         label: "Active"
       },
       {
         value: suspended,
         color: "#00a65a",
         highlight: "#00a65a",
         label: "Suspended"
       },

     ];  pieChart.Doughnut(PieData, pieOptions);