我有一个使用 Chart.js 创建的条形图。我从 PHP 数组中获取数据和标签,如下所示:
for ($i = 0; $i < count($mydata); $i++) {
$labels .= "\"".$mylabels[$i] ."\"". ",\n" // "Label 1", "Label 2", "Label 3", ...
$data .= $mydata[$i] . ",\n" // 34, 12, 64, 12, ...
}
然后我使用以下代码创建图表:
$chart = '
<script>
var data = {
labels: ['.$labels.'],
datasets: [
{
label: "My First dataset",
fillColor: "rgba(220,220,220,0.75)",
strokeColor: "rgba(220,220,220,1)",
highlightFill: "rgba(221, 240, 242, 1)",
highlightStroke: "rgba(204, 231, 234, 1)",
data: ['.$data.']
}
]
};
var ctx = document.getElementById("myChart").getContext("2d");
new Chart(ctx).Bar(data, {
scaleLabel : "<%= value + \" €\" %>",
tooltipTemplate: "<%= \"Project: \" + label %>",
});
</script>';
print($chart);
到目前为止,这工作正常,但我需要在相应的工具提示内显示一个数组。所以这行代码需要修改:
tooltipTemplate: "<%= \"Project: \" + label %>"
首先,我尝试在其中显示一个 PHP 变量,如下所示:
tooltipTemplate: "<%= '. $test .' \"Project: \" + label %>"
编辑:看来我需要像这样显示变量:
tooltipTemplate: " '. $test .'<%= \"Project: \" + label %>"
但是如何循环遍历数组以在相应的工具提示中显示每个元素?
我的代码可能不是那么干净,所以我感谢您的提示和帮助,因为我仍在学习编写干净的代码。
最佳答案
tooltips: {
enabled: true,
mode: 'single',
callbacks:
{
title: function(tooltipItem, data)
{
return cpc_label[tooltipItem[0]['index']];
},
}
},
cpc_label 是我的工具提示标题的 javascript 数组。使用此代码,它使数组在相应的工具提示中显示每个元素。
希望这能解决您的问题
关于javascript - 在 Chart.js 工具提示中显示 PHP 数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32634678/