Chart Js可点击栏
问题描述：
I want to make my chart js bar clickable. I want to add click features such as links. No idea how to proceed. Have read documentation times 10...
<script> var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Now', '-1h', '-2h', '-3h', '-4h', '-5h', '-6h', '-7h', '-8h', '-9h', '-10h', '-11h', '-12h', '-13h', '-14h', '-15h', '-16h', '-17h', '-18h', '-19h', '-20h', '-21h', '-22h', '-23h'],
datasets: [{
label: 'Litraa',
data: [<?php echo "$chart_readings[0]";?>, <?php echo "$chart_readings[1]";?>, <?php echo "$chart_readings[2]";?>, <?php echo "$chart_readings[3]";?>, <?php echo "$chart_readings[4]";?>, <?php echo "$chart_readings3[5]";?>, <?php echo "$chart_readings3[6]";?>, <?php echo "$chart_readings[7]";?>, <?php echo "$chart_readings[8]";?>, <?php echo "$chart_readings[9]";?>, <?php echo "$chart_readings[10]";?>, <?php echo "$chart_readings[11]";?>, <?php echo "$chart_readings[12]";?>, <?php echo "$chart_readings[13]";?>, <?php echo "$chart_readings[14]";?>, <?php echo "$chart_readings[15]";?>, <?php echo "$chart_readings[16]";?>, <?php echo "$chart_readings[17]";?>, <?php echo "$chart_readings[18]";?>, <?php echo "$chart_readings[19]";?>, <?php echo "$chart_readings[20]";?>, <?php echo "$chart_readings[21]";?>, <?php echo "$chart_readings[22]";?>, <?php echo "$chart_readings[23]";?>],
backgroundColor: "rgb(255, 255, 255)"
}]
},
options: {
tooltips: {
mode: 'label'
}
}
});
/*Global settings*/
Chart.defaults.global.defaultFontColor = '#fff';
</script>
我想让我的图表js栏可点击。 我想添加点击功能，例如链接。 不知道如何继续。 已阅读文档时间10 ... p>
＆lt; script＆gt; var ctx = document.getElementById（'myChart'）。getContext（'2d'）;
var myChart = new Chart（ctx，{
type：'bar'，
data：{
labels：[ '现在'，' - 1h'，' - 2h'，' - 3h'，' - 4h'，' - 5h'，' - 6h'，' - 7h'，' - 8h'，' - 9h'，' -10h'，' - 11h'，' - 12h'，' - 13h'，' - 14h'，' - 15h'，' - 16h'，' - 17h'，' - 18h'，' - 19h'，' -20h'，' - 21h'，' - 22h'，' - 23h']，
datasets：[{
label：'Litraa'，
data：[＆lt;？php echo“$ chart_readings [0]” ;？＆gt;，＆lt;？php echo“$ chart_readings [1]”;？＆gt;，＆lt;？php echo“$ chart_readings [2]”;？＆gt;，＆lt;？php echo“$ chart_readings [3] “;？＆gt;，＆lt;？php echo”$ chart_readings [4]“;？＆gt;，＆lt;？php echo”$ chart_readings3 [5]“;？＆gt;，＆lt;？php echo”$ chart_readings3 [6 ]“;？＆gt;，＆lt;？php echo”$ chart_readings [7]“;？＆gt;，＆lt;？php echo”$ chart_readings [8]“;？＆gt;，＆lt;？php echo”$ chart_readings [ 9]“;？＆gt;，＆lt;？php echo”$ chart_readings [10]“;？＆gt;，＆lt;？php echo”$ chart_readings [11]“;？＆gt;，＆lt;？php echo”$ chart_readings [12]“;？＆gt;，＆lt;？php echo”$ chart_readings [13]“;？＆gt;，＆lt;？php echo”$ chart_readings [14]“;？＆gt;，＆l t;？php echo“$ chart_readings [15]”;？＆gt;，＆lt;？php echo“$ chart_readings [16]”;？＆gt;，＆lt;？php echo“$ chart_readings [17]”;？＆gt; ，＆lt;？php echo“$ chart_readings [18]”;？＆gt;，＆lt;？php echo“$ chart_readings [19]”;？＆gt;，＆lt;？php echo“$ chart_readings [20]”;？＆gt ;，＆lt;？php echo“$ chart_readings [21]”;？＆gt;，＆lt;？php echo“$ chart_readings [22]”;？＆gt;，＆lt;？php echo“$ chart_readings [23]”;？ ＆gt;]，
backgroundColor：“rgb（255,255,255）”
}]
}，
选项：{
工具提示：{
模式：'标签'
}
} \ n}）;
/ *全局设置* /
Chart.defaults.global.defaultFontColor ='＃ff';
＆lt; / script＆gt;
code> pre>
div>
答
If you are using chart.js 2.4+(maybe erlier), there is a onclick event that is very usefull. I'm useing it on a stacked bar chart, so it should work for you too. You can find it under common chart configuration in the documentation.
options:{
onClick: graphClickEvent
}
function graphClickEvent(event, array){
if(array[0]){
foo.bar;
}
}
Hope this helps.