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>