Javascript 如何在海图中设置轴的最小上限？

我试图设定一个最小上限，具体来说：

• Y轴应从0开始
• Y轴应至少为10或更高（自动缩放）
• Y轴的上限不得小于10

---

好像Highcharts做了些什么，但我不知道怎么做。任何人都有这方面的经验吗？

Hittcharts对所有方法都有很好的文档和示例

在你的例子中，我认为你应该考虑“yAxis”的“min”和“max”属性

敏：号码 轴的最小值。如果为空，则自动计算最小值。如果startOnTick选项为true，则最小值可能向下舍入。默认为空

马克斯：号码 轴的最大值。如果为空，则自动计算最大值。如果endOnTick选项为true，则最大值可能会向上舍入。实际最大值也受chart.alignTicks的影响。默认为空

如果要动态创建图表，则应设置

最小值=0 如果所有数据值小于10，则最大值=10

及

如果值大于10，则仅最小值=0

---

祝你好运。

在图表创建时，Highcharts似乎没有这样做的选项。但是，它们确实公开了两种方法来查询极端值并更改极端值，

getextrems（）

和

setextrems（Number min，Number max，[Boolean redraw]，[Mixed animation]）

在它们的

因此，一个可能的解决方案（创建图表后）：

if（chart.yAxis[0].getExtremes（）.dataMax<10）{
chart.yAxis[0].setextrems（0,10）；
}

yAxis[0]

引用第一个y轴，我假设在这种情况下只有一个轴。说明了如何访问其他轴

---

这并不理想，因为图表必须重新绘制，虽然不太明显，但仍然存在。希望Highcharts能够将这种功能内置到选项中。

尝试设置轴的最小值和以轴为单位的刻度线间隔，如下所示：

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container'
    },
    yAxis: {
        min: 0,
        max: 10,
        tickInterval: 10
    }
});

也不要忘记设置最大值

希望这会有所帮助。

此外，如果计算的最大值位数与所需上限不同，则以下内容可避免潜在的重新定位问题

在我的例子中，我的百分比数据目前正在进入20年代，但我想要一个0到至少100的范围，如果需要的话，可以超过100，因此下面在代码中设置最小值和最大值，然后如果dataMax结果更高，则将最大值重新指定为它的值。这意味着计算图形位置时，始终有足够的空间容纳3位数的值，而不是计算2位数的值，然后通过压缩“100”来打破，但在出现下一个问题之前，最多允许“999”

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        events: {
            load: function(event) {
                thisSetMax = this.yAxis[0].getExtremes().max;
                thisDataMax = this.yAxis[0].getExtremes().dataMax;
                if (thisDataMax > thisSetMax) {
                    this.yAxis[0].setExtremes(0, thisDataMax);
                    alert('Resizing Max from ' + thisSetMax + ' to ' + thisDataMax);
                }
            }
        }        
    },
    title: {
        text: 'My Graph'
    },
    xAxis: {
        categories: ['Jan 2013', 'Feb 2013', 'Mar 2013', 'Apr 2013', 'May 2013', 'Jun 2013']
    },
    yAxis: {
        min: 0,
        max: 100,
        title: {
            text: '% Due Tasks Done'
        }
    }
    //Etc...
});

---

仅使用选项（无事件或函数）执行此操作的一种方法是：

此处

minRange

定义了轴的最小跨度

maxPadding

默认值为0.01，这将使轴长于10，因此我们将其设置为零

---

这将产生与

setExtreme

相同的结果。请参阅。

通过在图表的

load

事件：

newhighcharts.chart（{chart:{events:{load:function（event）{if（this.yAxis[0].getextrems（）.dataMax<10）{this.yAxis[0].setextrems（0,10）；}}}，}，}，}，}，}）太糟糕了，没有一种方法可以更干净地执行此操作。如果我有几分钟的时间，也许我会放弃回购协议并修复它。见昂克洛斯的答案
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        events: {
            load: function(event) {
                thisSetMax = this.yAxis[0].getExtremes().max;
                thisDataMax = this.yAxis[0].getExtremes().dataMax;
                if (thisDataMax > thisSetMax) {
                    this.yAxis[0].setExtremes(0, thisDataMax);
                    alert('Resizing Max from ' + thisSetMax + ' to ' + thisDataMax);
                }
            }
        }        
    },
    title: {
        text: 'My Graph'
    },
    xAxis: {
        categories: ['Jan 2013', 'Feb 2013', 'Mar 2013', 'Apr 2013', 'May 2013', 'Jun 2013']
    },
    yAxis: {
        min: 0,
        max: 100,
        title: {
            text: '% Due Tasks Done'
        }
    }
    //Etc...
});

yAxis: {
    min: 0,
    minRange: 10,
    maxPadding: 0
}