Setting the colour scheme for pie charts in the new chart component?

[ferret141]

Is there any way to define the colour scheme for a pie chart using the newer chart component?

There doesn't seem to be a way to map colours to the labels.
My options seem to be:

• Manual: Clears when the options in the underlying data shift
• Palette: Colour gradient so no useful
• Array: Don't see a way to associate colours to variables

Am I going to have to use the older chart component and define it via Plotly?

Apologies if I am missing something obvious. I'm dealing with a wild wisdom toothache at the same time (should be called a wisDOOM tooth).

[WidleStudioLLP]

Hi @ferret141,

I'll be running a demo test in my app. You might want to try creating a transformer and use its output to set the color array in the pie chart's color section.

Transformer Code

const colorMap = {
  "B-Clarify & Expand": "#FF9800", 
  "C-Scheduled": "#F06292", 
  "D-Rescheduling": "#BA68C8" 
};

// Get the labels from the data
const labels = {{ getLeadsData.data }}.map(item => item.lead_status);


return labels.map(label => colorMap[label] || "#CCCCCC"); /

---

=

---

The second option is Inline Mapping in the Chart Settings

Alternatively, you can use an inline mapping directly within the chart’s color configuration:

{{ 
  getLeadsData.data.map(item => ({
    "B-Clarify & Expand": "#FF9800", // Orange
    "C-Scheduled": "#F06292", // Pink
    "D-Rescheduling": "#BA68C8" // Purple
  })[item.lead_status] || "#CCCCCC")
}}

---

[ferret141]

Thank you @WidleStudioLLP. That was exactly what was needed.

I used the inline method.

[Kyle_Crowder]

Is this color selection method going to be added to the other types of charts?

[WidleStudioLLP]

Hi @Kyle_Crowder,

I hadn’t tried this approach in other chart types before, but after seeing your question, I gave it a shot using bar and line charts. It seems the trick partially works, but throws an error because these chart types expect a single color value. Specifically, the “Segment Color” or “Bar Color” field requires just one string value per bar or slice.

However, this method works well with chart types such as funnel charts and pie charts, which support multiple colors and values per segment. You might want to try it with those instead.

---

I've included some screenshots below for your reference.

---

Hope this helps!

[Kyle_Crowder]

Thanks for demoing those! Unfortunately it was specifically the bar/line chart that I had in mind when asking this. I hope someday that add this feature to the rest of the charts