score:0
the colors of my dataset were inside brackets, that was causing it to be taken as an array, i left only the value.
i hope this helps someone else.
var ctx = document.getelementbyid("mychart")
var mychart = new chart(ctx, {
type: "bar",
data: {
labels: ['product 1','product 2','product 3','product 4','product 5','product 6'],
datasets: [{
label: 'count 1',
data: [10,2,2,2,0,1],
backgroundcolor:
'rgba(255, 99, 132, 0.2)'
}, {
label: 'count 2',
data: [10,5,1,0,5,4],
backgroundcolor:
'rgba(54, 162, 235, 0.2)'
}]
},
options: {
scales: {
xaxes: [{
stacked: true
}],
yaxes: [{
stacked: true,
}]
}
}
});
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.7.3/chart.min.js"></script>
</head>
<canvas id="mychart"></canvas>
attached link in jsfiddle
Source: stackoverflow.com
Related Query
- How to create datasets for all labels for stacked bar in chart.js?
- How to create stacked bar chart using react-chartjs-2?
- How do I create a stacked horizontal bar chart with Chart.js in React?
- How can I create a stacked bar chart with Charts.JS that displays relative rather than absolute values?
- ChartJs - stacked bar chart with groups - how to create second x-axis with stack id
- Chart.js how to display multiple labels on multi bar stacked chart
- How to create Stacked bar chart from JSON in chart.js
- How to create an animate-on-update Stacked Bar chart using Chart.js(or Chartist)?
- How to add data labels in each bar in stacked bar chart in chart.js?
- how to create bar chart with group and sam color for each group using chart.js?
- How can labels/legends be added for all chart types in chart.js (chartjs.org)?
- How to create rounded bars for Bar Chart.js v2?
- Chart.js how to show cursor pointer for labels & legends in line chart
- How to create datasets dynamically for chart.js Line chart?
- How to add second Y-axis for Bar and Line chart in Chart.js?
- How to display inline values in a stacked bar chart with Chart.js?
- Chartjs - show elements in all datasets on hover using bar chart
- How to hide the y axis and x axis line and label in my bar chart for chart.js
- PrimeNg bar chart how to show a label for the y-axis
- Chart.js: Minimum value for x-axis at horizontal stacked bar chart
- How to make bar chart animation where all bars grow at the same speed?
- Chart.js bar chart mouse hovering highlights all the datasets instead of just the selected one
- In Stacked horizontal bar chart how to remove the vertical line in Chart.js?
- How to create a chart that uses strings for both the X and Y axes?
- How to draw outer labels for polar chart using ng2-charts and chart.js at fixed positions outside the rings?
- How to show different product name for every bar in chart js
- How to create a variable for chart js datalabel plugin formatter
- Chartjs stacked bar separate tooltip for all stacked
- How to create Bar chart that gets updated from new ajax requests with ChartJS?
- How to set static labels for ng2-charts bar charts?
More Query from same tag
- Display labels on Chart.js in Ionic 2 app
- Chart.js how to rewrite x for webAPP
- Convert a JSON file to an array in javascript to visualize the data in ChartsJS
- How to hide more than one legend on Chartjs?
- How to get unique variables from nested object?
- How can I add background color of length bars in chart (chartJS)?
- Failing to render chart – "can't acquire context from the given item"
- How to use Utils from Chartjs on Django
- Using unknown number of datasets in Chart.js
- Chart.js doughnut canvas padding
- Chartjs: Is it possible to add phases in line chart?
- ChartJS shows up and disappears
- drawImage not working on canvas
- how can i reset chartjs object all instances and recreate it from scratch?
- Remove padding from chartJs horizontal bar chart
- Number value format with comma and two decimal points
- How to wait for all items to load within ng-repeat before then rendering a chart for each item
- Loading ViewBag data into a chart.js multichart
- chart.js data wont update
- How to take data from an API and create a chart on that using Chart.js and Angular 8?
- text inside the bar - chart.js
- PaddingLeft of afterFit does not work during chart.js option
- Razor chart.js labels/data not in sync
- Why chart renders after second click - react-chartjs-2
- (Angular Ionic) How can I stream my custom data with chartjs-plugin-streaming?
- Get hash value Rails / Chart.JS
- How to convert JSON data to object that contains other objects?
- How to change font weight of footer in tooltips in Chart JS
- generator-angular-fullstack cannot add angular-chart.js
- Bar Chart cannot read data and label in laravel