Solved: Can the font color of the values reflected in a "s...

beetlegeuse · ‎11-14-2022

I have a line chart panel in my dashboard that's comparing two series of datapoints, and I have "charting.legend.mode" set to "seriesCompare" to see the values next to the appropriate series name in the legend. Trouble is, the font color used for those values is very light and difficult to see.

Can an adjustment be made to change the font color of those compare values? I've circled the value in the screen capture below:

ITWhisperer · ‎11-15-2022

Give your panel an id and then add this CSS in a style block of a hidden HTML panel

    <panel depends="$stayhidden$">
      <html>
        <style>
          #linechart svg g.highcharts-legend-item text tspan:nth-child(2) {
            fill: red !important;
          }
        </style>
      </html>
    </panel>
    <panel id="linechart">
      <chart>

View solution in original post

ITWhisperer · ‎11-15-2022

Give your panel an id and then add this CSS in a style block of a hidden HTML panel

    <panel depends="$stayhidden$">
      <html>
        <style>
          #linechart svg g.highcharts-legend-item text tspan:nth-child(2) {
            fill: red !important;
          }
        </style>
      </html>
    </panel>
    <panel id="linechart">
      <chart>

beetlegeuse · ‎11-15-2022

Works like a charm...thank you!

Can the font color of the values reflected in a "seriesCompare" line chart be changed?

dashboard

panel

timechart

Announcing Scheduled Export GA for Dashboard Studio

Extending Observability Content to Splunk Cloud

More Control Over Your Monitoring Costs with Archived Metrics GA in US-AWS!