topic Re: How to adjust label position in a column chart? in Splunk Search

How to adjust label position in a column chart?

dreadangel — Wed, 19 Jun 2019 09:41:18 GMT

Here is my chart - there is any way to set the position of column labels above the column, not in the middle?

Re: How to adjust label position in a column chart?

DavidHourani — Wed, 19 Jun 2019 10:13:06 GMT

Hi @dreadangel, when setting : <option name="charting.chart.showDataLabels">all</option> it should automatically show on top of the bars.. Which option are you currently using for displaying those values ?

Re: How to adjust label position in a column chart?

dreadangel — Wed, 19 Jun 2019 13:05:53 GMT

@DavidHourani Here is the whole configuration - as you can see I'm using the set you indicated

    <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
    <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option> 
    <option name="charting.axisY.maximumNumber">100</option>
    <option name="charting.axisLabelsX.majorLabelVisibility">auto</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">all</option>
    <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
    <option name="charting.chart.stackMode">stacked</option>
    <option name="charting.chart.style">shiny</option>
    <option name="charting.drilldown">none</option>
    <option name="charting.fieldColors">{"OLD":0xFFFF64,"LAST":0x22B14C,"UNSUP":0xFF6464}</option>
    <option name="charting.layout.splitSeries">0</option>
    <option name="charting.layout.splitSeries.allowIndependentYRanges">0</option>
    <option name="charting.legend.labelStyle.overflowMode">ellipsisEnd</option>
    <option name="charting.legend.mode">standard</option>
    <option name="charting.legend.placement">right</option>
    <option name="charting.lineWidth">2</option>
    <option name="height">202</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>

Re: How to adjust label position in a column chart?

DavidHourani — Wed, 19 Jun 2019 13:10:55 GMT

Hi @dreadangel,

This is because you are using :

<option name="charting.chart.stackMode">stacked</option>

Change it to :

<option name="charting.chart.stackMode">default</option>
<option name="charting.chart.showDataLabels">all</option>

Let me know if that works for you.

Cheers,
David

Re: How to adjust label position in a column chart?

dreadangel — Wed, 19 Jun 2019 13:20:47 GMT

Here is the result - not so pretty, but anyway a value is not above the column.

BTW maybe to use a D3.js chart?

Re: How to adjust label position in a column chart?

DavidHourani — Wed, 19 Jun 2019 13:27:36 GMT

ouch... yeah, true this does look bad...But that's the only way to get the values on top of the bar chart using standard xml. A D3.js chart should do the trick. And possibly reworking the query could help as well ?