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.

color sometimes works in strange and mysterious ways.

Categorical or linear scales don’t work at the series level, except for lineSeries. ie

<XYPlot height={200} width={200} colorType='category' colorDomain={[0, 1, 2]} colorRange={['yellow', 'blue', 'red']}>
<VerticalBarSeries data={data} color={0} />
</XYPlot> 

or

<XYPlot height={200} width={200} colorType='category' colorDomain={[0, 1]} colorRange={[ 'blue', 'red']}>
<VerticalBarSeries data={data} color={0.5} />
</XYPlot> 

In both cases, the series will appear black. A scale will be created which will return an undefined value and override the defaults.

Issue Analytics

  • State:open
  • Created 6 years ago
  • Reactions:2
  • Comments:7 (2 by maintainers)

github_iconTop GitHub Comments

7reactions
Reg011commented, Sep 3, 2019

Is there any progress on this issue? I’m using a MarkSerie and everytime I try to set a color string (such as rgb or hex) it appears black no matter what.

0reactions
yblee85commented, May 7, 2021

I’m not sure if this helps. but i used exact same code as @jckr except

  1. moved colorType=‘category’ colorDomain={[0, 1, 2]} colorRange={[‘yellow’, ‘blue’, ‘red’]} props from XYPlot to VerticalBarSeries props
  2. in data, add color:0~2
const data = [
        {x: 0, y: 8, color:0},
        {x: 1, y: 5, color:0},
        {x: 2, y: 4, color:1},
        {x: 3, y: 9, color:1},
        {x: 4, y: 1, color:2},
        {x: 5, y: 7, color:2},
        {x: 6, y: 6, color:1},
        {x: 7, y: 3, color:1},
        {x: 8, y: 2, color:0},
        {x: 9, y: 0, color:1}
    ];

<div>
    <XYPlot height={300} width={300}>
        <VerticalBarSeries colorType='category' colorDomain={[0, 1, 2]} colorRange={['yellow', 'blue', 'red']} data={data} />
    </XYPlot>
</div>

image

Read more comments on GitHub >

github_iconTop Results From Across the Web

Quirk Ideas - Color Splash - Wattpad
Name: Color Splash · Description: Allows the user to shoot different colors from their fingertips. · Red equals stretchy. · Yellow equals bouncy....
Read more >
Quirks of the Color Quest - Color Matters
Hot new colors have become a big business. ... About this article: "Quirks of the Color Quest" was published in Visual ArtsTrends magazine....
Read more >
11 Creative quirks ideas | color inspiration, colour pallete ...
May 5, 2019 - Explore Katie Turland's board "Creative quirks" on Pinterest. See more ideas about color inspiration, colour pallete, color pallets.
Read more >
Color-Coded Quirks - Small Groups
Color -Coded Quirks. Spark a light-hearted discussion on your ... Purpose: A fun way to help group members share a variety of humorous...
Read more >
Any ideas on a quirk that allow the user to...
A possible name for the Quirk could be “Color Coder”. My Hero Academia Quirks Original Quirk · 25 notes.
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