Add a chart

Add a chart

Charts are one of the most common panels to add to a dashboard. Use charts to display the results of a report you run in Splunk. For example, use a chart to show the number of bookings made on your website this month, or the count of different kinds of errors or violations.

Configure the chart panel

The chart panel displays search data in chart format. Pair the chart panel with a saved report you've already created -- that is, a saved search with formatting included in the saved search. For more information on building reports you can use in charts in your dashboard, see "Saving reports and sharing them with others" in the User manual.

The following basic example shows how to add a chart to the dashboard you've been building. Use the <chart> tag to add a chart.

<dashboard>
 <label>My dashboard</label>
 <row>
  <chart>
    <title>My monthly report</title>
     <searchName>My monthly report</searchName>
  </chart>
 </row>
</dashboard>

This example references a saved search called My monthly report. The saved search should include chart formatting to appear correctly as a chart. Also, make sure this saved search is shared with all users and roles who access this dashboard. Any saved search referenced in searchName must exist in savedsearches.conf in the app's default or local directory or be set as global.

The <title> tag displays a title above the table. You can add a title to any panel in a dashboard. There are other options available for all panels. See Step 3 : add panels for more information.

Set chart specific options

You can set other configuration options that are only available for chart panels, such as height, chart type (pie, scatter, bar, etc) and more. For example, this snippet changes the chart to a line chart, sets the height to 200 pixels and gives titles to the two axes:

<dashboard>
 <label>My dashboard</label>
 <row>
  <chart>
   <searchName>My saved report</searchName>
    <option name="charting.chart">line</option>
    <option name="height">200px</option>
   </chart>
  </row>
</dashboard>

There are a number of other chart formatting options. Here are the basic chart options available in the XML:

height = CSS dimension

• Set the height of the chart.

charting.chart = bar | line | column | area | pie | scatter | bubble

• Set the chart type.

charting.legend.placement = top | left | bottom | right | none

• Indicates the placement of the legend.

There are many other chart formatting options available by using the charting.* syntax:

charting.* = charting options

• All of the chart formatting options are supported here; see the charting reference in this manual for a list of all the chart formatting options. There are more instructions on using advanced charting options in this manual here.

Examples

Here are a few examples of using the charting options to change specific aspects of the chart:

Change chart axes titles

This example changes the axes' titles to User and IP address.

<dashboard>
 <label>My dashboard</label>
 <row>
  <chart>
   <searchName>My saved report</searchName>
    <option name="charting.primaryAxisTitle.text">User</option>
    <option name="charting.secondaryAxisTitle.text">IP address</option>
   </chart>
  </row>
</dashboard>

Change the size of the chart legend and tool tip

This example changes the size of the tool top and the legend from 150 pixels (the default) to 500 pixels.

<dashboard>
 <label>My dashboard</label>
 <row>
  <chart>
   <searchName>My saved report</searchName>
    <option name="charting.tooltip.maximumWidth">500</option>
    <option name="charting.legend.labelStyle.maximumWidth">500</option>
   </chart>
  </row>
</dashboard>

• Was this topic useful?
• Post a comment