在 highstock 上对齐 y 轴刻度“外部”，因此它们与 highcharts 上的相同

Posted 2023-03-14

【中文标题】在 highstock 上对齐 y 轴刻度“外部”，因此它们与 highcharts 上的相同

【英文标题】：Align y axis tick "outside" on highstock, so they are the same as on highcharts

【发布时间】：2013-03-11 15:22:50

【问题描述】：

是否可以在 highstock 图表上将 y 轴刻度“外部”对齐，使其与网格线对齐，而不是“内部”并位于网格线的顶部。 highstock 的文档建议它应该默认放置在“外部”，但是查看 highstock 图表的每个示例，它们似乎总是在“内部”。

tickPosition: String. The position of the major tick marks relative to the axis line. Can be one of inside and outside. Defaults to "outside".

Highchart 示例（我想要的）：http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/

Highstock 示例（我得到的）：http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/stock/demo/basic-line/

非常感谢。

更新 - 各种解决方案

我意识到Highcharts.StockChart 只是highstock.js 文件中Highcharts.Chart 的预配置版本。

HighCharts.Chart 具有 Highcharts.StockChart 的所有功能 - 而不仅仅是 highcharts.js 文件中 Highcharts.Chart 的功能。

因此，我刚刚使用了 highstock.js Highcharts.Chart 和我需要的配置，这将 yAxis 标签放置在正确的位置。

【参考方案1】：

您可以为 yAxis 使用偏移参数。

http://api.highcharts.com/highstock#yAxis.offset

编辑：

http://jsfiddle.net/Z4zwr/1/

 yAxis : 
        labels:
            align:'right',
            x:-10
        ,
        lineWidth : 1,
        offset : 30
    ,

【讨论】：

恐怕这并不能完全解决问题。虽然这会导致数字被“拉”离图表，但它们并不与网格线对齐，并且边框是数字的错误一侧。 Offset fiddle。 Highchart fiddle

【参考方案2】：

我找到了解决方案 (jsfiddle)：将 labels: align: 'left' 添加到您的 yAxis 选项中，如下所示：

yAxis: [
    labels: 
        align: 'left'
    
]

这告诉 Highcharts 将 labels 的 left 端与 y 轴对齐。 p>

更新 jsfiddle：http://jsfiddle.net/r4wrf63u/