ChartJS set yAxes "ticks" - javascript

I am trying to adjust the scales on my yAxes and cannot find any
information that isn't outdated.
Basically, I want my yAxes to go from 0 - 100 with steps of 25.
https://codepen.io/brycesnyder/pen/wmJKyv
yAxes: [
{
ticks: {
beginAtZero: true,
steps: 10,
stepValue: 10,
max: 100
}
}
]

To do this, change stepValue: 10 to stepSize: 25, and remove steps: 10,.
See chart.js docs

Related

Chartjs increase grid distance

Image - 1
dates are displayed on the x-axis, values are displayed on the y-axis.
How can I change the interval distance?
You should look at the documentation of chartjs and specifically linear axis:
chartjs documentation
Code Example:
JsFiddle Example
xAxes: [{
type: 'time',
ticks: {
autoSkip: true,
maxTicksLimit: 20
}
}]
Your question is not elaborate enough. Atleast you should have given sample json for the chartjs via which you are plotting. From my understanding this should work :
xAxis: {
ticks: {
maxTicksLimit: 10
}
}

How to set equal width between ticks - chartjs

I have a chart which now looks like this:
xAxes: [{
scaleLabel: {
display: true,
labelString: 'log(Re)',
},
type: 'linear',
ticks: {
suggestedMax: 10000,
maxTicksLimit: 10,
},
afterBuildTicks: function(scale) {
scale.ticks = [1, 10, 100, 1000, 10000]
}
}]
Need to create ticks [1, 10, 100, 1000, 10000], (like in first image), but with equal spacing between this ticks, like here:
Dmytro, I think your basic problem is that the tick marks you want are powers of 10, not plain numbers. Set your tick marks to be 0, 1, 2, 3, 4 and they will be shown at even intervals. Then label them 1, 10, 100, etc. (1=10^0, 10=10^1, 100=10^2, etc). You may have to restructure your data set a bit to get the correct tick mark values in. But that should give you the effect you are after.

Chart.js horizontalBar start bars from custom value

I am using Chart.js horizontalBar.
I need to start the chart from custom value and not zero or lowest number in data, but could not found any way how to achieve this.
beginAtZero: true // I need this to start not from zero, but from my predefined value.
You can set a Min value and a Max value for every axis, in this case you should set it for xAxes
options: {
scales: {
xAxes: [{
ticks: {
Min: 5,
Max: 10,
}
}]
}
}
You can set also a suggestedMin and a suggestedMax that will be ignored if the dataset data exceed the values
options: {
scales: {
xAxes: [{
ticks: {
suggestedMin: 5, // If the actual min value in your dataset is minor of 5, this property will be ignored
suggestedMax: 10, // If the actual max value in your dataset is major of 10, this property will be ignored
}
}]
}
}
Check the Documentation for more info

Set Radar(spider) chart version 2.x (2.4.0) steps(interval) in Chart.js

I have searched to set the steps value but I am not get the answer. If any one know kindly share your thought for steps:
Working As following way:
0
0.5
1
1.5
.
.
5
Expected:
0
1
2
3
4
5
Script:
scale: {
ticks: {
beginAtZero: true,
max: 5,
steps : 1//Not working
}
}
Thanks in Advance.
Very sorry, Small thing finally I got the answer:
scale: {
ticks: {
beginAtZero: true,
max: 5,
stepSize: 1 //working Now
}
}

Highcharts polar steps

I'm trying to make a Highcharts polar chart, see this fiddle: http://jsfiddle.net/mgwf23me/
yAxis: {
min: 0,
max: 11,
labels: {
enabled: false
}
},
The problem is that the yAxis max seems to go by steps of 5. With max on 11, the rendered max step is 15.
How do I change this behaviour to be steps of 1?
This is due to endOnTick being true. From the max API description:
If the endOnTick option is true, the max value might be rounded up.
Set this to false, and the axis should have the correct height.
You may also want to adjust the ticks to make the lines show up appropriately. This can be done in a number of ways, using tickPositions, tickPositioner, tickInterval...
My simple suggestion is to do it like this (JSFiddle):
yAxis: {
min: 0,
max: 11,
endOnTick: false, // For axis height
tickPositions: [0,11], // For grid lines
labels: {
enabled: false
}
}

Categories