logo标签列表

Highcharts：如何隐藏最底部的X轴网格线

javascripthighcharts
5

我正在使用Highcharts做我的股票项目。除了x轴底部的网格线无法隐藏外，一切都正常，如下图所示。

This image

更新: 这是JSFiddle link。

我在我的Javascript中有以下属性：

xAxis: {
            type: 'datetime',
            maxZoom: 30 * 24 * 3600000,
            tickInterval: 24 * 3600 * 1000,
            tickLength: 0,
            dateTimeLabelFormats: {
                day: '%e'
            },
            labels: {
                y: 24,
                style: {
                    fontSize: '1.6em',
                    fontWeight: 'normal',
                    fontFamily: 'standardCondensed',
                    color: '#bcbdbd'
                }
            },
            plotLines : [{
                value : (function() {
                        // To Do ...
                    })(),
                color : '#39484d',
                dashStyle : 'solid',
                width : 32,
                label : {
                    text : ''
                }

            }]
        },
        yAxis: {
                title: {
                text:   ''
            },
            opposite: true,
            min: 0,
            plotLines: [{
                value: 0,
                width: 1,
                color:  '#808080'
            }],
            labels: {
                format: '${value}',
                y: 20,
                style: {
                    fontSize: '2em',
                    fontWeight: 'normal',
                    fontFamily: 'standardCondensed',
                    color: '#bcbdbd'
                }
            }
        },

有没有一种方法可以隐藏那条线，但在底部显示月份数字？
我猜这可能与宽度或虚线样式有关？如果这些不起作用，将颜色改为与背景融合。 - 提供一些示例数据，我会进行调试。 - Jordan.J.D
我正在制作一个fiddle，我会尽快发布我的fiddle。 - jeewan
这是我刚刚制作的fiddle http://jsfiddle.net/vgaJd/ 我需要隐藏所有水平网格线，但不隐藏数字。 - jeewan
1个回答
4

这里有一个使用你的解决方案的代码片段。你需要添加：

            lineColor: 'transparent',

每个轴。
我已经在我的项目中尝试过了。在你的fiddle中，我仍然看到最后一条水平线，我需要隐藏它。 - jeewan
@jeewan 如果您可以将您的fiddle更新得更像您的项目，那将会更容易一些。虽然我仍会尝试不同的方法。 - Jordan.J.D
我在fiddle中没有包含我的CSS，所以它看起来不同，但这应该无关紧要，因为我只需要隐藏最后一个底部水平线，我认为这与配置Highcharts插件的属性有关。（我在项目中设置了背景图像，如您在图像中看到的，但它不在fiddle中，这就是为什么您看到差异的原因） - jeewan
1
哇，太棒了，这个方法可行。谢谢，我会在几分钟内接受你的答案 :-) ... 非常感谢你。 - jeewan
1
我刚刚发现，您不需要在yAxis中添加那些属性，只需在xAxis中添加即可，但是在yAxix中还需要更新一个属性plotLines->width，将其设置为0。我已经在yAxis中删除了这些属性，并更改了plotLines如下： plotLines: [{ value: 0, width: 0, // it was 1 before color: '#808080' }], 再次感谢JordanD，祝您有美好的一天 :-) - jeewan
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接