score:11
Accepted answer
So I was able to get the colors working by doing this:
datasets: [
{
label: "My First dataset",
fillColor: ["rgba(0,10,220,0.5)","rgba(220,0,10,0.5)","rgba(220,0,0,0.5)","rgba(120,250,120,0.5)" ],
strokeColor: "rgba(220,220,220,0.8)",
highlightFill: "rgba(220,220,220,0.75)",
highlightStroke: "rgba(220,220,220,1)",
data: pokeDataSet
}
Hope this can help someone who has a similar issue!
score:0
The background color will change the color of the bars.
So, you can give different colors to different bar.
datasets: [
{
label: 'My First dataset',
backgroundColor: ['rgba(0,10,220,0.5)', 'rgba(220,0,10,0.5)'],
borderColor: 'rgba(0,0,0,1)',
data: pokeDataSet,
},
],
Source: stackoverflow.com
Related Query
- Can't get bar chart colors in Chart js working in React Js
- Charts.js - Colors for stacked bar on multi-series line/bar chart are not working
- Charts.js - Bar chart different colors for value intervals not working
- Chart js - Get bar width after render
- Angular chart.js onClick is not working - how to get all elements of a bar when it is clicked on
- React ChartJS 2 : Get data on clicking the chart
- Time Series Line chart js in react not working
- Stacked bar chart starting from 0 - ChartJS React
- Chart.js: How to get x-axis labels to show on top of bars in bar chart
- Click on interactive chart.js bar chart and get value for labels and groups in JS
- Chartjs with Vue, Bar Chart Border Radius not working
- Chart.js: Bar chart multiple colors
- Can the colors of bars in a bar chart be varied based on their value?
- How to set X coordinate for each bar with react chart js 2?
- How do I get a different label for each bar in a bar chart in ChartJS?
- I cant get Legend to work for my chartjs donut chart
- Dynamic data in bar chart not rendering React js
- Chart.js in Angular 10: Specified colors not shown in multi-series bar chart (instead random colors)
- Legend color not working with randomly generated background colors in chartjs pie chart
- Vertical align bar chart from chart.js not working
- Unable to create Stacked Grouped Bar Chart with chart.js / react-chartjs-2 in React
- Chart.js colors in bar chart not showing
- How to get clicked bar chart tooltip data?
- How can I get my Chart.JS bar chart to stack two data values together on each bar, and print a calculated value on each bar?
- The colors of the bar chart in chart.js is not showing. I tried background color and fill color but none of it worked
- How can I change the background colors of a bar chart after it has been created?
- How to get bar chart width in pixel
- Chart js bar with the highest value is a different color among the rest - React
- different colors for bar chart with chart.js
- How Can I Get An Instance of a ChartJS Bar Chart Using Angular
More Query from same tag
- yAxis labels are being cut off in ngEchars (Echarts)
- Statistics page - Load every stats <div> one by one
- How to align ChartJS bars to the left?
- Chart JS V3 Tooltip styling location changed?
- Angular-charts/Chart.js is not working
- Update Chart JS with date range selector
- Chart Js change text label orientation on Ox axis
- Chart js always show labels on a doughnut chart
- charts.js global options gridLines
- Chart.js Vertically Aligned points on single x axis
- chart.js v2 - how to 'fill' the graph when using time scale
- Doughnut chart updates with twice the data
- Chart.js not displaying Django Rest API data
- Chart.js - add gradient instead of solid color - implementing solution
- Beginner in JS,Stuck with ChartJS and multiple filters and ways to display
- ChartJS radar scale points
- Mapping issue on Chart Js Bar Chart
- How can I change only a specific option in a chart with chart.js?
- Chart.js custom charts
- How to unregister chartjs-plugin-labels globally?
- Rails 4.2 jQuery loads only after refresh
- chartjs - multi axis line chart - cannot read property 'min' of undefined
- JSON Data in javascript
- how to decrease white space of a card containing pie-chart in mobile view
- How to align multiple x axes in chart.js?
- How can I display the percentage symbol inside the chartjs?
- ChartJS - rolling twenty minute view
- Chart.js legend text showing undefined
- Chart.js - Bar chart: Add text after numbers when h:over a Bar
- Weird time formating with chart.js and moment.js