'Chart.js remove the first vertical line

Is there a way to remove the initial vertical line from the chart without removing the values? chart.js remove vertical line

here is how my options look like:

scales: {
        yAxes: [{
            ticks: {
                beginAtZero: true,
                maxTicksLimit: 5,
                suggestedMax: maxValue
            }
        }],
        xAxes : [{
            categoryPercentage: 1.0,
            display : false, // set this to false to hide the labels under the bars
            gridLines: {
                display: false
            }
        }]
    },


Solution 1:[1]

What you want to remove is probably the border of the chart. In Chart.js v2 I was able to remove this first vertical border by setting drawBorder to false for the grid line configuration:

options: {
    scales: {
        yAxes: [{
            gridLines: {
                drawBorder: false
            }
        }]
    }
}

In Chart.js docs it is explained in https://www.chartjs.org/docs/latest/axes/styling.html#grid-line-configuration.

Solution 2:[2]

Try using the chart option, scaleLineColor, and setting the color to have 0 opacity:

new Chart(ctx).Bar(data, {
  scaleLineColor: 'rgba(0, 0, 0, 0)',
});

http://jsfiddle.net/wb3kcunt/33/

If you are using chartjs v2, then the showBorder option in scales.gridLines should do the trick:

options: {
  scales: {
    gridLines: {
      showBorder: false,
    }
  }
}

See docs: http://www.chartjs.org/docs/#scales

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 marcobiedermann