score:1
Accepted answer
You can set the ticks display to false like so:
options: {
scales: {
y: {
ticks: {
display: false
}
},
x: {
ticks: {
display: false
}
}
}
}
Example:
var options = {
type: 'line',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 0],
borderWidth: 1,
backgroundColor: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"]
},
{
label: '# of Counts',
data: [1, 2, 3, 4, 5, 2],
borderWidth: 1,
backgroundColor: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"]
}
]
},
options: {
scales: {
y: {
ticks: {
display: false
}
},
x: {
ticks: {
display: false
}
}
}
}
}
var ctx = document.getElementById('chartJSContainer').getContext('2d');
const chart = new Chart(ctx, options);
<body>
<canvas id="chartJSContainer" width="600" height="400"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.1.0/chart.js" integrity="sha512-LlFvdZpYhQdASf4aZfSpmyHD6+waYVfJRwfJrBgki7/Uh+TXMLFYcKMRim65+o3lFsfk20vrK9sJDute7BUAUw==" crossorigin="anonymous"></script>
</body>
score:0
if you have a label with ticks you can use
options: {
scales: {
y: {
ticks: {
display: false
},
scaleLabel: {
display: false,
labelString: 'Yaxes scaleLabel text'
}
},
x: {
ticks: {
display: false
},
scaleLabel: {
display: false,
labelString: 'Xaxes scaleLabel text'
}
}
}
}
Source: stackoverflow.com
Related Query
- Chart.js how to show line chart without displaying the labels on xaxis and yaxis
- ChartJS (React) Line Chart - How to show single tooltip with data and labels from 3 (multiple) dataset?
- How remove duplicates xAxis labels and show all values on chart
- How to show tick marks and labels with grid line for the specific one on the X axis with Chart.js?
- how to show X and Y labels on points in Chart js 2 Line Chart
- Chart.js how to show cursor pointer for labels & legends in line chart
- How to align Chart.JS line chart labels to the center
- How to hide the y axis and x axis line and label in my bar chart for chart.js
- How to show data values in top of bar chart and line chart in chart.js 3
- How to draw outer labels for polar chart using ng2-charts and chart.js at fixed positions outside the rings?
- How to change the label and grid line position on a timeseries chart in Chart.js 3?
- How do I customize y-axis labels and randomly pick the value from the data range for x-axis in Chart js
- how can i use chart.js to create a chart that has one time series line and one linear line on it at the same time?
- How to show the chartjs bar chart data values labels as text?
- how to reduce list chart to one and use select dropdown to show selection without refresh page?
- how can i show labels and value in both on bar chart
- X and Y axis labels not displaying on line chart (Chart.js)
- How to plot a line chart which has both the start and points outside the canvas area using Chart.js
- How to show symbols after the label and before the numeric value using chart.js Bar chart in Angular
- How to start the chart from specific time and offest hour and then show the data on chart from target datetime in chartjs
- how to show several labels and data's in the chart.js similar to npmtrend website?
- How to increase the spacing between labels and the chart
- chart js how do I only show just the low/high dots on line chart?
- How to configure chart.js line chart with very low minimum height, and only 0 and 1 (no decimals) as ticks on the y-axis
- How to show the data labels without hovering the mouse on the bubbles
- How to save Chart JS charts as image without black background using blobs and filesaver?
- How to display Line Chart dataset point labels with Chart.js?
- How to add second Y-axis for Bar and Line chart in Chart.js?
- chart js tooltip how to control the data that show
- Show X axis on top and bottom in line chart rendered with Chart.js 2.4.0
More Query from same tag
- Iterating through the same dataset in Chart.js
- Merge 2 charts into 1 chart using update button (chart.js)
- How to address type errors when removing data with chart.js?
- Setting default to 0 in vuechart.js HorizontalBar
- How we embed google analytics chart from google analytic with angular 4?
- How to Draw a line on chart without a plot point using chart.js
- Chartjs different row background colors according to Y axis values
- Chartjs Percents in Legend
- Chart.js dynamic bar width
- How to rename properties in objects that are in an array. What is the right way to solve the task?
- Determining which chart the user has clicked on
- Select missing dates from a table in MySQL
- Chart.js fix minimum axes?
- How to make data appear on the rightmost edge of line graph Chart.js
- Problem creating scatter graph using chart.js
- multiple chartjs charts with the same configuration but different data
- Line chart is not being displayed in Chart.js
- Strange "padding" at chart area after updating chart.js (2.8.0 -> 3.4.1)
- How to generate multi bar chart in Chart.js with php & sql
- Properly scaling xAxis with time in chart.js
- How to rotate to center of a dataset using Chart.js (Doughnut chart)
- Cannot read property 'length' of undefined for ChartJS when I use it inside React
- Why doesn't Chart.js display my output (result of a const function)?
- How to dynamically update Chartjs legend label colors?
- Javascript How to give color using conditional statement based on json array state value
- chart js using for loop
- build dynamic array for charts.js
- Modify the labels in chart.js when I update the chart
- ChartJs(Java) Can I remove only specific gridLines for a Linear Chart withouth removing the labels on xAxis?
- Inject html into ng2-chart tooltip to preview image