# Charting Alternatives in PxPlus

Chart Processing |

## Properties

The alternate chart interfaces support the following common control properties:

| BackColor$ | Enabled | Line | Top | _PropList$
| Col | Fmt$ | Lines | Visible | _PropSep$
| Cols | Height | Sep$ | Width | _PropValues$
| CtlName$ | Left | SepLoad$ |  |

Besides the standard chart formats (Area, Bar, Column, Line, Pie, Ribbon, Scatter and Stack), two additional formats are available: Donut for RGraph, and the Google RGraph and Gauge.

#### Note:
PxPlus supports Plus Charts, RGraph Charts, and Google Interactive Charts (using the Google Visualization API) as options to replace the internal PxPlus chart control.
(PxPlus Charts were added in PxPlus 2019.)

For information on defining a Chart control in the NOMADS Panel Designer, see Chart Control.

For information on how you can define simple charts based on the columns of a List Box, Grid or Query, see NOMADS AutoChart.

To learn how you can use a Query-based AutoChart definition to load a Smart Chart control, see Smart Controls.

To learn about creating images of charts for display on dashboards, on your website, or as part of your application, see Chart Images Generation.

For information on the utilities to use when working with chart images, see Chart Image Utilities.

The following chart-specific properties are also supported:

| CurrentPoint | NumSets | SelectIndex | Title2$
| CurrentSet | RangeMax | TextColor$ | XAxisTitle$
| LegendLocation$ | RangeMin | Title1$ | YAxisTitle$
| NumPoints |  |  |

The following additional properties are also supported:

