Splunk Search

How to change default color charts

marina_rovira
Contributor

Hi all,

I know there is a lot of questions for this matter, but I couldn't find a solution that worked for me.
I don't understand this simple/advanced XML things (I'm open to received an understandable summary about it), and for me, it's not possible to use CSS.

Now, I want to change the colors of the charts (usually bar charts). I know that there is a kind of master color array, so, two options.
1st.- Change this array in every chart setting the colors I want to show
2nd.- To know how to change the default colors in the array master. This would be perfect since is, probably, includes more "work" once but less from there.

Can someone illuminates me in any or both of this options, please?

I have this one where I was trying to change the numbers.

 <panel>
          <title>Top 5 alert types from manually handled alerts</title>
          <chart>
            <search>
              <query>index="*alerts"  |  chart  count(Alert) AS "Manually handled alerts" by FieldA|  sort -  "Manually handled alerts" | head 5</query>
              <earliest>$previous_month.earliest$</earliest>
              <latest>$previous_month.latest$</latest>
            </search>
            <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
            <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
            <option name="charting.axisTitleX.visibility">collapsed</option>
            <option name="charting.axisTitleY.visibility">collapsed</option>
            <option name="charting.axisTitleY2.visibility">visible</option>
            <option name="charting.axisX.scale">linear</option>
            <option name="charting.axisY.scale">linear</option>
            <option name="charting.axisY2.enabled">0</option>
            <option name="charting.axisY2.scale">inherit</option>
            <option name="charting.chart">column</option>
            <option name="charting.chart.bubbleMaximumSize">50</option>
            <option name="charting.chart.bubbleMinimumSize">10</option>
            <option name="charting.chart.bubbleSizeBy">area</option>
            <option name="charting.chart.nullValueMode">gaps</option>
            <option name="charting.chart.showDataLabels">all</option>
            <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
            <option name="charting.chart.stackMode">default</option>
            <option name="charting.chart.style">shiny</option>
            <option name="charting.drilldown">all</option>
            <option name="charting.layout.splitSeries">0</option>
            <option name="charting.layout.splitSeries.allowIndependentYRanges">0</option>
            <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
            <option name="charting.legend.placement">none</option>
            <option name="charting.seriesColors">[0x004386,0xFDD000,0x0098D8,0xF6AA00,0xA0CAEC]</option>
            <option name="height">288</option>
          </chart>
 </panel>

Thank you in advance.

0 Karma
1 Solution

adonio
Ultra Champion

hello there,
many answers with nice examples in this portal, here are a few:
https://answers.splunk.com/answers/289694/how-do-i-customize-the-bar-colors-for-my-dashboard.html
https://answers.splunk.com/answers/350448/how-to-customize-bar-chart-colors-based-on-the-val.html
https://answers.splunk.com/answers/496095/is-it-possible-to-change-default-colors-for-charts.html
https://answers.splunk.com/answers/50855/how-can-we-change-the-color-column-chart.html

here is a way to make it happen:

<dashboard>
 <label>My dashboard</label>
 <row>
  <panel>
    <chart>
      <searchName>My saved report</searchName>
      <option name="charting.legend.labels">[error,warn,ok]</option>
      <option name="charting.seriesColors">[0xFF0000,0xFFFF00,0x00FF00]</option>
      <option name="charting.legend.masterLegend"></option>
     </chart>
  </panel>
  </row>
</dashboard>

another way:

<option name="charting.fieldColors">
  {"error":0xFF0000,"warn":0xFFFF00,"info":0x00FF00}
</option>

hope it helps

View solution in original post

adonio
Ultra Champion

hello there,
many answers with nice examples in this portal, here are a few:
https://answers.splunk.com/answers/289694/how-do-i-customize-the-bar-colors-for-my-dashboard.html
https://answers.splunk.com/answers/350448/how-to-customize-bar-chart-colors-based-on-the-val.html
https://answers.splunk.com/answers/496095/is-it-possible-to-change-default-colors-for-charts.html
https://answers.splunk.com/answers/50855/how-can-we-change-the-color-column-chart.html

here is a way to make it happen:

<dashboard>
 <label>My dashboard</label>
 <row>
  <panel>
    <chart>
      <searchName>My saved report</searchName>
      <option name="charting.legend.labels">[error,warn,ok]</option>
      <option name="charting.seriesColors">[0xFF0000,0xFFFF00,0x00FF00]</option>
      <option name="charting.legend.masterLegend"></option>
     </chart>
  </panel>
  </row>
</dashboard>

another way:

<option name="charting.fieldColors">
  {"error":0xFF0000,"warn":0xFFFF00,"info":0x00FF00}
</option>

hope it helps

marina_rovira
Contributor

Thank you, I'm not being able to change the default array still, but I could change every chart (bar/pie/column) with the company colors 🙂

Adding this command:

<option name="charting.seriesColors">[0xFF9576,0xC7161E,0x0098D8,0xF6AA00]</option>

The one above didn't work, is still all blue. I think it is because is a top search, I've tried the label thing but nothing, probably because being a top search, although not in my case, the label can change a lot. (In my case the top 5 are always the same ones.
Do you know if it's possible to change it still?

Also, do you know if the table properties (background, text, lines) can be customize too?

0 Karma

adonio
Ultra Champion

for the table properties, absulutly,
best to check out the Splunk Dashboards Example app.
it has all the code and visualizations to demonstrate
download and enjoy, its super useful
https://splunkbase.splunk.com/app/1603/

0 Karma

marina_rovira
Contributor

Thank you a lot!

There's a lot of things here (in the app) 🙂

0 Karma
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...