Splunk Search

set a column's max-width in a chart



Hi, I have a JSChart like this and I want to set a max width for graph's column.
I want to avoid this huge column when I have only one (or two or three..) results.
Is it possible? I read the reference here with no success.



@RiccardoV, Chart Width can be set based on Number of Results.

Following is the range used for setting width depending on number of results in the Timechart (using <done> search event handler with predefined search job token $job.resultCount$)

1) 0 Results : 100% Width (No Results Found Message... Better use case is to hide Chart and Display html panel with custom message using depends and rejects.).
2) 1 - 5 Results: 30% Width
3) 5 - 25 Results: 50% Width
4) 25 - 100 Results: 75% Width
5) >100 Results: 100% Width
PS: As you can see ranges can be modified as per need. Run anywhere search uses timechart command on Splunk's _internal index with cont=f for generating data only for time bucket where events are present. First example shows 30% chart Width instead of 100% when timechart produces Single result.

alt text

Following is the Simple XML Code for attached screenshot:

  <label>Chart Width Based on Number of Results</label>
  <fieldset submitButton="false"></fieldset>
            width:$tokChart1Width$ !important;
      <input type="time" token="tokTime">
      <chart id="myChart1">
        <title>tokChart1Width: $tokChart1Width$</title>
          <query>index=_internal sourcetype=splunkd log_level="INFO"
| timechart count cont=f</query>
            <condition match="$job.resultCount$==0">
              <!-- 0 Results Found. Better use case is to unset the token and show HTML panel with Custom Message -->
              <set token="tokChart1Width">100%</set>
            <condition match="$job.resultCount$>0 AND $job.resultCount$<=5">
              <!-- 1-5 Results. Chart Width 30% -->
              <set token="tokChart1Width">30%</set>
            <condition match="$job.resultCount$>5 AND $job.resultCount$<=25">
              <!-- 5-25 Results. Chart Width 50% -->
              <set token="tokChart1Width">50%</set>
            <condition match="$job.resultCount$>25 AND $job.resultCount$<=100">
              <!-- 25-100 Results. Chart Width 75% -->
              <set token="tokChart1Width">75%</set>
            <condition match="$job.resultCount$>100">
              <!-- >100 Results. Chart Width 100% -->
              <set token="tokChart1Width">100%</set>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.abbreviation">none</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.abbreviation">none</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.abbreviation">none</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">none</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">minimal</option>
        <option name="charting.drilldown">none</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.mode">standard</option>
        <option name="charting.legend.placement">right</option>
        <option name="charting.lineWidth">2</option>
        <option name="refresh.display">progressbar</option>
        <option name="trellis.enabled">0</option>
        <option name="trellis.scales.shared">1</option>
        <option name="trellis.size">medium</option>
| makeresults | eval message= "Happy Splunking!!!"
0 Karma


Best thing i've found in these situations is to add an empty panel, or two empty panels to the same row.

    <u1> </u1>

Below is an image example of 1 row with a chart, and a second row with blank panels added along with the same chart.

alt text

0 Karma


I want to avoid to use flashchart..

0 Karma


I converted to flashchart in AdvancedXML and was able to set width.


no, sorry 😞

0 Karma


Hi Riccardo, Were you able to solve this?

0 Karma
Get Updates on the Splunk Community!

Devesh Logendran, Splunk, and the Singapore Cyber Conquest

At this year’s Splunk University, I had the privilege of chatting with Devesh Logendran, one of the winners in ...

There's No Place Like Chrome and the Splunk Platform

WATCH NOW!Malware. Risky Extensions. Data Exfiltration. End-users are increasingly reliant on browsers to ...

Customer Experience | Join the Customer Advisory Board!

Are you ready to take your Splunk journey to the next level? &#x1f680; We invite you to join our elite squad ...