Dashboards & Visualizations

How can I get the entire row to be the same color as one of the values without js?

mauricio2354
Explorer

Right now, I am using the colorpalette option to label services as a certain color (grey). However, I want to extend this across the row for whatever service details it has, not just color the service name in grey. Is there a way to do this without js?

It's very important that this be done without js - just using the XML "Source" option in the dashboard.

Thanks!

0 Karma

TISKAR
Builder

Try This:

<dashboard>
  <label>Table Formats</label>
  <row depends="$Hello$">
    <panel>
      <html>
            <style>
              #sortIsAProblem tr:nth-child(3) td {background-color: grey;}
              #sortIsAProblem tr:nth-child(5) td {background-color: grey;}
              #sortIsAProblem tr:nth-child(6) td {background-color: grey;}
              #sortIsAProblem tr:nth-child(1) td {background-color: grey;}
              #sortIsAProblem tr:nth-child(9) td {background-color: grey;}
              #sortIsAProblem tr:nth-child(10) td {background-color: grey;}
              #sortIsAProblem tr:nth-child(18) td {background-color: grey;}
              #sortIsAProblem tr:nth-child(15) td {background-color: grey;}
            </style>
          </html>
    </panel>
  </row>
  <row>
    <panel>
      <table id="sortIsAProblem">
        <search>
          <query>| makeresults |eval Service="SparkPay Webhook(enterpriseapi-6YS7IojKFla7SBqCPTkGKf4G) : gumbo - f086171f1a504f6984389cd188b9ce98;SparkPay Webhook(enterpriseapi-6YS7IojKFla7SBqCPTkGKf4G) : gumbo - f086171f1a504f6984389cd188b9ce98;
 NO-NAME(cb52a96eb25041659e889a9fe86408c6) : Account Subscription Inquiry - d6fb47ebc616401fb1684412b95085f0;Dynamic App (using DevEx GW)(03633fda819c4758822d51e541c859f9) : Branded Products Display Contents - 1324a6bd86cb42c3b75325b1c31778a7;
 ProcessApp(enterpriseapi-1XtCxMbaNNG9m0znInKWjkJl) : Application Fraud - d6ceca902b564e3891f3d17a8955cb59;Partnerships Transactions Summary;
 NO-NAME(3d543435bea44d498b37ad123a0a93f4) : ///dgw - 3cb2ebdcd846416a958a2a4973317354\";Service Lineage;\"Investment Full Service Accounts;NO-NAME(NONE) : oauth2 - oauth2;SparkPay Webhook(enterpriseapi-6YS7IojKFla7SBqCPTkGKf4G) : private-messagesystems-feedback - 10e30983788d4ed98032dee686403ed4;oauth2;NO-NAME(7b3b7e7ad85e44168d1adeeee8fc900e) : oauth2 - get-token;NO-NAME(NONE) : oauth2 - get-token;taxport-ws;Customer Promotion API - Private;customer-payment-cards_APP(cfd573cd77a54735a5520526baef6f6d) : Customer Promotion API - Private - a75d368234194b26b2a6f44f9519510a;NO-NAME(00bb0a453d3742c5aba74d884d3f9c27) : Credit Offers - edfc0660a37547ca987e592bb087a4e3"
| makemv delim=";" Service
| mvexpand Service
| eval count=20
| sort Service</query>
          <earliest>0</earliest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="count">20</option>
        <option name="dataOverlayMode">none</option>
        <option name="drilldown">none</option>
        <option name="percentagesRow">false</option>
        <option name="rowNumbers">false</option>
        <option name="totalsRow">false</option>
        <option name="wrap">true</option>
      </table>
    </panel>
  </row>
</dashboard>
0 Karma

niketn
Legend

@mauricio2354, can you let us know the reason for this requirement without having to use JS?

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma
Get Updates on the Splunk Community!

Introducing the Splunk Community Dashboard Challenge!

Welcome to Splunk Community Dashboard Challenge! This is your chance to showcase your skills in creating ...

Built-in Service Level Objectives Management to Bridge the Gap Between Service & ...

Wednesday, May 29, 2024  |  11AM PST / 2PM ESTRegister now and join us to learn more about how you can ...

Get Your Exclusive Splunk Certified Cybersecurity Defense Engineer Certification at ...

We’re excited to announce a new Splunk certification exam being released at .conf24! If you’re headed to Vegas ...