score:2
Accepted answer
you can set the defaults for this. you can set it in the scale
default so it does it for all the chart types and scales. if you specifically want to hide the x axis gridlines only you need to set it on chart type level.
chart.defaults.scale.gridlines.display = false // hides all the gridlines in all charts for all axes
chart.defaults.line.scales.xaxes[0].gridlines = {
display: false
} // hides only the x axes gridlines in all line charts
var options = {
type: 'line',
data: {
labels: ["red", "blue", "yellow", "green", "purple", "orange"],
datasets: [{
label: '# of votes',
data: [12, 19, 3, 5, 2, 3],
borderwidth: 1
},
{
label: '# of points',
data: [7, 11, 5, 8, 3, 7],
borderwidth: 1
}
]
},
options: {
scales: {
yaxes: [{
ticks: {
reverse: false
}
}]
}
}
}
var ctx = document.getelementbyid('chartjscontainer').getcontext('2d');
new chart(ctx, options);
<body>
<canvas id="chartjscontainer" width="600" height="400"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.9.4/chart.js"></script>
</body>
Source: stackoverflow.com
Related Query
- ChartJS 2 How to globally remove xAxis gridLines?
- How to remove gridlines and grid labels in Chartjs Radar?
- how to change background in chartjs and remove background lines?
- How to add ChartJS code in Html2Pdf to view image
- ChartJs - Pie Chart - how to remove labels that are on the pie chart
- How to remove bars for those bars with zero value in Chartjs bar chart?
- How to increase gaps between vertical gridlines in chartjs
- How to remove some points in chartjs
- How do I add time sourced from an external source as an X axis to a ChartJS graph?
- How to only draw the graph and the Xaxis gridlines using chart.js
- How to add new data point and remove leftmost data point dynamically in Chartjs
- how can i remove the grid lines in chartJs
- How to remove the unnecessary overlaying gridlines using Chart.js?
- Chartjs Radar chart - How to dynamically highlight one of the gridlines at a specific point
- How to remove all gridlines and ticks all lines in lines chart in javascript taken from cdn)
- ChartJs 2 How to remove numbers from the doughnut chart on loading
- How to remove a label in top of bar in chartjs chart
- How to remove the coloured rectangle(dataset label) in chartJS
- How to remove old chart and append new chart to div using chartjs
- How remove duplicates xAxis labels and show all values on chart
- ChartJs - Doughnut Chart - how to remove labels if percentage is less than a limit
- how to remove duplicate data set labels in chartjs
- how to remove odd number from yaxes in chartjs using angular?
- How to remove legend at the bottom of chartjs doughnuts
- How to run Chart.js samples using source code
- ChartJS v2: how to remove strange line in Line Chart
- How do I remove CSS code arriving in my webpage?
- How to add space Between Columns in Bar chartjs and remove the space in the end
- ChartJS Line Charts - remove color underneath lines
- How to set ChartJS Y axis title?
More Query from same tag
- display data on chart.s
- Dollar sign on y-axis with ChartJS
- Vue and Chartjs - Running a simple example of vue-chartjs
- How can I add shadow color below the line in chart.js charts?
- Chart.js Show Label near Line in combined Chart
- Not sure how to rerender chart in the app
- Legend position is not vertically in middle in Donut chart
- is it possible to sum up the properties of an array of objects and to filter it according to another property?
- Is there a way to change color of a chart's grid in y-axis - ng2-charts
- Chart.js time scale showing one of the dates wrong
- Angular ng2-charts chartsjs-plugin-labels options not working
- Angular-Chart-JS - Line chart with different fill colors according to points' range
- ChartJS - How to provide datasets an array of objects
- I have a setInterval function that graphs.
- Chart.js multi line chart that has different labels
- Legend on chart.js
- Displaying JSON data in Chartjs
- Chart.js not working - Uncaught RefernceError:
- React with chart js, labelling problems in multiple datasets for doughnut chart
- chart.js draw custom grid lines
- Angular Chart.js Multiple Canvas
- Why is chartjs treating these arrays differently?
- Can't increase font size in google bar chart
- Why isn't my X axes on my bar chart starting from zero?
- Chart JS not reloading in Partial View
- Print chart in Chrome build by Chart jS using javascript
- Chart.js formatting data values
- Setting axis scales in ChartsJS
- Adding additional data to chart
- chart.js coffeescript can't find variable