在 Chart.js 中更改 X 和 Y 轴值的颜色 [英] Change color of X and Y axis values in Chart.js

查看:61
本文介绍了在 Chart.js 中更改 X 和 Y 轴值的颜色的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用的是 v2.*.但是,我似乎无法为折线图设置默认颜色.我主要是想设置 x/y 图表值的颜色.我认为下面的内容可能会这样做 - 但它对图表根本没有任何影响.

I'm using v2.*. However, I can't seem to set the default color for a line chart. I'm mainly looking to set the color of the x/y chart values. I figured the below might do it - but it does nothing to the chart at all.

Chart.defaults.global.defaultColor = 'orange',

更新

这是一个带有实时图表的 jsfiddle.简而言之,我希望更改标签的颜色,即 2016 年 2 月 7 日等.

Update

Here's a jsfiddle with live chart. In short, I'm looking to change the color of the labels i.e. Feb 7, 2016, etc etc.

https://jsfiddle.net/o534w6jj/

推荐答案

好的,我想通了.这是我正在寻找的 ticks 属性...请参阅下面的代码.

Okay, so I figured it out. It's the ticks property I'm looking for...see code below.

查看更新的 jsfiddle:https://jsfiddle.net/o534w6jj/1/

See updated jsfiddle: https://jsfiddle.net/o534w6jj/1/

var ctx = $("#weekly-clicks-chart");
var weeklyClicksChart = new Chart(ctx, {
    type: 'line',
    data: data,
    scaleFontColor: 'red',
    options: {
            scaleFontColor: 'red',
        responsive: true,
        tooltips: {
            mode: 'single',
        },
        scales: {
            xAxes: [{ 
                gridLines: {
                    display: false,
                },
                ticks: {
                  fontColor: "#CCC", // this here
                },
            }],
            yAxes: [{
                display: false,
                gridLines: {
                    display: false,
                },
            }],
        }
    }         
});

这篇关于在 Chart.js 中更改 X 和 Y 轴值的颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