I'm using Chart.js for one of my projects. In which I want to remove border from x/y axis. Any help would be really helpful. Refer Attached Image Please not that I'm not referring to the GridLines(Which I already turned off using scaleShowGridLines : false)
Chart Script
var topVideos = {
labels : ["","","","",""],
datasets : [
{
fillColor : "rgba(2,137,203,1)",
strokeColor : "rgba(220,220,220,0)",
highlightFill: "rgba(2,137,203,0.8)",
highlightStroke: "rgba(220,220,220,0)",
data : [90000, 200000, 70000, 100000, 180000 ]
}
]
}
window.onload = function(){
var ctx = $("#topvideos").get(0).getContext("2d");
window.myBar = new Chart(ctx).HorizontalBar(topVideos, {
responsive : true,
barShowStroke: false,
scaleShowGridLines : false,
barValueSpacing : 7,
barDatasetSpacing : 30,
});
}
Thanks in Advance.
I think you are using a fork of Chart.js and not the actual chart.js (since the current stable version doesn't have horizontal bars)
In Chart.js, you can set the scale line color to a transparent value, like so
window.myBar = new Chart(ctx).HorizontalBar(topVideos, {
scaleLineColor: "rgba(0,0,0,0)",
...
If the fork is from a version after this, the same options should work in your forked library as well.