score:6
i've found a solution by myself. i wasn't aware that there are different versions of chart.js
i am using v2.0 and there exists a property named pointbackgroundcolor
var ctxline = document.getelementbyid("linechart").getcontext('2d');
linechart = new chart(ctxline, {
type: 'line',
data: {
labels: dates,
datasets: [{
data: ['...'],
backgroundcolor: "rgba(52,152,219,0.4)",
pointbackgroundcolor: "#fff"
}]
}
});
score:1
it looks like chart.defaults.global.elements.point.backgroundcolor
only takes a single color string.
i don't believe would be possible to have different colored points. here is the documentation page for it.
i tried to plug in an array into that backgroundcolor property but it defaulted to a different color. have a look at this fiddle, if you want to play around.
you could always submit a feature request.
Source: stackoverflow.com
Related Query
- Chart.js data background color is overwriting point background color
- Background color does not work when trying to create my data before using scatter chart with chart.js
- Chart area background color chartjs
- ChartJS - Different color per data point
- line chart with {x, y} point data displays only 2 values
- Chart.js line chart set background color
- set background color to save canvas chart
- ChartJS: Draw vertical line at data point on chart on mouseover
- Chart.js - Color specific parts of the background in a line chart
- Chart JS: Ignoring x values and putting point data on first available labels
- Chart js background color changes on click
- Change the background color of tooltip dynamically using chart color
- Remove background color in chartjs line chart
- Chart.js Bar Chart with a switch/radio button to group data / Troubleshooting bar color
- How to change background color of labels in line chart from chart.js?
- Background color of the chart area in chartjs not working
- Chart JS Line Graph multitooltipkey background color issue
- Change background point color at runtime for angular ng2-charts / chartjs
- How can i give the full Legend a background color in chart js?
- How to make the background color of the chart as gradient using Chart.js
- How to add unused data background to bar in chart js
- Legend color not working with randomly generated background colors in chartjs pie chart
- How can I add background color of length bars in chart (chartJS)?
- Chart.js How can I embed additional values to each data point in radar chart
- Is it possible to set the background color of a sector in a radar chart in Chart.js?
- How to assign different background colors to chart.js pie chart data set?
- The colors of the bar chart in chart.js is not showing. I tried background color and fill color but none of it worked
- Chart.js Polar Area Chart scale background color
- How do I destroy/update Chart Data in this chart.js code example?
- Chart.js - Give specific circles a background color in a bubble chart
More Query from same tag
- Bar labels in Legend
- Chart.js - annotation Vertical line moves with mouse in Angular 6
- ChartJS set default options only to specific Canvas, not globally
- JavaScript & HTML - reusing data from fetch()
- Chart.js, set a max value
- I'm unsure of how to get vue js and charts js to work together. correctly
- Dynamically populating data into chart in Chart.js
- Chart.js dynamic bar width
- charts.js Stacked Bar Graphs - selecting row and dataset selected
- vue-chartjs load data from parent component
- Prevent scroll when calling update()
- AddData in Chart.js 2.0
- Query with empty results laravel eloquent
- Customizing Chart.js troubleshoot
- How to toggle one of multiple y axis on chart.js
- ChartJS Scatter plot with JSON list variable not working
- ChartJs: Different color fill between points makes lines straight...need curves (lineTension)
- Trouble with setting background color for Line chart at Chartjs version 3.5.1
- Updating data in chart.js
- How to sort MMMYY on Chart.Js and display the values that match the month?
- Chart.js yAxes Ticks stepSize not working (fiddle)
- Adding hours and minutes to a date object for time axis
- angular-chart.js : how to show numbers in each bar of stacked bar chart
- custom tooltip opacity always 1
- How can I divide this Object.values with the total?
- chart.js radar pointLabel options not working
- Set max value of chart.js bar chart
- Chart.js what is the new syntax for extending?
- How to add a horizontal line at a specific point in chart.js when hovering?
- Chart.js - Line Chart format data to Lacs/Crores