score:7
scalefontcolor
is used to change the color of the labels.
instead of putting it in your datasets you should add it as a parameter in your function, like this:
window.myline = new chart(ctx).line(linechartdata, {
responsive: true, scalefontcolor: "#ffffff" }
});
score:0
i found the issue together with kenan
<script>
var randomscalingfactor = function(){ return math.round(math.random()*100)};
var linechartdata = {
labels : ["january","february","march","april","may","june","july"],
datasets : [
{
label: "my second dataset",
fillcolor : "rgba(255, 89, 114, 0.6)",
strokecolor : "rgba(51, 51, 51, 1)",
pointcolor : "rgba(255, 89, 114, 1)",
pointstrokecolor : "#fff",
pointhighlightfill : "#fff",
pointhighlightstroke : "rgba(151,187,205,1)",
maintainaspectratio: false,
data : [1,2,10,7,3,1]
}
]
}
window.onload = function(){
var ctx = document.getelementbyid("canvas").getcontext("2d");
window.myline = new chart(ctx).line(linechartdata, {
responsive: true, scalefontcolor: "#ffffff" }
)};
</script>
it wasnt a normal datatype and i had to adjust the brackets properly!
thanks alot,looks great now.
score:3
in chart.js v3 it can be achieved with:
chart.defaults.color = "#ff0000";
score:4
for chart.js 3.x migration, text-labels on x and y axis are set this way:
set options to the following:
scales: {
x: {
ticks: {
color: "red"
}
},
y: {
ticks: {
color: "green"
}
}
}
similar solution is found if you want to change color of grid lines, inside of x / y value write
grid: {
color: "white"
}
score:29
the working code is this:
chart.defaults.global.defaultfontcolor = "#fff";
have fun :)
Source: stackoverflow.com
Related Query
- chartjs datalabels change font and color of text displaying inside pie chart
- How to add text inside the doughnut chart using Chart.js?
- Chart area background color chartjs
- How set color family to pie chart in chart.js
- Chart Js change text label orientation on Ox axis
- Chart.js line chart set background color
- Chart.js Text color
- How to add text in centre of the doughnut chart using Chart.js?
- Chart.js bar chart : Grid color and hide label
- Unable to parse color in line chart (angular-chart.js)
- set background color to save canvas chart
- Different color for each column in angular-chartjs bar chart
- Chart js. How to align text by the center of the tooltip?
- Chart looks only grey, does not show the color - Chartjs,discordjs
- Chart.js donut chart remains grey - no color
- Can I specify a different font size for each row of text in Chart Title?
- angular-chart.js bar chart with 100% opacity color
- ChartJs line chart - display permanent icon above some data points with text on hover
- Charts.js tooltip overlapping text on chart
- how to set chart.js grid color for line chart
- chart js - Apply different color for each x-axes label
- Chartjs doughnut chart with gradient color
- Bold text inside doughnut chart (chart.js)
- chart.js bar chart color change based on value
- Angular 8 & ChartJs change color in pie chart
- Chart.js - Color specific parts of the background in a line chart
- Adding custom text to Bar Chart label values using Chart.js
- Chart.js different scaleLine color of radar chart (angular)
- How to set single color on each bar in angular chart js
- How can I add some text in the middle of a half doughnut chart in Chart.JS?
More Query from same tag
- Chartjs + DataLabelPlugin: Suddenly data labels are shown in every chart even without the plugin?
- Pause horizontal scrolling in chart.js for real time data
- VueJS + Chartjs - Chart only renders after code change
- how to set the color of all points in a line graph to the same in chart.js?
- How to use images as key for chart.js legend
- ChartJS and Ajax calls
- Unable to separate elements of JSON
- Chart.js chart in vue.js component does not update
- How could i change my JSON structure into chartJS barchart JSON structure?
- chartjs: How to remove specific label
- Chart.js dynamically upating data using variable
- Chart not rendering with pug/jade and nodejs
- How to add image inside the doughnut chart using chart.js?
- Construct a bar chart using chart.js
- what is error can't acquire context from the given item?
- ChartJS Generate Date Format
- Cannot read property 'length' of undefined for ChartJS when I use it inside React
- How to give link for lable/Legend in chart.js? and if the value is 0 how to remove the legend?
- Chart.js how can we have a column not start at 0
- Angular ASP.NET Core Chart.js bug on chart rebuild when filtering the list of values
- Add information on y Chart Js
- Line chart Change background color of shaded region on hover (Chartjs)
- Add Text to Doughnut Chart - ChartJS
- Draw vertical line on horizontalBar at value 2.0
- Escape symbol '<%=' and '%>'
- format y axis labels in bold
- How can I create a vertical scrolling in Chart.js for line chart?
- How do I use the return values from csv ajax request for x and y values?
- is there a way to change the dispaly of a date
- Line Chart with null values: How to keep Lines connected?