Highcharts : hiding bottom-most x axis grid line

Question

I am using Highcharts for one of my stock project. Everything is okay except I could not hide the bottom grid line in x axis as shown in the attached image.

Updates: Here is the fiddle link

I have the following properties in my 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'
                }
            }
        },

Is there a way to hide that line but display the months numbers at the bottom?

Answer 1

Here is a fiddle with your solution. You needed to add:

            lineColor: 'transparent',

To each axis.