score:1
this is because the object names of your scales become the id, and since you try to map your datasets to non existent scale id's it creates them for you extra. if you make the axisid prop in your dataset the same as you gave the object name it will work as inteded, see snippet:
<html>
<body>
<canvas id="qgl_chart"></canvas>
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.1.1/dist/chart.min.js" integrity="sha256-lisrn4x2bhaafbiab0h5c7mqjli7n0sh+vrapxjiz3k=" crossorigin="anonymous"></script>
<script>
var ctx = document.getelementbyid("qgl_chart").getcontext('2d');
var mychart = new chart(ctx, {
type: 'line',
data: {
datasets: [{
label: 'left dataset',
yaxisid: 'left-y-axis',
data: [1, 2, 3, 4]
},
{
label: 'right dataset',
yaxisid: 'right-y-axis',
data: [4, 3, 2, 1]
}
],
labels: [1, 2, 3, 4]
},
options: {
scales: {
'left-y-axis': {
type: 'linear',
position: 'left'
},
'right-y-axis': {
type: 'linear',
position: 'right'
}
}
}
});
</script>
</body>
</html>
Source: stackoverflow.com
Related Query
- Y Axes not displaying properly on Chartjs
- ChartJS "half donut" chart not displaying properly
- ChartJS canvas not displaying rgba colors in IE, Safari and Firefox
- ChartJs Not displaying data
- ChartJS shows date, but not time, when displaying labels in time axis
- Chartjs not working with d3 from csv source
- ChartJS not displaying time data using Moment.js
- Chartjs not displaying timed data
- Chartjs not giving 'xLabel' properly on tooltip
- Chartjs Stacked bar chart not displaying correctly
- ChartJS graph not displaying - line graph
- Data not displaying properly in Chart.js line chart
- ChartJS with dates on the X axis not displaying any graph
- ChartJS doughnut chart not displaying colours
- ChartJS stacked bar chart not displaying as stacked
- Bar chart is not grouped properly in chartjs
- 'Chart.js' time chart not displaying properly
- My Chartjs is not updating after setstate full code attached Reactjs Update
- ChartJs tool tips not showing properly
- Chartjs + moment() not displaying on django
- Chartjs custom colors not displaying when dataset is changed
- 'require is not defined' error when attempting to use chartjs in javascript code
- ChartJS canvas not displaying colors in edge browser
- angular chartjs not showing data properly
- ChartJS New Lines '\n' in X axis Labels or Displaying More Information Around Chart or Tooltip with ChartJS V2
- ReferenceError: Chart is not defined - chartjs
- ChartJs title not showing
- Displaying JSON data in Chartjs
- Chart.js: bar chart first bar and last bar not displaying in full
- react-chartjs-2 with chartJs 3: Error "arc" is not a registered element
More Query from same tag
- Why does the horizontal bar size jump when resizing the chart?
- Add percentage to label badge - doughnut chart.js
- Chart.js sciptable options: accessing the values of the data object?
- how to change thickness of two doughnut charts in chartjs
- Legend position is not vertically in middle in Donut chart
- How to update data from ajax call (chart.js)
- How to export a chart in Excel and PDF format using Chart.js
- Chart.js extremely slow on 8 series of 500+ points
- How to colorize individual rings in polar chart background in chart.js/ng2-charts?
- Chart.js Bar and Line chart
- Convert PHP array to chart.js compatible data
- Chart.js - Bar chart with linear cartesian (numerical) X axis?
- How to remove or color line/grid in polar chart area using Chart.js?
- Long text in x-axis is cut in bar graphs ng2-charts
- Chart.js 2 How will I put the dataset inside the bar if it is near the TOP?
- After form submit, function runs quickly and chart.js shows up for a second then goes away
- Show data dynamically in line chart - ChartJS
- Tilting the labels of the x axis to some degrees in chart.js
- Hide empty bars in Grouped Stacked Bar Chart - chart.js
- Vue-Chartjs not rendering graph
- Code doesn't work after updating chart.js versioning
- Chart.js not displaying Django Rest API data
- Data Labels wrongly positioned on bar chart - chartjs
- How to show scale labels and set min/max for yAxes?
- How change all dates in array into date without time - laravel
- How can I create a time series line graph in chart.js?
- How to create a line on a chart using chartjs-plugin-annotation
- Loop datasets into chart.js?
- Can you remove the xAxes border line and keep the ticks only?
- How to get labels on ChartJS Pie chart segments