Splunk Dev

How to hide unused chart legend item?

altink
Builder

Dear Support

I am looking to hide in chart legend one field that shows in legend, field that is used only for drill-down purpose.
Please see the following chart code:

<chart>
        <search>
          <query>`mc_vln` 
| search DB_NAME=$field_db_name$          
| stats 
count(eval(CTRL_FIND_ID=-1)) as Broken,
count(eval(CTRL_FIND_ID=0)) as Correct,
count(eval(CTRL_FIND_ID=1)) as Finding,
earliest(_time) as SCAN_DT_START 
by DB_NAME SCAN_ID
| sort - SCAN_DT_START 
| table DB_NAME SCAN_ID SCAN_DT_START Broken Correct Finding 
| dedup $field_last_x_scan$ DB_NAME 
| head 15
| sort SCAN_DT_START
| fields - SCAN_DT_START</query>
          <earliest>$field1.earliest$</earliest>
          <latest>$field1.latest$</latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">-45</option>
        <option name="charting.axisTitleX.visibility">collapsed</option>
        <option name="charting.chart">column</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.legend.labels">["Finding","Correct","Broken"]</option>
        <option name="charting.legend.placement">top</option>
        <option name="charting.seriesColors">[0xFA4343,0x00579F,0x646464]</option>
        <option name="charting.legend.masterLegend"></option>
        <drilldown target="blank">
          <link>scan_data?form.field_db_name=$click.value$&amp;form.field_scan_id=$row.SCAN_ID$&amp;form.field_ctrl_find_name=$click.name2$</link>
        </drilldown>
      </chart>

I have got the SCAN_ID field in the "| table" part of my search only for using it in the drill-down.

The problem is that this field SCAN_ID shows as an extra item in the Legend, while it logically produces no column.
All the rest of the chart is OK - Database in X and Correct/Finding/Broken columns (per each Scan SCAN_DT_START) are shown.

Question:
How can I hide this unnecessary SCAN_ID legend item from the chart ?
But without loosing it for drill-down - if I:
| fields - SCAN_DT_START SCAN_ID
then I get $row.SCAN_ID$ on the other side.

looking for something as done for Table Dashboards in:
26825/drilldown-from-a-hidden-column.html
with

Splunk 6.0-6.4.x
 <option name="fields">field1,field2,field4,count</option>
Splunk 6.5+
 <fields>field1,field2,field4,count</fields>

but for chart-equivalent (and thus hopefully in sImple XML)

at your disposal for further info

best regards,
Altin

Tags (1)
0 Karma
1 Solution

niketn
Legend

@altink, you can do this for chart also however using simple XML configuration, however, removing field in chart implies it will not be available for drilldown as well. (refer to charting.data.fieldHideList Chart configuration in the following Splunk documentation https://docs.splunk.com/Documentation/Splunk/latest/Viz/ChartConfigurationReference#General_chart_pr...)

So as a remedy, your option is to use Simple XML CSS Extension using a CSS Style like the following:

  <html depends="$alwaysHideCSSStyle$">
    <style>
      g.highcharts-legend-item:nth-child(1)
      {
        visibility: hidden !important;
      }
    </style>
  </html>

Looking at your table you would need to remove the first node from Highcharts Legend Item. Please try out and confirm.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

vishanik91
New Member

What is the syntax for the html snippetif you want to hide more than one series? Say the 1st and 2nd series in the legend?

0 Karma

niketn
Legend

@altink, you can do this for chart also however using simple XML configuration, however, removing field in chart implies it will not be available for drilldown as well. (refer to charting.data.fieldHideList Chart configuration in the following Splunk documentation https://docs.splunk.com/Documentation/Splunk/latest/Viz/ChartConfigurationReference#General_chart_pr...)

So as a remedy, your option is to use Simple XML CSS Extension using a CSS Style like the following:

  <html depends="$alwaysHideCSSStyle$">
    <style>
      g.highcharts-legend-item:nth-child(1)
      {
        visibility: hidden !important;
      }
    </style>
  </html>

Looking at your table you would need to remove the first node from Highcharts Legend Item. Please try out and confirm.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

vvarghes6
Explorer

@niketnilay Thank you, that fix helped me and it worked fine on my chart and was still able to use the underlying field to drill-down.

niketn
Legend

@vvarghes6, I am glad you found it helpful 🙂

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma

niketn
Legend

Altin, have you tried the above approach with CSS? This should work. Might require Splunk refresh/reboot/bump and browser history cleanup.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma

altink
Builder

Thank you very much for the reply and support

Unfortunately in this project I am limited to Simple XML only - no Javascript, no CSS, some images at max. .
Thus chances are that the field remains as it is (because needed for the drill-down) other then diverging from the projects course.
If no solution here I will rename the field SCAN_ID to some small "x" and put the small color rectangle to white -a typical quick-and-dirty solution.
This is a project framework - "major force"
:-)

Thus I tried the following settings in XML with the hope they work:

<option name="charting.axisY2.enabled">false</option>
        <option name="charting.axisLabelsY2.axisVisibility">hide</option>
        <option name="charting.axisY2.fields">"SCAN_ID"</option>
        <option name="charting.axisY2.minimumNumber">0</option>
        <option name="charting.axisY2.maximumNumber">0</option>
        <option name="charting.axisTitleY2.visibility">collapsed</option>
        <option name="charting.axisY2.scale">inherit</option>

but still cannot hide the SCAN_ID in legend.

can you advise?
even by confirming that this is just no possible in Simple XML

thanks and best regards
Altin

0 Karma

niketn
Legend

The CSS override that I Have provided can directly work out of SimpleXML Dashboard through a hidden HTML panel. Just try putting above code inside any <panel>

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

asgharalikhan
Engager

Hello Niketn, 

In my case, I am using timechart where i need to drilldown IP and Port to display Values on the new dashbaord as below sample.

" timechart span=5m avg(In) as In avg(Out) as Out latest(host) as IP latest(snmp_index) as Port"

I tried to hide Port and IP  using the below CSS it does hide both IP and Host on from the graph but still values appears when you move mouse curser, values still there. it does not fully removed. Any suggestion please.

<html depends="$alwaysHideCSSStyle$">
<style>
g.highcharts-legend-item:nth-child(3)
{
visibility: hidden !important;
}
g.highcharts-legend-item:nth-child(4)
{
visibility: hidden !important;
}
g.highcharts-series-3 {
visibility: hidden !important;
}
</style>
</html>

0 Karma
Get Updates on the Splunk Community!

What's new in Splunk Cloud Platform 9.1.2312?

Hi Splunky people! We are excited to share the newest updates in Splunk Cloud Platform 9.1.2312! Analysts can ...

What’s New in Splunk Security Essentials 3.8.0?

Splunk Security Essentials (SSE) is an app that can amplify the power of your existing Splunk Cloud Platform, ...

Let’s Get You Certified – Vegas-Style at .conf24

Are you ready to level up your Splunk game? Then, let’s get you certified live at .conf24 – our annual user ...