
Axis and grid line properties
This topic lists the properties for the axis
, axisLabels
, axisTitle
, and gridLines
elements.
Axis
Usage: charting.axisX.*
and charting.axisY.*
An axis is a non-visual object that maps data to some relative location depending on its type and various options. The visual part of an axis is handled by a separate element - axis labels.
If you are working with a single-axis chart (range marker, value marker), then you just use axisX
to work with its axis properties.
If you are working with a dual axis chart (area, bar, bubble, column, histogram, line, and scatter) you use axisX
and axisY
to set properties for the x- and y-axes, respectively.
Note: Keep in mind that for bar charts, axisY
is reversed so that values descend from top to bottom vertically:
<option name="charting.axisY.reverse">true</option>
For more information, see the documentation of the reverse
parameter, below.
Values
axis
has three main values that depend on the type of values being plotted on the axis:
-
category
: For the plotting of categorical values, like a series ofhost
names in a column chart. -
numeric
: For the plotting of numeric values, such as a range from 1-1000. -
time
: For the plotting of time values along a timeline.
Example
<option name="charting.axisX">numeric</option> <option name="charting.axisX.minimumNumber">10</option> <option name="charting.axisX.maximumNumber">200</option> <option name="charting.axisY">category</option> <option name="charting.axisY.categories">[red,white,blue]</option>
This code sets up a numeric x-axis scale that starts at 10 and stops at 200. Values below and above that range are not plotted on the chart.
It also hard-codes three categories for the y-axis: red, white, and blue. If the search upon which the chart is based is charting values of a colors
field, this ensures that only events with red
, white
, and blue
values get plotted. (Note that you can also arrange this behavior through search language.)
Also used by
axis
is not used by other elements.
Properties for all axis types
All axis types The following properties affect all axis types. | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
reverse |
boolean | Determines whether or not the axis is reversed. Bar chart Y axes are reversed so that values descend from top to bottom vertically. | false |
No |
Properties for category (non-numeric) axes
Category axes The following properties apply only to | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
categories |
array<string> | The list of categories to plot on the axis, delimited by commas without spaces and formatted within brackets. | auto |
No |
comparator |
comparator | The comparator to use to sort the list or categories. Comparators can be alphabetic (values are sorted alphabetically), natural (values are sorted according to their natural ordering), numeric (values are sorted numerically), or sequentialNumeric (values are sorted according to the sequence of numbers contained within them--useful for IP addresses, version strings, and similar numeric sequences). |
none |
No |
Properties for numeric axes
Numeric axes The following properties apply only to | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
scale |
scale | For numeric axes, this represents the type of scale that Splunk applies to a numerical axis. Potential values are linear and log (for a logarithmic scale). It's only supported for the Y-axis (charting.axisY.scale ) in most chart types, with the exception of scatter charts, where it also applies to the X-axis (charting.axisX.scale ). |
linear |
Yes |
includeZero |
boolean | When set to true this forces the axis range to include zero. |
false |
Yes |
minimumNumber |
number | Sets the minimum number for the visible axis range. | auto |
Yes |
maximumNumber |
number | Sets the maximum number for the visible axis range. | auto |
Yes |
Properties for time axes
Time axes The following properties apply only to | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
minimumTime |
datetime | Sets the minimum time for the visible axis range. Value should be an ISO-8601 date time string in the following format: YYYY-MM-DDTHH:MM:SS.MMM-HH:MM |
auto |
No |
maximumTime |
datetime | Sets the maximum time for the visible axis range. Value should be an ISO-8601 date time string in the following format: YYYY-MM-DDTHH:MM:SS.MMM-HH:MM |
auto |
No |
Axis labels
Usage: charting.axisLabelsX.*
and charting.axisLabelsY.*
The axisLabels
element enables the visualization of chart axes. It places tick marks and labels at locations along chart axes that are appropriate depending upon the state of those axes.
The separation between the axis
and axisLabels
element allows a single axis to have multiple sets of labels and tick marks, which is useful if you want duplicate labels on both sides of a chart (in other words, a chart with an X axis at the bottom, and duplicate Y axes on the left and right side). The Search app timeline is an example of just such a chart. This separation also enables the setup of charts with labels in different unit resolutions (such as one in years and one in months).
Values
The axisLabels
element has three values that relate to the three types of axes that Splunk supports (see the axis
element for more information).
It's important to note that most axisLabels
parameters belong to all axis types.
Example
<option name="charting.axisLabelsX">numeric</option> <option name="charting.axisLabelsX.integerUnits">true</code> <option name="charting.axisLabelsX.minorTickSize">10</option> <option name="charting.axisLabelsX.majorTickSize">20</option> <option name="charting.axisLabelsX.majorLabelAlignment">afterTick</option> * <option name="charting.axisLabelsX.minorLabelStyle.margin">(3,3,2,2)</option> <option name="charting.axisLabelsX.minorLabelStyle.alignmentX">0</option> <option name="charting.axisLabelsX.minorLabelAlignment">afterTick</option> *
This sets up a variety of parameters for numeric x-axis labels. It sets the small and large tick size in pixels, defines the x-axis margins, and gives the labels an alignment that places them after their corresponding tick mark. It also indicates that the major unit labels for the numeric x-axis should be rounded to the nearest integer.
Also used by
-
layout.axisLabels.*
See the "Layout properties" discussion for more details.
Axis label properties
all axis labels The following properties apply to all three axis label types. All axis label types inherit properties from LayoutSprite as well. | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
placement |
string | Controls the placement of the axis labels within a dual axis chart layout. Valid values are left , right , top , and bottom . |
bottom |
No |
axis |
axis | Indicates the axis to label. For example, to indicate the y-axis, use: <option name= "charting.axislabelsY.axis"> @axisY</option> |
See the axis section for properties and defaults. |
No |
axisBrush |
brush | Indicates the brush to use to paint the line that runs along the length of the axis (perpendicular to the tick marks). For example, to use the predefined axisLineBrush element, which provides the standard axis line brush properties: <option name= "charting.axisLabelsX.axisBrush"> @axisLineBrush</option> |
See the brush section for properties and defaults. |
No |
axisVisibility |
string | Determines whether or not the axis line is visible or not. Valid values are show and hide |
show |
Yes |
majorTickBrush |
brush | Indicates the brush to use to paint the major axis tick marks. For example, to use the predefined axisLineBrush element, which provides the standard axis line properties: <option name= "charting.axisLabelsX.majorTickBrush"> @axisLineBrush</option> |
See the brush section for properties and defaults. |
No |
majorTickSize |
number | The size of the major tick marks in pixels. | 6 |
Yes |
majorTickVisibility |
string | Determines whether the major tick marks are visible or not. Valid values are auto (shows a major tick only if the corresponding label is visible), show (forces all major ticks to be visible, regardless of label visibility), and hide (forces all major ticks to be hidden). |
auto |
Yes |
minorTickBrush |
brush | Indicates the brush to use to paint the minor axis tick marks. For example, to use the predefined axisLineBrush element, which provides the standard axis line properties: <option name= "charting.axisLabelsX.minorTickBrush"> @axisLineBrush</option> |
See the brush section for properties and defaults. |
No |
minorTickSize |
number | The size of the minor tick marks in pixels. | 6 |
Yes |
minorTickVisibility |
string | Determines whether the minor tick marks are visible or not. Valid values are auto (shows a minor tick only if the corresponding label is visible), show (forces all minor ticks to be visible, regardless of label visibility), and hide (forces all minor ticks to be hidden). |
auto |
Yes |
majorLabelStyle |
style<textBlock> | Applies properties to major tick mark labels. | See the textBlock table for specific properties and defaults. |
No |
majorLabelAlignment |
string | Controls the alignment of the major labels relative to their corresponding tick mark. Valid values are atTick , afterTick , and beforeTick . |
atTick |
No |
majorLabelVisibility |
string | Controls the visibility of the major tick mark labels. Valid values are auto (automatically shows or hides individual major labels to maintain readability in the available space without overlapping), show (forces all major labels to be visible even when there isn't enough space to display them without overlapping), and hide (hides all major labels). Set majorLabelVisibility to show if you always want labels to appear, even when a large number of results are displayed. |
auto |
Yes |
minorLabelStyle |
style<textBlock> | Applies properties to minor tick mark labels. | See the textBlock table for specific properties and defaults. |
No |
minorLabelAlignment |
string | Controls the alignment of the minor labels relative to their corresponding tick mark. Valid values are atTick , afterTick , and beforeTick . |
atTick |
No |
minorLabelVisibility |
string | Controls the visibility of the minor tick mark labels. Valid values are auto (automatically shows or hides individual minor labels to maintain readability in the available space without overlapping), show (forces all minor labels to be visible even when there isn't enough space to display them without overlapping), and hide (hides all minor labels). Set minorLabelVisibility to show if you always want labels to appear, even when a large number of results are displayed. |
auto |
No |
extendsAxisRange |
boolean | Determines whether the range of the axis should be extended to snap to whole major tick marks. | true |
Yes |
Category axis label properties
There are currently no properties that are specific to this axis label type.
Numeric axis label properties
Numeric axis labels The | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
majorUnit |
number | The spacing unit at which to place major tick marks along the numeric axis. By default, this value is automatically calculated based on the scale of the related axis . |
auto |
Yes |
minorUnit |
number | The spacing at which to place minor tick marks. Possible values vary depending on the scale you are working with. By default, this value is automatically calculated based on the scale of the related axis . |
auto |
No |
scaleMajorUnit |
boolean | Determines whether the major unit is relative to the scale of the numeric axis. | true |
No |
scaleMinorUnit |
boolean | Determines whether the minor unit is relative to the scale of the numeric axis. (The minor unit of a numeric axis is usually relative to the major unit.) | false |
No |
integerUnits |
boolean | Indicates whether the major unit should be rounded to the nearest integer. | false |
Yes |
Time axis label properties
Note the restriction for usage of the majorUnit
property for time axis labels. It is only supported in Flash, and to make it appear in Flash you must add an additional tag to the chart definition.
Time axis labels The | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
timeZone |
timeZone | The time zone in which labels are computed. Can be: 1) the character z or Z , indicating UTC time (constant offset 0); or 2) A numeric value, indicating the time zone offset in seconds, or 3) a string in serialized time zone format, indicating the offset changes for the time zone on the Splunk server. Any other value is interpreted as the local time in whatever browser is being used to view the chart. For more information see the zoneinfo (TZ) database. |
By default timeZone is assigned a serialized string from the Splunk server that contains all the information about where the time zone offset changes occur. |
No |
majorUnit |
duration | Determines the spacing at which to place major tick marks, in terms of duration. By default this is determined automatically. To define a specific spacing, use an ISO-8601 duration string in the following format: PnYnMnDTnHnMnS . Note: Splunk will ignore your setting for this property unless you force the chart to display in Flash. To do this, add a line for another unsupported property such as scaleX to your chart definition. This forces the chart to display in Flash with your majorUnit setting displaying appropriately along the time axis.Example: You want to force the time axis to be marked in 1 hour increments. If you just put in <option name="charting.axisLabelsX.majorUnit"> P0Y0M0DT1H0M0S</option> , Splunk will ignore the setting. But if you add <option name="charting.scaleX">1</option> , Splunk will be forced to display the chart in Flash with the desired 1 hour unit setting on the X axis. |
auto |
No |
minorUnit |
duration | Determines the spacing at which to place minor tick marks, in terms of duration. By default this is determined automatically. To define a specific spacing, use an ISO-8601 duration string in the following format: PnYnMnDTnHnMnS |
auto |
No |
Axis title
Usage: charting.axisTitleX.*
and charting.axisTitleY.*
The axisTitle
element is designed to enable the placement of the axis title within a dual axis chart layout.
Note: While axisTitle
is mainly to be used for dual axis charts, you could create an axisTitle
element and place it within the layout.axisTitles
list for a single-axis chart or pie chart.
Values
-
axisTitle
Example
<option name="charting.axisTitleX.text">Source type</option>
<option name="charting.axisTitleY.text">KB indexed</option>
Also used by
-
layout.axisTitlesX.*
,layout.axisTitlesY.*
See the "Layout properties" discussion for more details.
Properties
All axis titles The axis title element inherits properties from | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
placement |
string | Determines the placement of the axis title within a dual axis chart layout. Valid values are left , right , top , and bottom . |
bottom |
No |
Grid lines
Usage: charting.gridLinesX.*
and charting.gridLinesY.*
The gridLines
element is used by dual axis charts to control the display and appearance of chart grid lines, which correspond to axis tick marks from axis labels and extend across the span of the chart.
Values
-
gridLines
Also used by
-
layout.gridLines.*
See the "Layout properties" discussion for more details.
Properties
All grid lines Grid lines inherit properties from | ||||
Property name | Value type | Definition | Default | Supported by JSChart? |
axisLabels |
axisLabels | Indicates the axis labels for which to generate the grid lines. Axis labels should use the @ sign to reference the axis labels. For example: @myAxisX . |
Not assigned. | No |
majorLineBrush |
brush | Indicates the brush to use to paint the major grid lines (corresponds to the major tick marks). For example, to use the predefined gridLineBrush element, which provides the standard grid line brush properties: <option name="charting.gridLinesY.majorLineBrush"> @gridLineBrush</option> |
See the brush section for properties and defaults. |
No |
minorLineBrush |
brush | Indicates the brush to use to paint the minor grid lines (corresponds to the minor tick marks). For example, to use the predefined gridLineBrush element, which provides the standard grid line brush properties: <option name="charting.gridLinesY.minorLineBrush"> @gridLineBrush</option> |
See the brush section for properties and defaults. |
No |
showMajorLines |
boolean | Determines whether major grid lines are visible. | true |
Yes |
showMinorLines |
boolean | Determines whether minor grid lines are visible. | false |
Yes |
PREVIOUS Chart and legend properties |
NEXT Tooltip properties |
This documentation applies to the following versions of Splunk® Enterprise: 6.0, 6.0.1, 6.0.2, 6.0.3, 6.0.4, 6.0.5, 6.0.6, 6.0.7, 6.0.8, 6.0.9, 6.0.10, 6.0.11, 6.0.12, 6.0.13, 6.0.14, 6.0.15, 6.1, 6.1.1, 6.1.2, 6.1.3, 6.1.4, 6.1.5, 6.1.6, 6.1.7, 6.1.8, 6.1.9, 6.1.10, 6.1.11, 6.1.12, 6.1.13, 6.1.14, 6.2.0, 6.2.1, 6.2.2, 6.2.3, 6.2.4, 6.2.5, 6.2.6, 6.2.7, 6.2.8, 6.2.9, 6.2.10, 6.2.11, 6.2.12, 6.2.13, 6.2.14, 6.2.15
Comments
Rfrey, I checked with the developer who implemented the includeZero feature for numerical axes, and he tells me this feature should be working as advertised. You may have uncovered a bug. I sent you a private email to help troubleshoot this issue. You may want to try Splunk Answers or file a support case if you cannot otherwise resolve the issue.
The includeZero property for numerical axis does not work with JSChart despite what this documentation says. It will work with FlashChart if you choose to go that route.
I can't seem to get the time axis label property of majorUnit to work for my timechart. I have made sure I have Flash installed, and I added both lines of code to my chart's XML, but it does not change the units of the X-Axis to be in hourly increments. There must be something missing from this documentation for this feature to function properly. <br /><br />1<br /> P0Y0M0DT1H0M0S<br /><br />If you're confident that this is working as intended, could I get a link to a working example?