Javascript图表未从mysql填充数据

我试图查询一个mysql表的信息，以使用数据填充图表，但我得到一个x轴，其中“衣服未定义”横穿，并且没有填充条形图

我正在使用以下脚本查询表 clothing.php：

    if($_GET['action'] == 'clothingOrdered' && $_GET['id']){
$uid = $_GET['id'];

$sql = "SELECT clothing, orders FROM clothingOrder WHERE userid = '$uid'";
$query = mysqli_query($db_conx, $sql);
if($query){
$data = array();
foreach($query as $row){
$data[] = $row;

}

print json_encode($data);

}else{
echo mysqli_error($db_conx);

}



}else{
print 'not good';

}

这将产生：

[{“服装”：“tshirt”，“orders”：“4”}，{“服装”：“牛仔裤”，“orders”：“7”}，{“服装”：“帽子”，“orders”：“34”}，{“服装”：“连衣裙”，“orders”：“12”}，{“服装”：“夹克”，“orders”：“27”}，{“服装”：“毛衣”，“orders”：“23”}]

图形区域：

<canvas id="myChart" width="400" height="400"></canvas>

我的页面中还包含以下脚本，其中图表为：

        <script   src="https://code.jquery.com/jquery-3.1.1.min.js"   integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="   crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.bundle.min.js"></script>

---

欢迎任何反馈。谢谢。

请确保为AJAX请求设置数据类型参数

$.ajax({
    url: '../php_parsers/clothing.php?action=clothingOrdered&id='+id,
    method: "GET",
    dataType: "json",
    success: function(data) {
        // ...
    },
    error: function(data) {
        console.log(data);
    }
});

---

有没有JS错误？我用你应该加载的数据创建了这个，图表按预期呈现（包括X轴）。没有，我得到的唯一错误是与引导相关的。我想我应该再试一次，所以我得到了7个“未定义的衣服”，尽管只有6个工作可以让我使用您的数据和代码：可能是您的ajax配置没有指定数据类型吗？如果需要json，我通常会声明数据类型：“json”。jQuery文档说，如果不存在，它将尝试智能地猜测数据类型，但我以前见过很多次。

$.ajax({
    url: '../php_parsers/clothing.php?action=clothingOrdered&id='+id,
    method: "GET",
    dataType: "json",
    success: function(data) {
        // ...
    },
    error: function(data) {
        console.log(data);
    }
});