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

Question

我想重寫Chart JS中的漂亮數字算法，並在y軸上僅顯示兩個標籤（或tick）：最大值和最小值價值。這些值都是浮點數。我看到回調函數（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軸以下蜱配置，以使數據點與蜱完全一致：

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>