Dashboards & Visualizations

How can I change the charting legend placement?

pavanae
Builder

I have a dashboard panel as below

alt text

As you can see on the color representatio(MSSP ..)n since the words are large they aren't visible on the dashboard. Instead I want to display those 3 on the top instead of right. In-order to do that where exactly should I have to modify the html tags.

0 Karma
1 Solution

cmerriman
Super Champion

there are a couple of options for this.
https://docs.splunk.com/Documentation/Splunk/7.0.0/Viz/ChartConfigurationReference#General_chart_pro...
you can edit the xml source code in the dashboad and use

<option name="charting.legend.labelStyle.overflowMode">ellipsisNone</option>
<option name="charting.legend.placement">top</option>

Otherwise, you can do this in the UI by pressing on the little paintbrush format button at the top of the chart/panel and on the left of the new window, there should be a toggle button called Legend. when you click on that, there should be legend options, such as placement, to display or hide it, etc.

EDIT:
after re-reading, if you're dealing with an HTML dashboard, go into the code and find the element you need. if you named the panel, you should be able to find the title. figure out what id your chart is.
for example:

 <div class="panel-element-row">
                <div id="element2" class="dashboard-element chart" style="width: 100%">
                    <div class="panel-head">
                        <h3>header</h3>
                    </div>
                    <div class="panel-body"></div>
                </div>
            </div>

i needed to find later on in the code element2

then you see something like this towards the bottom:

var element2 = new ChartElement({
            "id": "element2",
            "charting.drilldown": "all",
            "charting.axisLabelsX.majorLabelStyle.rotation": "0",
            "charting.legend.placement": "top",
            ........

and that's where you change the legend placement/ellipsis

View solution in original post

elliotproebstel
Champion

If you'd like the legend to appear above the chart, rather than to the right of it, you should put the dashboard into Edit mode, click on the "Format Visualization" icon, which looks like a paintbrush, and select "Legend" from the options at the left side of the pop-up. From the "Legend Position" drop-down, select "Top". Here's a screenshot:
alt text

cmerriman
Super Champion

there are a couple of options for this.
https://docs.splunk.com/Documentation/Splunk/7.0.0/Viz/ChartConfigurationReference#General_chart_pro...
you can edit the xml source code in the dashboad and use

<option name="charting.legend.labelStyle.overflowMode">ellipsisNone</option>
<option name="charting.legend.placement">top</option>

Otherwise, you can do this in the UI by pressing on the little paintbrush format button at the top of the chart/panel and on the left of the new window, there should be a toggle button called Legend. when you click on that, there should be legend options, such as placement, to display or hide it, etc.

EDIT:
after re-reading, if you're dealing with an HTML dashboard, go into the code and find the element you need. if you named the panel, you should be able to find the title. figure out what id your chart is.
for example:

 <div class="panel-element-row">
                <div id="element2" class="dashboard-element chart" style="width: 100%">
                    <div class="panel-head">
                        <h3>header</h3>
                    </div>
                    <div class="panel-body"></div>
                </div>
            </div>

i needed to find later on in the code element2

then you see something like this towards the bottom:

var element2 = new ChartElement({
            "id": "element2",
            "charting.drilldown": "all",
            "charting.axisLabelsX.majorLabelStyle.rotation": "0",
            "charting.legend.placement": "top",
            ........

and that's where you change the legend placement/ellipsis

Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...