score:1
The link https://www.chartjs.org/docs/latest/developers/updates.html has pretty up to date information. the keey is to recognise what the chart object is. :) I struggled for half a day reading various pages until i found the right way
- use the baseChartDirective to access the chart directly by doing this -> this.chart
- To update scales do this:
var barChartOptions = { legend: { display: true }, scales: { yAxes: [{ id: 'yaxis', type: 'linear', position: 'left', ticks: { min: 0, max: maxScale } }]} }; this.chart.chart.options = barChartOptions;
- then update the chart:
this.chart.chart.update();
you can pretty much update everything. Just need to realise what the chart object means in this page: https://www.chartjs.org/docs/latest/developers/updates.html :)
score:5
This is my solution for Line Chart.
You can use 'beforeFit' callback function that you can find here in the docs http://www.chartjs.org/docs/latest/axes/
- In scale.chart.config.data.datasets you have the chart dataset
- You must set the scale.options.ticks.max
Example:
scales: {
yAxes: [{
beforeFit: function (scale) {
// See what you can set in scale parameter
console.log(scale)
// Find max value in your dataset
let maxValue = 0
if (scale.chart.config && scale.chart.config.data && scale.chart.config.data.datasets) {
scale.chart.config.data.datasets.forEach(dataset => {
if (dataset && dataset.data) {
dataset.data.forEach(value => {
if (value > maxValue) {
maxValue = value
}
})
}
})
}
// After, set max option !!!
scale.options.ticks.max = maxValue
}
}
I hope I've been helpful.
score:13
found the Solution myself.
to change any options of the chart:
myBar.config.options
in my case
myBar.config.options.scales.yAxes[0].ticks.max = newValue
after this you have to call
window.myBar.update();
Source: stackoverflow.com
Related Query
- how to update chartjs2 option (scale.tick.max)
- Chart.js how define max tick of polarArea?
- How to run Chart.js samples using source code
- How to set max and min value for Y axis
- How to format x-axis time scale values in Chart.js v2
- How do I prevent the scale labels from being cut off in chartjs?
- How to prevent first/last bars from being cut off in a chart with time scale
- ChartJS: How to set fixed Y axis max and min
- How to use percentage scale with Chart.js
- How to make integer scale in Chartjs
- chartjs : how to set custom scale in bar chart
- How to assign a logarithmic scale to y axis in chart.js?
- Chartjs: how to show only max and min values on y-axis
- How to add padding to the vertical scale (X-axis) in Chart.js?
- How to set time scale zoom in ChartJS?
- ChartJS -- How do I change scale color when I have to scales?
- How to update data Chart in async way in Angular Chart.js?
- Chartjs: How to create padding between ticks and scale label
- How can I sort, insert in between and update full dataset in chartjs?
- How to add ChartJS code in Html2Pdf to view image
- ChartJS How to set max labels for X axis?
- Chartjs in Reactjs - how can I update data dynamically?
- How to define chart.js time scale date formats
- Chartjs v2.5 - only show min and max on scale, absolute positioning on scale
- How do I force Chart.js axes min and max with react-chartjs-2?
- How to Create Chart.JS Bar Graph with Min, Max & Average
- dynamically update the scale type of chartjs graph
- How do I add time sourced from an external source as an X axis to a ChartJS graph?
- chart.js how to show tick marks but hide gridlines
- How to show scale labels and set min/max for yAxes?
More Query from same tag
- Keeping scales in sync across multiple graphs or dynamically changing scales
- How to set and adjust plots with equal axis aspect ratios - CHART.js
- Trying to get total sum based on months on ApexCharts with Php
- Error with Chart.js : TypeError: t is undefined
- Second yAxes values not charting correctly with Chart.js
- how to fix this error Array to string conversion in laravel and chartjs?
- How to create dynamically chart for Ionic App with Firebase data?
- ChartJS Line Chart shoud not start at 0 with all Lines
- Provide Chart.js with data via AJAX JSON not working?
- How to create a pannable real-time chart
- show name on yaxis in chart.js
- HTML5 Canvas expanding the draw area after drawing
- Chart.js - Color specific parts of the background in a line chart
- Chart.js how to display % on tooltip
- Chart JS showing empty chart without any data
- How to 1. pass two datasets and 2.have permanent label on charts in Chartjs
- Charts js not showing
- Update chart.js after form submission and page reload
- What are these line-boxes called in Chart.js, and how do I turn them off?
- Pass variable from function js to other function js
- Partitioning radar graph in chart.js by sector
- Convert FirestoreCollection into an array?
- How to import Chart.js with Webpack
- Chart.js: Legend doesn't update on first call to chart.update()
- new dataset is not accepted by chartj template
- Plotting objects in Chart.js
- Dynamically set data on Angular-chart.js
- add labels dynamically in Charts.js
- Canvas JS using ajax call
- Two charts using same options, but I need different titles for the charts