Question

我有一个包含以下内容的PHP数组：

[{"label":"Baden-Wuerttemberg","year":"1998","ins":"243812"}...] (34 entries).

现在我想在JS中使用Chart.js绘制图表，但我不知道如何获取标签和数据集的值。

这就是我的尝试：

var jsArray = <?php echo json_encode($jsonArray); ?>;

    var chart = new CanvasJS.Chart("chartContainer", {
        title: {
            text: "My First Chart in CanvasJS"
        },
        type: 'line',
        data: {
            datasets: jsArray
        },

    });
    chart.render();
}

我想在x轴上绘制年Jahr，在y轴上绘制总数ins。

Answer 1

json_encode函数返回json编码的字符串，但在chart.js中你需要json对象。你只需要在javascript部分解析字符串到对象：

var jsArray = JSON.parse('<?php echo json_encode($jsonArray); ?>');

这应该有用！

更新

根据Chart.js文档，dataPoints中的每个单个对象都可以具有以下属性：

{
    "label": "string, will appear if hovered the bar",
    "x": 10, // must be a number
    "y": 20 // must be a number
}

因此，您需要将数据转换为具有以上格式，如下所示：

$formattedData = [];
foreach( $jsonArray as $data ) {
    $formattedData[] = [
        "label" => $data->Bundesland,
        "x"     => (int) $data->label,
        "y"     => (int) $data->sum
    ];
}

然后最终使用$formattedData这样：

var jsArray = JSON.parse('<?php echo json_encode($formattedData); ?>');

js部分没有其他问题，只有问题是数据格式。

如何将数据从php传递给chart.js

1 个答案:

更新