Property | Chart Type | Description
Animate | Plus | Controls the animation of a Web/HTML rendered chart. When this property is set (non-zero) and the chart is first rendered, Bars and Columns grow from the zero line to full size, and all other charts are set to fade in when rendered. Only the chart contents are animated (not the frame, titles or set/point names) and only when rendered as HTML for use on the Web. (Animate support for Plus Charts was added in PxPlus 2019.)
AutoAnimate | RGraph | If On (1), the chart is animated whenever it is redrawn. (AutoAnimate support for RGraph was added in PxPlus 2019.)
Bitmap$ | Plus | Bitmap to appear as the background for the chart. Generally, this image will be scaled to cover the region. For all but PDF output, the system will retain the aspect ratio while cropping any excess imagery that will not fit. #### Note: When a Bitmap is set, the system will ignore the FaceColorBack$ property. (Bitmap$ support for Plus Charts was added in PxPlus 2019.)
Border | Plus | When this property is set, the chart will be drawn with a thin black border around the outside of the defined area. (Border support for Plus Charts was added in PxPlus 2019.)
ChartColors$ | Plus RGraph Google | List of colors to apply when plotting the different datasets of a chart. Color references may include PxPlus colors (e.g. Light Red, Dark Blue), RGB colors (e.g. RGB:130 0 130), User-defined colors (e.g. Color20) or Expressions (e.g. =myColor$). The colors are separated by a separator character that is the last character of the list. Example: Below is a sample color string: "Light Red;RGB:100 100 45;=myColor$;Color19;" See Colors for additional information on controlling the colors used for chart datasets. (The ChartColors$ property was added in PxPlus 2020.)
ColorByPoint | Plus | When this property is set (non-zero) and there is only one set of data, the system will draw each point in a different color as if each point was a set. (ColorByPoint support for Plus Charts was added in PxPlus 2019.)
ConnectorLine | Plus | (Applicable for Column and Bar Charts Only) When this property is set (non-zero), the system will draw lines between the ends of the columns or bars for each point/set in the chart. (ConnectorLine support for Plus Charts was added in PxPlus 2019.)
Currency | Plus RGraph | Indicates whether or not to display currency symbols. 0 = No currency symbol 1 = Display currency symbol in front of number -1 = Display currency symbol after number (Currency support for Plus Charts was added in PxPlus 2019.)
DecimalPrecision | Plus | Number of digits to display after the decimal point. (Default is 2. Maximum is 6.) (DecimalPrecision support for Plus Charts was added in PxPlus 2019.)
DefaultColor$ | Plus | Can be set to the default color to use for all text and non-chart lines (border, chart frame, etc.). If not set, Black will be used. (DefaultColor$ support for Plus Charts was added in PxPlus 2019.)
DisplayFormat$ | Plus | PxPlus numeric format to use when displaying numbers. If formatting fails, the system will default to its internal format. (DisplayFormat$ support for Plus Charts was added in PxPlus 2019.)
EnableTooltip | RGraph Google | If On (1), tooltips are shown when the user clicks on a chart segment. Boolean (0/1). Default is 1.
FaceColorBack$ | Plus | Color of the back pane of the chart. (FaceColorBack$ support for Plus Charts was added in PxPlus 2019.)
FaceColorBottom$ | Plus | Color used on the zero ledge on 3D charts. (FaceColorBottom$ support for Plus Charts was added in PxPlus 2019.)
FontColor1$ FontColour1$ | Plus RGraph Google | Plus - Color of the text on the main title. This color takes precedence over DefaultColor$ for the main title. Google - Color of all text except the key legend. RGraph - Color of the main title. (FontColor1$/FontColour1$ support for Plus Charts was added in PxPlus 2019.)
FontColor2$ FontColour2$ | Plus RGraph Google | Plus - Color of the text for point names, values and all titles and legends except the main title. This color takes precedence over DefaultColor$. Google - Color of the text in the key legend. RGraph - Color of all text except the main title. (FontColor2$/FontColour2$ support for Plus Charts was added in PxPlus 2019.)
Footer$ | Plus | Chart footer (text displayed centered below the chart). This is suppressed if there is no room to display. (Footer$ support for Plus Charts was added in PxPlus 2019.)
FormatNumberScale | Plus | Boolean value indicating whether to display numbers with formatted scale (e.g. 4.5K or 1.2M) or as full numbers (e.g. 45,000 or 1,200,000). Default is to use a formatted scale (1).
LegendLocation$ | Plus | Location of chart legend. Possible values are Top, Bottom, Left, Right, TopLeft, TopRight, BottomLeft, BottomRight and None. (LegendLocation$ support for Plus Charts was added in PxPlus 2019.)
LegendText$ | Plus | Legend text for a dataset. (LegendText$ support for Plus Charts was added in PxPlus 2019.)
MarginBottom | Plus | Set the number of lines for the bottom chart margin. (MarginBottom support for Plus Charts was added in PxPlus 2019.)
MarginLeft | Plus | Set the number of columns for the left chart margin. (MarginLeft support for Plus Charts was added in PxPlus 2019.)
MarginRight | Plus | Set the number of columns for the right chart margin. (MarginRight support for Plus Charts was added in PxPlus 2019.)
MarginTop | Plus | Set the number of lines for the top chart margin.
Margins$ | Plus | Set all chart margins. Use syntax "top:bottom:left:right" or "AUTOMATIC" to set margins to the automatic (default) mode. Example: x'margins$="10:10:20:10" (Margin$ support for Plus Charts was added in PxPlus 2019.)
NoChartDots | Plus | When this property is set (non-zero), suppresses the small dots that mark the data points on Area and Line charts. (NoChartDots property for Plus Charts was added in PxPlus 2023.)
NoUpdate | Plus | When this property is set (non-zero), suppresses redrawing the chart when a property is changed. Setting it to 0 (zero) triggers a redraw, and subsequent property changes will also cause the chart to be redrawn. (NoUpdate support for Plus Charts was added in PxPlus 2019.)
PastelPalette | Plus RGraph Google | When this property is set (non-zero), the system will use a different set of more pastel colors to display the charts. (PastelPalette support for Plus Charts was added in PxPlus 2019.)
PointText$ | Plus | Point label values. Single string of point label values where the last character is the delimiter. (PointText$ support for Plus Charts was added in PxPlus 2019.)
ProportionHW | Plus | Used to determine the ratio of the chart height to width when drawing responsive HTML charts. A value of 1 indicates the width and height should be considered the same; .56 works out to a roughly 9/16 aspect ratio. #### Note: When set, the width is always the governing factor for a responsive chart -- that is, the chart is drawn to fill the width available. (ProportionHW support for Plus Charts was added in PxPlus 2019.)
SelectPoint | Plus RGraph Google | Sequence number of the selected point. (SelectPoint support for Plus Charts was added in PxPlus 2019.)
ShowValues | Plus | When this property is set (non-zero), the system will display the actual point values on the chart. For Column charts, the values appear above/below the column. For Stacked charts, the values appear in the segment of the chart. For Bar charts, the values appear to the left/right of the bar. For Pie/Donut charts, the values appear as a percentage inside the pie chart (may be suppressed if not enough room). For Scatter charts, the X/Y values appear above the point. (ShowValues support for Plus Charts was added in PxPlus 2019.)
TextColor$ | Plus RGraph Google | When the CurrentSet property is set to zero, setting the TextColor$ property sets both FontColor1$ and FontColor2$ to the specified color. When the CurrentSet property is greater than zero, setting TextColor $ sets the color for the dataset represented by CurrentSet. (TextColor$ support for Plus, RGraph and Google Charts was added in PxPlus 2024.)
Value | Plus RGraph Google | Value for the point currently selected by setting the CurrentPoint and CurrentSet properties. (Value support for Plus Charts was added in PxPlus 2019.)
XAxisLocation$ | Plus | X-Axis location (Back or Bottom). (XAxisLocation$ support for Plus Charts was added in PxPlus 2019.)
YAxisLocation$ | Plus | Y-Axis location (Back or Left). (YAxisLocation$ support for Plus Charts was added in PxPlus 2019.)
greenFrom | Plus Google | (Applicable for Gauge Charts Only) Numeric value where the gauge will start turning green. (greenFrom support for Plus Charts was added in PxPlus 2019.)
greenTo | Plus RGraph Google | (Applicable for Gauge Charts Only) Numeric value where the gauge will stop turning green. On RGraph gauges, this also denotes the beginning of the yellow zone. (greenTo support for Plus Charts was added in PxPlus 2019.)
majorTicks$ | Google | (Applicable for Gauge Charts Only) String of labels for the major tick marks on the gauge. The last character of the string is used as the label separator.
minorTicks | Google | (Applicable for Gauge Charts Only) Number of tick marks between each major tick. Default is 2.
redFrom | Plus RGraph Google | (Applicable for Gauge Charts Only) Numeric value where the gauge will start turning red. On RGraph gauges, this also denotes the end of the yellow zone. (redFrom support for Plus Charts was added in PxPlus 2019.)
redTo | Plus Google | (Applicable for Gauge Charts Only) Numeric value where the gauge will stop turning red. (redTo support for Plus Charts was added in PxPlus 2019.)
yellowFrom | Plus Google | (Applicable for Gauge Charts Only) Numeric value where the gauge will start turning yellow. (yellowFrom support for Plus Charts was added in PxPlus 2019.)
yellowTo | Plus Google | (Applicable for Gauge Charts Only) Numeric value where the gauge will stop turning yellow. (yellowTo support for Plus Charts was added in PxPlus 2019.)

