Highcharts的X轴刻度线以偏移开始。

Question

我正试图删除 offset 滴答 x-axis.

我要第一个刻度 10/8 从 x-axis 和 y-axis 交叉点。

10-8 应该在两个标签之间的标记上。

我在highchart中使用了以下代码，最大padding和最小padding都设置为0，所以我不知道问题出在哪里？

xAxis: {
            categories: categories,
            title: {
              text: title_x_axis,
              style: {
                fontWeight: 'bold'
              },
              formatter: function(){
                return "<h3><b>" + this.value + "</b></h3>";  
              }
            },
            min: 0,
            startOnTick: true,
            endOnTick: true,
            minPadding: 0,
            maxPadding: 0,
            align: "left"               
        },

最大padding和最小padding都设置为0，所以我不知道问题出在哪里？

EDIT.我在高图中创建了一个新的标签，它的最大padding和最小padding都设置为0，所以我不知道问题出在哪里？

我创建了一个... 抚弄 注意下面的图片有不同的X轴值，因为我没有使用相同的fiddle值。tickmarkPlacement: "on" 在我拍下那张快照后，我想 Jan 标签从行首开始。目前有一些偏移。

谁能帮我解决这个问题？

Answer 1

你可以使用（假设 "类别 "是你的类别数组）。

 min: 0.5,
 max: categories.length-1.5,
 startOnTick: false,
 endOnTick: false,

例如 http:/jsfiddle.net27hg0v061。

使用newset版本的highcharts来获得完全有效的工具提示。

<script src="http://github.highcharts.com/highcharts.js"></script>

Answer 2

看看tickMarkPlacement属性。

• http:/api.Highcharts.comhighcharts#xAis.tickmarkPlacement。

默认情况下，它是 "介于"，这是你在图表上看到的。

将其设置为 "on "应该可以满足您的需求。

除了tickMarkPlacement之外，你还可以查看minPadding和maxPadding属性。

• http:/api.Highcharts.comhighcharts#xAis.minPadding

• http:/api.highcharts.comhighcharts#xAis.maxPadding。

Answer 3

更新了Fiddle。

$(function () {
    $('#container').highcharts({
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
            tickInterval: 1,
            tickmarkPlacement: "on",
            startOnTick: true,
            endOnTick: true,
            minPadding: 0,
            maxPadding: 0,
            offset: 0
        },
        plotOptions: {
          series: {
            findNearestPointBy: 'x',
            label: {
              connectorAllowed: false
            },
            pointPlacement: 'on'
          }
        },
        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
        }]
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="height: 400px"></div>

你只需要在series对象前添加以下内容。

plotOptions: {
          series: {
            findNearestPointBy: 'x',
            label: {
              connectorAllowed: false
            },
            pointPlacement: 'on'
          }
        },

Answer 4

在plotOptions中添加pointPlacement: 'on'.

plotOptions: {
    series: {
     pointPlacement: 'on'
   }
}