question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Idea] Customize axis label color / fonts

See original GitHub issue

Thanks for the work on this project, wondering if you could add the options to change in axis labels via the options, like you have set the height option, for example:

      var props = this.props;
      var style = {
        height: props.height || "300px",
        lineHeight: props.height || "300px",
        width: props.width || "100%",
        textAlign: "center",
        color: props.axisColor || "#999",
        fontSize: "14px",
        fontFamily: "'Lucida Grande', 'Lucida Sans Unicode', Verdana, Arial, Helvetica, sans-serif"
      };

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:9 (3 by maintainers)

github_iconTop GitHub Comments

11reactions
stevecastanedacommented, Feb 19, 2019

Was able to get it to work:

library={{
            legend: {
              labels: {
                fontColor: "#fff"
              }
            },
            scales: {
              yAxes: [
                {
                  ticks: { fontColor: "#fff" },
                  scaleLabel: { fontColor: "#fff" }
                }
              ],
              xAxes: [
                {
                  ticks: { fontColor: "#fff" }
                }
              ]
            }
          }}
2reactions
slangdogcommented, Feb 5, 2019

So I had these charts on a dark background and thought if you could pass another parameter into the JSX component to change the axis labels, for example:

<LineChart axisTextColor="#ff0000" data={{"2017-05-13": 2, "2017-05-14": 5, ...}} />

To change these colors:

chart

Read more comments on GitHub >

github_iconTop Results From Across the Web

Colors and fonts | IntelliJ IDEA Documentation - JetBrains
Colors and font styles are used to format this text and help you ... You can use a predefined color scheme or customize...
Read more >
Change the color of the axis name on the Properties -> Scale ...
But the only way to then change the color of the axis name to match the scale colors is to highlight the entire...
Read more >
Idea: Allow Multiple Colors in Mark Labels - Tableau Community
Dual axis is a work-around if only two colors are needed in mark labels, ... from font in mark labels and allow for...
Read more >
Change the font size and font color in chart axes
Vote for your favorite Qlik product ideas and add your own ... Change the font size and font color in chart axes (ex:Bar...
Read more >
Change Axis Label Text Color - Highcharts official support forum
Change Axis Label Text Color. Wed Apr 13, 2016 11:07 pm. I can't for the life of me figure out how to change...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found