Plot Lines on Time Series Charts

<< Click to Display Table of Contents >>

Navigation:  Enterprise > Widgets > Time Series Chart >

Plot Lines on Time Series Charts

Users can add hard coding for fixed vertical and/or horizontal line(s) to a Time Series Chart using the plotLine property in the JavaScript Object Notation (JSON) for widget properties. The following steps explain how to add, label, and format a fixed line to the Time Series Chart widget.

 

1.Create or select the desired Time Series Chart widget on the dashboard. Select report and configure as desired.

2.Open the Widget Editor by selecting the More Options Ent-More_Options-Icon icon in the upper right corner of the widget to display the drop-down menu and then select the Edit menu option.

3.Select the Advanced tab to access the JSON editor.

4.Find the appropriate section in the JSON for the "yAxis" or "xAxis" properties. This will depend on whether the plot line is to be horizontal (parallel to the X-axis, and thus, added to the yAxis JSON property) or vertical (parallel to the Y-axis, and thus, added to the xAxis JSON property).

5.Add the plotLines section and associated properties within the axis properties.  Properties such as color, line type, label, and value can be changed as needed.

 

Examples

 

Horizontal Red Line

 

This example will add a horizontal red line at a value of 12 on the Y-axis of the Time Series Chart.

 

"yAxis": [

{

"gridLineWidth": 1,

"lineWidth": 1,

"max": null,

"plotLines": [

{

"value": 12,

"width": 4,

"color": "red"

}

],

 

Vertical Dashed Line with Label

 

This example will add a dashed black line on the X-axis of the Time Series Chart. The "value" represents the date/time in milliseconds on the X-axis.

 

"xAxis": {

   "type": "datetime",

   "ordinal": false,

   "minRange": 1000,

   "dateTimeLabelFormats": {

     "millisecond": "%H:%M:%S.%L",

     "second": "%H:%M:%S",

     "minute": "%H:%M",

     "hour": "%H:%M",

     "day": "%e. %b",

     "week": "%e. %b",

     "month": "%b '%y",

     "year": "%Y"

   },

   "plotLines": [

     {

       "value": 1439481020000,

       "width": 5,

       "color": "black",

       "dashStyle": "ShortDash"

     }

   ]

 },

 

 

Note: The "value" for a vertical line in the Time Series Widget will need to be a specific date/time with milliseconds converted to Unix, which needs to be done outside of EQuIS.