javascript - CanvasJS - 动态数据点 .push - 循环

Question

我有一个带有字符串值的 PHP 动态数组，如下所示：

Array ( [Overload] => 42 [Reliability] => 1024 [Relocation] => 20 [NRUC] => 7 [Storm] => 589) 

我想知道如何在 dataPoints 中使用 CanvasJS 在圆环图中循环它们，每个部分都介绍了每种类型：

var chart2 = new CanvasJS.Chart("chartContainer2", {
    theme: "light1",
    exportFileName: "Doughnut Chart",
    animationEnabled: true,
    title:{
        text: "Work Type",
        wrap: false,
        fontFamily: "tahoma",
        fontSize: 26
    },
    legend:{
        cursor: "pointer",
        itemclick: explodePie,
        verticalAlign: "bottom",    horizontalAlign: "bottom"
    },
    data: [{
        type: "doughnut",
        innerRadius: 60,
        showInLegend: true,
        toolTipContent: "<b>{name}</b>: {y}",
        indexLabel: "{name} - {y}",
        indexLabelFontSize: 14,
        dataPoints: [/*???????*/]}]
          });

我尝试使用 .push 但我仍然有问题并且它不起作用：

var dps = [];
<?for($i = 0; $i <$COUNT_TYPE; $i++) {?>dps.push({y:<?echo $val[$i]?>, name: <?echo $key[$i];?>});

    <?}?>

var chart2 = new CanvasJS.Chart("chartContainer2", {
    theme: "light1",
    exportFileName: "Doughnut Chart",
    animationEnabled: true,
    title:{
        text: "Work Type",
        wrap: false,
        fontFamily: "tahoma",
        fontSize: 26
    },
    legend:{
        cursor: "pointer",
        itemclick: explodePie,
        verticalAlign: "bottom",    horizontalAlign: "bottom"
    },
    data: [{
        type: "doughnut",
        innerRadius: 60,
        showInLegend: true,
        toolTipContent: "<b>{name}</b>: {y}",
        indexLabel: "{name} - {y}",
        indexLabelFontSize: 14,
        dataPoints: dps }]
          });

我的 php 变量是：

                 $NEW_TYPEOFWORK = array_count_values($TW);
                 /*$NEW_TYPEOFWORK = Array ( [Overload] => 42 [Reliability] => 1024 [Relocation] => 20 [NRUC] => 7 [Storm] => 589) */
                 foreach($NEW_TYPEOFWORK as $key[]=>$val[]){}
                 $COUNT_TYPE = count($NEW_TYPEOFWORK);

标签： javascriptphpchartscanvasjs