Chartjs：如何在y軸上僅顯示最大值和最小值

Question

我想覆蓋Chart JS中的漂亮數字算法，並在y軸上只顯示兩個標簽（或刻度）：值的最大值和最小值。 這些值都是浮點數。 我看到回調函數（yAxis.ticks.callback）已經找到了勾號，所以我不認為這是做這件事的地方。 任何幫助，將不勝感激。

Answer 1

您可以使用以下回調函數進行y軸刻度來實現：

callback: function(value, index, values) {
   if (index === values.length - 1) return Math.min.apply(this, dataArr);
   else if (index === 0) return Math.max.apply(this, dataArr);
   else return '';
}

注意：您必須為數據值使用單獨的數組（此處為dataArr ） ，而不是內聯數組。

編輯：

在y軸ticks配置中添加以下內容，使數據點與刻度完全對齊：

min: Math.min.apply(this, dataArr),
max: Math.max.apply(this, dataArr)

---

ᴡᴏʀᴋɪɴɢᴡᴏʀᴋɪɴɢxᴀᴍᴘʟᴇ

 var dataArr = [154.23, 203.21, 429.01, 637.41]; var chart = new Chart(ctx, { type: 'line', data: { labels: ['Jan', 'Feb', 'Mar', 'Apr'], datasets: [{ label: 'LINE', data: dataArr, backgroundColor: 'rgba(0, 119, 290, 0.2)', borderColor: 'rgba(0, 119, 290, 0.6)', fill: false, tension: 0 }] }, options: { scales: { yAxes: [{ ticks: { min: Math.min.apply(this, dataArr), max: Math.max.apply(this, dataArr), callback: function(value, index, values) { if (index === values.length - 1) return Math.min.apply(this, dataArr); else if (index === 0) return Math.max.apply(this, dataArr); else return ''; } } }] } } }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script> <canvas id="ctx"></canvas>