Pre loader

Set axis label color by its value

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums


Hi, I want to color the axis label by its value,

value < 0 -> show red color
value = 0 -> show gray color
value > 0 -> show green color

similar to this question, but in javascript platform, it seems the LabelProvider has function related to the value(string) formatting only. Is there any ways to styling the label? Thanks!

  • Andrew Burnett-Thompson
    Very good question. Let me ask the team and revert back to you. May I ask *why* ? what is the use-case
  • chinghung lai
    hi andrew, for example, the X axis is the date. When I enter a new month or a new year, we hope that the label can change color, so that users can more easily notice that it is a new month or a new year.
  • You must to post comments

Hi there,

I’ve spoken to the Javascript team and they tell me you can override LabelProvider.getLabelTexture() to achieve a custom style per label.

Try this:

 // Override in LabelProvider
 public getLabelTexture(labelText: string, textureManager: TextureManager, labelStyle: TTextStyle) {
    const num = parseFloat(labelText);
    const customStyle: TTextStyle = num < 0 ? { color: "red", ...labelStyle } : { color: "green", ...labelStyle };
    return textureManager.createTextTexture([labelText], customStyle, this.rotationProperty);

We have some documentation on Custom Label Providers including images for axis labels here. This may be helpful

Let me know if that helps!

Best regards,

  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.