Properties which are not supported are available as dummy properties; they may be accessed but do not perform any function.

## Methods

The following methods are available:

Method | Description
Animate( ) | (Applicable for RGraph Charts Only) The chart is redrawn with animation. (The Animate( ) method was added in PxPlus 2019.)
Load(string$) | This method can be used in place of the CHART LOAD directive to load data into a chart. The last character of the string identifies the separator for each dataset while the value defined by SEP= when the chart is created (or the 'Sep$ property afterwards) is used to separate the different data points within each dataset. Legend labels can be specified as the first element in a dataset definition followed by an = (equals sign). Example: CHART_1.CTL'load("100,200,300,400/150,250,350,450/") CHT.CTL'load("Last Year=100,200,300,400/This Year=150,250,350,450/") (The Load(string$) method was added in PxPlus 2019.)
getOptions$( ) | Returns a string consisting of the additional options that have been set using the setOption( ) method. The format of the string will vary depending on the type of chart used.
setOption(op$,val$) | (Not available for Plus charts, as all Plus methods are available directly from the Plus chart object. See *OBJ/CHART.) Sets additional chart options specific to a particular chart. For RGraph charts, these options are the properties set using the Set( ) method. For Google charts, these are the options set using the Draw( ) method. See the appropriate API documentation for options and their possible values. #### Note: Options are case sensitive.

## Events

The Select (click) event is fired when the user clicks a graph segment. When a point, bar or pie slice is clicked, the chart's SelectIndex property is set with the dataset number, the SelectPoint property is set with the point number, and an OnChange event is fired.

## Chart Directives

All chart directives are supported except the CHART creation directive and CHART REMOVE. See CHART directive.