score:52
try this, where max is the highest value of your data.
var steps = 3;
new chart(ctx).bar(plotdata, {
scaleoverride: true,
scalesteps: steps,
scalestepwidth: math.ceil(max / steps),
scalestartvalue: 0
});
score:6
as ben bloodworth above mentioned, the easier way is adding in options (precision: 0).
currently working fine in version 3.7.1
options: {
scales: {
y: {
ticks: {
precision: 0
}
}
}
}
score:7
if you like to start in a different number than zero, you have to take that into account:
var step = 5;
var max = 90
var start = 40;
new chart(income).bar(bardata, {
scaleoverride: true,
scalesteps: math.ceil((max-start)/step),
scalestepwidth: step,
scalestartvalue: start
});
score:9
check the chart.js documentation, in the global configuration section:
// boolean - whether the scale should stick to integers, not floats even if drawing space is there scaleintegersonly: true,
score:39
i know this is an old question now, but in the current version (v2.9.3) you can just set the precision of the y-axis ticks to zero to get integers:
options: {
scales: {
yaxes: [{
ticks: {
precision: 0
}
}]
}
}
score:56
i wasn't able to get the existing answers to work for me when using the new version 2 of chart.js, so here's what i found to solve this problem in v2:
new chart(ctx, {type: 'bar', data: barchartdata,
options:{
scales: {
yaxes: [{
ticks: {
stepsize: 1
}
}]
}
}
});
score:150
i handled it this way in new version:
new chart(ctx, {
type: 'bar',
data: chartdata,
options: {
scales: {
yaxes: [{
ticks: {
beginatzero: true,
callback: function(value) {if (value % 1 === 0) {return value;}}
}
}]
}
}
});
Source: stackoverflow.com
Related Query
- Change the Y-axis values from real numbers to integers in Chart.js
- How to change the Y-axis values from numbers to strings in Chart.js?
- how to change the Y-axis values from float number to integer in chartjs?
- How do I change the 'months' language displayed on the date axis in Chart JS?
- How to start the line graph from the left Y axis in a line/bar mixed chart (Chart.js)?
- chart is not getting updated from the values it received from Jquery
- ChartJS : Hook before values are given to doughnut (absolute value in chart and real values in the tooltips)
- Using number/text input field to set the data values in ChartJs stops the chart from being displayed
- ChartJs 2 How to remove numbers from the doughnut chart on loading
- How to remove the extra Y axis from a bar chart in chart.js
- How to stop displaying the data values from different data objects on Chart JS 2.x?
- Chart.js Change color of the values *inside* the bars of a Bar chart
- How to start Y Axis Line at 0 from right for negative values in chart js 2?
- chart does not change the values when the variable changes the value
- I am using chart js to draw a chart. I did everything right but i don't know why the x axis and y axis label is not comming in chart. code below
- Change chart values from API
- ChartJS fails to render one of the lines in cartesian chart following update after change to max Y axis label value
- How do I stop chart js from auto rescaling the y axis upon calling chart.update()?
- In chart.js how can I change the x axis on my line \chart from January-December to October-September? Basically, fiscal year instead of calendar year
- Change the color of displayed values in pie chart
- Change color of X and Y axis values in Chart.js
- Chart Js change text label orientation on Ox axis
- Hide min and max values from y Axis in Chart.js
- Chartjs change the specific label color in x axis in callback function
- How to hide the y axis and x axis line and label in my bar chart for chart.js
- How can I remove extra whitespace from the bottom of a line chart in chart.js?
- Show all values in Chart js y axis
- Chart Js, Style some ticks on the axis differently
- How can I trigger the hover mode from outside the chart with charts.js 2?
- Lift the bar up from the bottom in bar type chart
More Query from same tag
- Why Chart.js v2 time based data not aligning with X axis correctly?
- How to render tooltip text on a different div with Chart.JS
- Papaparse with chart.js not displaying csv value on the x axis
- Using Chart.js in functional React component, not allowing me to toggle data: "properties undefined"
- Change chartType onclick ChartJS
- Chart JS Custom Labels don't work
- Angular-Charts - Pie Chart,show labels inside each slice of data
- Chart.js Start Y-Axis at a defined value
- Can I use a variable as index in for loop in python?
- I am having this error in charts v3 chartjs-chart-treemap: fontColor does not exist in type 'ChartDataset<"treemap", TreemapDataPoint[]>
- Chart.js bezier curve discontinuity
- Uncaught ReferenceError: require is not defined using react-chartjs.min.js
- chart.js animation loading
- How to draw pile/stacked bar chart?
- Chart.js: Dynamic Changing of Chart Type (Line to Bar as Example)
- plot a bar chart.js time series
- Impossible to render multiple charts with chart.js
- Unable to use MyChart function
- Add horizontal Line to my chart.js Barchart
- Adapting a JavaScript code to be dynamic
- Bubble Chart in Chartjs not working
- Chart.js Subtitle won't display
- x-Axis not working because I'm not using correctly moment.js
- Html5 web page with chartjs: loading an external json file and create a line chart
- Chart.js: Disable Y-Axis, when graph is disabled via Legend
- Using ChartJS and JSON to render charts; Appending JSON Data to javascript yields an empty object in console.log
- Styling the middle text of Chart.js's doughnut chart
- Display values in Pareto chart using Chart.js 2.0.2
- Data will not draw onto my chart
- How could i change my JSON structure into chartJS barchart JSON structure?