0
例が添付されています。何らかの理由で私が傾けて、xまたはy軸のラベルを線グラフ（チャート）に表示させてください。コードを以下に示します。私は考えることができるすべてを試しました！ 軸のラベルを表示する必要があります。ラベルコードはそこにありますが、何かがオフですか？ 私は少なくとも下軸に時間を表示するためにx軸を持つ必要があります。XおよびY軸ラベルが折れ線グラフ（Chart.js）に表示されない
var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ["0", "5", "10", "15", "20", "25"],
datasets: [{
label: 'HR/Bpm',
data: [72, 175, 72, 175, 72, 72],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255,99,132,1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}
]
},
options: {
title: {
display: true,
text: '(Expected) Physical Work Load'
},
scales: {
yAxes: [{
scaleLabel: {
display: true,
labelString: 'HR (Bpm)'
},
ticks: {
beginAtZero:true
}
}],
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: 'Time (Mins)'
}
}],
}
},
});
</script>
</div>
</div>
<div class="gantry-width-50">
<div class="gantry-width-spacer">
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.min.js"></script>
<canvas id="doughnut-chart" width="380" height="280"></canvas>
<script>
new Chart(document.getElementById("doughnut-chart"), {
type: 'doughnut',
data: {
labels: ["Technical", "Tactical", "Social", "Physical"],
datasets: [
{
label: "Population (millions)",
backgroundColor: ["#3e95cd", "#3d6b1f","#e6e600","#ff3300"],
data: [27,67,34,14]
}
]
},
options: {
legend: {
display: true,
position: "right",
labels:{
boxWidth:10 //Width legend colorbox
}
},
title: {
display: true,
text: 'Content Distribution'
}
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.min.js"></script>
<canvas id="myChart" width="400" height="300"></canvas>