javascript - 仅显示 Highcharts 中使用过的刻度

Question

如何在右侧 Y 轴上仅显示已使用的区域？

Highcharts.chart('container', {
		chart: {
            defaultSeriesType: 'line',
    },
    xAxis: {
            gridLineWidth: 1,
            minorGridLineWidth: 1,
            type: 'datetime',
            tickInterval: 3600 * 24 * 30 * 1000,
            labels: {
                rotation: -45,
                formatter: function () {
                		var monthNames = ["January", "February", "March", "April", "May", "June",
                        "July", "August", "September", "October", "November", "December"
                    ];
                    
                    var monthStr = monthNames[new Date(this.value).getMonth()];
                    return monthStr;
                }
            }
        },
    yAxis: [{
            title: {
                text: null
            },
            gridLineWidth: 1,
            minorGridLineWidth: 1,
                        labels: {
                formatter: function() {
                    return this.value * 100 + " %";
                }
            },
            tickInterval: 0.2,
            opposite: true,
            min: 0
    },{
                title: {
                text: null
            },
            gridLineWidth: 1,
            minorGridLineWidth: 1,
             min: 0
    }
    ],

    series: [{
            name: "left",
            data: [[1485896400000,8086.829999999999],[1488315600000,9575.62],[1490994000000,8446.84],[1493586000000,9959.93],[1496264400000,9246.06],[1498856400000,2346]],
            yAxis: 1,
            marker: {
                symbol: 'circle'
            }
        },{
            name: "right",
            data:  [[1485896400000,0.7920220246886492]
            ,[1488315600000,0.7950181534688361]
            ,[1490994000000,0.8068168576051594]
            ,[1493586000000,0.850108440799688]
            ,[1496264400000,0.8010823118430489]
            ,[1498856400000,0.8243148278285313]],
            yAxis: 0,
            colorIndex: 3,
            marker: {
                symbol: 'circle'
            }
        }]

});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container"></div>

我需要缩放右侧 yAxis，因为这些值很小 (79% - 85%)。

Answer 1

您当前为右 Y 轴设置了 tickInterval: 0.2 和 min: 0。如果删除这两个设置，Y 轴将缩放以适合数据。查看更新的 fiddle : https://jsfiddle.net/935dkrqm/2/我还为您的工具提示添加了格式化程序，以便您可以正确地看到百分比系列的值。

tooltip: {
            pointFormatter: function(){
              return '<b>' + Highcharts.numberFormat(this.y * 100, 2)  + '%</b>'
              }
         }