OverviewOptions class (Graph)

The dock field specifies the edge of the container the overview-window is anchored to. The overview map is shown from top to bottom when the overview window is docked to the left or right side of the view.

null {null}, by default, the overview is anchored to the top-side of the view
"bottom" {string} or exontrol.Graph.PanelDockEnum.exBottom or 2 {number}, the overview is docked to the bottom side of the control

The line field defines the configuration options for displaying the lines of values in the overview.

null {null}, indicates a solid 1-pixel wide overview-line (the color of line is indicated by the color of the serie)
{color: "red", width: 2} {LineOptions}, indicates a solid-red 2-pixels wide overview-line

The serie field specifies a serie or multiple series separated by commas to be represented within the overview-map.

The format of a particular element of the serie field is:

"SERIE[\[INNER\]][:[COLOR][-fill [FILLCOLOR]]]"

where:

• SERIE indicates the index of the serie
• INNER [optional], specifies inner-index (for multi-dimensional series)
• COLOR [optional], specifies color to show the overview-line (if missing, the color to show the serie is used instead)
• -fill: [optional], indicates the serie is filled
• FILLCOLOR [optional], color to fill the overview-curve (if missing, the color to show the serie is used instead)

Multiple series can be represented by separating entries with commas.

The overview map is shown only for area-compatible chart types (area, line, column, waterfall, rangeArea, rangeColumn, candleStick, ohlc). If a specified serie is not compatible with area-chart types, it is ignored.

Format BNF:

   <overview-property> ::= <serie-entry> ["," <serie-entry>]*
   <serie-entry>       ::= <serie-index> [ "[" <dimension-index> "]" ] [ ":" <line-color> [ <fill> ] ] [ <fill-color> ]
   <serie-index>       ::= <number>
   <dimension-index>   ::= <number>
   <line-color>        ::= <color-spec>
   <fill>              ::= "-fill"
   <fill-color>        ::= <color-spec>
   <color-spec>        ::= see notes

Notes:

• CSSColor or CSS legal color values can be specified by the following methods:
  • Hexadecimal colors, is specified with: #RRGGBB, where the RR (red), GG (green) and BB (blue) hexadecimal integers specify the components of the color. All values must be between 00 and FF. For example, #0000ff value is rendered as blue, because the blue component is set to its highest value (ff) and the others are set to 00.
  • Hexadecimal colors with transparency, is specified with: #RRGGBBAA, where AA (alpha) value must be between 00 and FF. For example, #0000ff80 defines a semi-transparent blue.
  • RGB colors, is specified with the RGB(red, green, blue) function. Each parameter (red, green, and blue) defines the intensity of the color and can be an integer between 0 and 255. For example, rgb(0,0,255) defines the blue color.
  • RGBA colors, are an extension of RGB color values with an alpha channel as RGBA(red, green, blue, alpha) function, where the alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque). For example, rgba(0,0,255,0.5) defines a semi-transparent blue.
  • HSL colors, is specified with the HSL(hue, saturation, lightness) function, where hue is a degree on the color wheel (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue. saturation is a percentage value; 0% means a shade of gray and 100% is the full color. lightness is also a percentage; 0% is black, 100% is white. HSL stands for hue, saturation, and lightness - and represents a cylindrical-coordinate representation of colors. For example, hsl(240, 100%, 50%) defines the blue color.
  • HSLA colors, are an extension of HSL color values with an alpha channel - which specifies the opacity of the object as HSLA(hue, saturation, lightness, alpha) function, where alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque). For example, hsla(240, 100%, 50%,0.5) defines a semi-transparent blue.
  • Predefined/Cross-browser color names, 140 color names are predefined in the HTML and CSS color specification. For example, blue defines the blue color.
• Any comma inside a color value must be escaped twice as \\, e.g., rgba(0\\,0\\,255\\,0.5)
• Alpha values: 0–1 for RGBA/HSLA; 00–FF for hex-alpha
• The <serie-index> and <dimension-index> values are zero-based indices

null {null}, the overview map displays the first serie by default, as long as it is valid and compatible with area-chart types
"0,1" {string}, indicates that first two series are represented within the overview.
"0:black,0[1]:red,0[2]:blue,0[3]:green" {string}, shows four overview-lines for the first, second, third and forth-dimension of the same serie (the first serie with the index 0)
"2:-fill,0" {string}, the overview shows the first and third series (the third serie is filled)
"0:black-fill rgba(0\\,0\\,0\\,0.25)" {string}, shows the first serie filled with a semi-transparent color and contoured in black

The size field specifies the size of the control's overview.

null {null}, by default, the overview's size is 64-pixels
32 {number}, sets the overview's size to 32-pixels tall (if anchored to the top or bottom side)

The visible field shows or hides the overview. The overview-window is visible only for area-compatible chart types.

null {null}, by default, the overview is hidden
true {boolean}, shows the overview (the overview displays the map of the entire series without a scroll bar)