score:5
figured it out. instead of supplying the max value on the y axis as i have been, i instead implemented the afterbuildticks callback and updated the ticks to have the correct increments.
yaxes: [{
afterbuildticks: function(scale) {
scale.ticks = updatechartticks(scale);
return;
},
beforeupdate: function(oscale) {
return;
},
ticks: {
beginatzero:true,
// max:plugin.settings.maxdatavalue,
maxtickslimit: 10
}
}]
my updatechartticks function loops over the existing ticks and determines the correct increment amount between the ticks. then i use that value to add my final "tick" which will always be greater than the largest data in the dataset.
var updatechartticks = function(scale) {
var incrementamount = 0;
var previousamount = 0;
var newticks = [];
newticks = scale.ticks;
for (x=0;x<newticks.length;x++) {
incrementamount = (previousamount - newticks[x]);
previousamount = newticks[x];
}
if (newticks.length > 2) {
if (newticks[0] - newticks[1] != incrementamount) {
newticks[0] = newticks[1] + incrementamount;
}
}
return newticks;
};
score:16
i too had the same problem. you needn't write any special function for determining the max value in the yaxes. use 'suggestedmax' setting. instead for setting 'max' as maximum value in your graph, set suggestmax as the maximum value in your graph. this never works if you have set 'stepsize'.
options: {
scales: {
yaxes: [{
ticks: {
suggestedmax: maxvalue+20
}
}]
}
}
20 is added, so that the tooltip on max value will be clearly visible.
for more info, refer http://www.chartjs.org/docs/latest/axes/cartesian/linear.html#axis-range-settings
Source: stackoverflow.com
Related Query
- Chart.js - Setting max Y axis value and keeping steps correct
- How to set max and min value for Y axis
- Obtain max value of y axis of line chart rendered with Chart.js
- 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
- ChartJS fails to render one of the lines in cartesian chart following update after change to max Y axis label value
- Chart.js with line chart and bar chart - bar chart not rendered although the max value of it is shown
- In Chart.js set chart title, name of x axis and y axis?
- Set min, max and number of steps in radar chart.js
- ChartJS: How to set fixed Y axis max and min
- Chartjs 2 - Stacked bar and unstacked line on same chart with same y axis
- Hide min and max values from y Axis in Chart.js
- Show X axis on top and bottom in line chart rendered with Chart.js 2.4.0
- How to hide the y axis and x axis line and label in my bar chart for chart.js
- Remove the label and show only value in tooltips of a bar chart
- Map event position to y axis value in chartjs line chart
- to increase space between x axis and first horizontal bar in chart js
- Minimum value for x Axis doesn't work for horizontal bar chart | ChartJS
- Chartjs - Set start and end value into a Bar Chart
- Setting up min and max in chartjs did not work
- How do I customize y-axis labels and randomly pick the value from the data range for x-axis in Chart js
- How to sort XY line chart tooltip items based on value and add thousands separators?
- ChartJS automatically scaled chart has undefined min and max
- Click on interactive chart.js bar chart and get value for labels and groups in JS
- How to set the xAxes min and max values of time cartesian chart in Chart.js
- chart js - bar chart with time scale on Y axis in Hours and Minutes
- How to set y axis to the max dataset value in Chartjs?
- Chart.js two y axes line chart tooltip value incorrect for 2nd y axis
- Setting min and max values chart.js
- How to show tooltip value of all data falling on the same axis in chart js?
- how to disable last/max value shown on x axis in chart js?
More Query from same tag
- How to add new x axis in chart JS?
- Adding image on chart js
- Doughnut chart updates with twice the data
- How can I automatically rescale the y axis of my log chart using ChartJS?
- Highlight a particular point in chart JS
- Chartjs chart not rendering with pug template
- Chart.js chart.update() method is not doing anything
- How to store a chart.js chart options in another file in AngularJS
- Ember.Computed is not a function
- Multiple Graphs on one page
- ChartJS - Y Axis line not drawing
- How to set up a simple pie chart using React in ChartJS on codesandbox
- Chart.js 3.5: linear gradient doesn't apply properly when multiple bars in the same chart
- Chartjs Overlap click function doesnt work
- Changing Chart.js chart type doesn't remove older axis
- How to create a pannable real-time chart
- Chart.js extremely slow on 8 series of 500+ points
- How to remove the Legend of chart from angular Chart.js
- Charts.js line chart, how to hide y-axis start and end label if data is same
- How to add space between two scales in chart-js?
- How can I set the yAxis scale for the chart?
- How to set the serifs on the X and Y axes?
- ChartJs - Adding padding after Y- Axis
- Additional line in BarChart (Charts.js)
- Chart.js charts not rendering data until I inspect element, is it because of async?
- Chart.js canvas and chart width gets overwritten when redrawn
- How to make Chart JS ignore the scale between DatasSets
- chartjs show dot point on hover over line chart
- ChartJs 3.x: ResizeObserver is not a constructor
- Chart.js responsive pie chart