Javascript 使用chart.js和PHP动态创建图表

我们目前正在使用CustomerThermometer在完成支持通知单后调查我们的客户。不幸的是，CustomerThermometer小部件看起来很恶心。因此，我目前正在尝试使用chart.js创建一个图表，并使用PHP从CustomerThermometer的API动态获取数据

除了“数据”，PHP数组（$dataPoints）中的所有部分都会在图表中被考虑，我真的不知道如何进一步处理

图表测试
var ctx=document.getElementById（'myChart'）；
var myChart=新图表（ctx{
类型：'bar'，
数据：{
标签：[“金星”、“绿灯”、“黄灯”、“红灯”]，
数据集：
},
选项：{
比例：{
雅克斯：[{
滴答声：{
贝吉纳泽罗：是的
}
}]
}
}
});

编辑：

$dataPoints

[{"label":"Gold Star","data":4,"backgroundColor":"rgba(255,215,0,1)"},{"label":"Green Light","data":2,"backgroundColor":"rgba(0,128,0,1)"},{"label":"Yellow Light","data":0,"backgroundColor":"rgba(255,255,0,1)"},{"label":"Red Light","data":0,"backgroundColor":"rgba(255,0,0,1)"}]

我还尝试在

数据集

中静态设置以下值，这很有效，并提供了所需的结果：

datasets: [{
    data: [ 4 , 2 , 0 , 0 ],
    backgroundColor: [
        "rgba(255,215,0,1)",
        "rgba(0,128,0,1)",
        "rgba(255,255,0,1)",
        "rgba(255,0,0,1)"
    ]

}]

工作代码（感谢@Camille）：

无标题文件
var ctx=document.getElementById（'myChart'）；
var myChart=新图表（ctx{
类型：'bar'，
数据：{
标签：[“客户温度计”]，
数据集：
},
选项：{
比例：{
雅克斯：[{
滴答声：{
贝吉纳泽罗：是的，
}
}]
}
}
});
数据点的数据属性应为数组。如果得到单个值，则必须将其转换

...
$dataPoints = array(
  array( "label" => "Gold Star" , "data" => array($gold) , "backgroundColor" => "rgba(255,215,0,1)"),
  array( "label" => "Green Light" , "data" => array($green) , "backgroundColor" => "rgba(0,128,0,1)"),
  array( "label" => "Yellow Light" , "data" => array($yellow) , "backgroundColor" => "rgba(255,255,0,1)"),
  array( "label" => "Red Light" , "data" => array($red) , "backgroundColor" => "rgba(255,0,0,1)" )
);
...

$dataPoints
的数据属性应为数组。如果得到单个值，则必须将其转换

...
$dataPoints = array(
  array( "label" => "Gold Star" , "data" => array($gold) , "backgroundColor" => "rgba(255,215,0,1)"),
  array( "label" => "Green Light" , "data" => array($green) , "backgroundColor" => "rgba(0,128,0,1)"),
  array( "label" => "Yellow Light" , "data" => array($yellow) , "backgroundColor" => "rgba(255,255,0,1)"),
  array( "label" => "Red Light" , "data" => array($red) , "backgroundColor" => "rgba(255,0,0,1)" )
);
...

但是您已经验证了那些
数据
条目实际上包含您希望从中开始的内容，对吗？这意味着，$gold、$green等实际上具有您期望的值，并且这些请求一开始并没有以某种方式失败？@04FS customerthermometer API提供了一个纯文本整数。已将
$dataPoints
-数组添加到我的编辑中。是否先尝试使用静态数据？在开始使用PHP/anything dynamic之前，请确定从chart.js库中获得所需输出所需的数据结构。@04FS检查最新编辑。这与您在此处动态创建的内容完全不同。但您已验证这些
数据
条目实际上包含您希望从中开始的内容，正确的？这意味着，$gold、$green等实际上具有您期望的值，并且这些请求一开始并没有以某种方式失败？@04FS customerthermometer API提供了一个纯文本整数。已将
$dataPoints
-数组添加到我的编辑中。是否先尝试使用静态数据？在开始使用PHP/anything dynamic之前，先弄清楚从chart.js库中获得所需输出所需的数据结构是什么？@04FS检查最新的编辑。这与您在此处动态创建的完全不同。