score:1
Accepted answer
You have to use the Axis Callbacks (docs), especially afterBuildTicks
.
In my linked example (jsbin) I push 0 to my data because you can't use beginAtZero: true
and remove all the duplicates in the array.
data.push(0); //if 'beginAtZero' is wanted
let uniqueData = data.filter((v, i, a) => a.indexOf(v) === i);
In the options you define the min and max values and the ticks in afterBuildTicks
.
options: {
scales: {
yAxes: [{
ticks: {
autoSkip: false,
min: Math.min(...uniqueData),
max: Math.max(...uniqueData)
},
afterBuildTicks: function(scale) {
scale.ticks = uniqueData;
}
}]
}
}
You will have problems with overlapping ticks but I don't know a general way to prevent that and I don't know your specific use case.
Source: stackoverflow.com
Related Query
- How to show Y axis ticks for every point in the graph
- In Chart.js >3.0, on axis of type time, how to show labels and ticks only for existing data points (make labels reflect data)?
- How to show tick marks and labels with grid line for the specific one on the X axis with Chart.js?
- How to hide the y axis and x axis line and label in my bar chart for chart.js
- PrimeNg bar chart how to show a label for the y-axis
- How to start the line graph from the left Y axis in a line/bar mixed chart (Chart.js)?
- Chartjs: Is it possible to hide the data labels on the axis but show up on the graph on hover?
- How to show different product name for every bar in chart js
- How to show tooltip value of all data falling on the same axis in chart js?
- How to create a graph where the vertical axis (Y-axis) is a string?
- How do I persist the gridlines for ticks that are not displayed? [Chart.js]
- How to change the Y-Axis to show $ in graph
- How show data label in the graph on Chart.js?
- How to get rid of the line on top of every point on a line chart (Chart.js)
- how to show bar graph on y axis in charjs
- Show label for every data point in line chart
- How to change the angle of x axis ticks dynamically based on size of name?
- chart.js how to configure the lable for both axis
- How to pass a variable to the dataset for a graph in chart.js?
- How to update chart at the end of every for loop in Chart.js?
- Ticks for the minimum and maximum values in a Chart.js v2 axis
- how to show bar chart for every product
- how to label the x and y axis - in a line graph
- How do you output the correct value for Chart.js Radar graph on label?
- How to set max and min value for Y axis
- Chart.js how to show cursor pointer for labels & legends in line chart
- How to remove the line/rule of an axis in Chart.js?
- show label in tooltip but not in x axis for chartjs line chart
- chart js tooltip how to control the data that show
- ng2-charts: How to set fixed range for y axis
More Query from same tag
- how can i use chartjs-plugin-annotation?
- How to move Chart.js legend?
- How to stop chartjs zoom more than visible points?
- Chart.js generate chart with foreach mvc
- How to get fixed legend and tooltip for dynamically generated data vue-chartjs
- Chart.js : How to fill the area under the line to a certain point?
- mongoose.Schema for IoT Data Array and fetch the data to chart.js
- chartJS or/and php print_r not working together
- Angular 7 - Labels and Date values
- Chart.js changing the color of the max value bar
- Chart.js Version 3: how to set the different color for tick lines and gridlines
- How to use date in x value for Object[] in chartjs dataset, I am getting an error: 'TS2322: Type 'string' is not assignable to type 'number'.'
- Chart.js:9352 Failed to create chart. Unable to dynamically create charts
- Edit legend labels [vue-chart.js]
- How to set the serifs on the X and Y axes?
- ChartJS2 in Ionic2
- How to fix a stacked logarithmic bar chart values to fit the grid
- Click every label onload ChartJS
- Dynamically create Angular-Chart with data binding
- Chartjs v2 xAxes label overlap with scaleLabel
- Chart.js - Is it possible to have two y axis with positive values one above the other?
- Chart.js - make background text responsive
- Customize Chart js dataset data
- "Does not provide an export named 'Tooltip'," even though I can output Tooltip
- Chart.js mixed chart : Lines not starting at zero
- Remove/Hide (display:none) the graphical chart in small-mobile view - JS chart
- chart.js cuts data points to half
- There's a way to link bars to a file in a chart bar in chart.js?
- Chartjs average line over bars
- Chart doesn't display fonts