Charting > Series-Specific Properties > Drawing a Series Trendline in Bubble and Scatter Charts

Drawing a Series Trendline in Bubble and Scatter Charts

How to:

The trendline properties draw a trendline and equation label for individual series in bubble and scatter charts.

Note: You can also draw a trendline for all series using the global trendline property. For information, see Drawing Trendlines in Bubble and Scatter Charts (trendline).

Syntax: How to Draw a Series Trendline For Series in Bubble and Scatter Charts 

"series": [
{
  "series": number, 
      "trendline": {  
         "enabled": boolean,
         "mode": "string",
         "order": number,  
         "lineStyle": {
             "width": number,
             "color": "string",  
             "dash": "string"
                   },    
         "equationLabel": {
            "visible": boolean,
            "font": "string",
            "color": "string",
            "mode": "string"
         }
      }
}
]

where:

"series": number

Is a zero-based series number. If the series does not exist in the chart, the property is ignored.

"enabled": boolean

Enables or disables the trendline. Valid values are:

  • true, which enables the trendline.
  • false, which disables the trendline. This is the default value.
"mode": "string"

Is string that defines the trendline mode (the type of equation used to generate the trendline). Valid values are:

  • "exponential".
  • "geometric".
  • "hyperbolic",
  • "linear". This is the default value if the trendline is visible.
  • "logarithmic".
  • "logQuadratic".
  • "modExponential".
  • "modHyperbolic".
  • "polynomial".
  • "quadratic".
  • "rational".
  • undefined. This is the default value if the line is not visible. If the trendline is visible but "mode" is undefined, "linear" mode will be used.
"order": number

Applies to polynomial mode. Specifies the degree of the polynomial. The default value is 3.

"lineStyle":

Defines the properties of the trendline.

"width": number

Defines the width of the trendline in pixels. The default value is 1.

"color": "string"

Is a color specification string that defines the color of the trendline. The default value is undefined, which uses the series color for the trendline color.

"dash": "string"

Is a string that defines the dash style of the trendline. Specify the length of a dash in pixels followed by the number of pixels between dashes (for example, "1 1", which generates a dotted line). The default value is no dash ("").

"equationLabel"
Defines the properties of the equation label for the trendline.
"visible": boolean

Controls the visibility of the equation label. Valid values are:

  • true, which shows the equation label.
  • false, which does not show the equation label. This is the default value.
"font": "string"

Is a string that defines the size, style, and typeface of the equation label. The default value is "8pt Sans-Serif".

"color": "string"

Is a color defined by a color name or numeric specification string. The default value is "black".

"mode": "string"

Is a string that defines the equation label mode. Valid values are:

  • "equation", which displays the equation in the most appropriate form for the type of trendline generated. For a linear trendline, the equation is displayed in slope intercept form. This is the default value.
  • "r", which displays the correlation coefficient.

Example: Drawing a Series Trendline

The following request generates a scatter chart with a linear trendline for series 2: 

GRAPH FILE WF_RETAIL_LITE
SUM DISCOUNT_US GROSS_PROFIT_US REVENUE_US
BY BRAND
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH SCATTERS
ON GRAPH SET STYLE *
*GRAPH_JS
"series": [
	{"series": 0, "color": "red"},
	{"series": 1, "color": "green"},
	{"series": 2, "color": "blue", 
		"trendline": {"enabled": true, "mode": "linear"
		}}]
*END
ENDSTYLE
END

The output is:

The following version of the request adds a purple equation label: 

GRAPH FILE WF_RETAIL_LITE
SUM DISCOUNT_US GROSS_PROFIT_US REVENUE_US
BY BRAND
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH SCATTERS
ON GRAPH SET STYLE *
*GRAPH_JS
"series": [
	{"series": 0, "color": "red"},
	{"series": 1,"color": "green"},
	{"series": 2, "color": "blue", "trendline": {
		"enabled": true, "mode": "linear", "equationLabel": {
			"visible": true, "color": "purple"}}}]
*END
ENDSTYLE
END

The output is:

Example: Styling a Series Trendline

The following request styles the trendline to be two pixels wide, red, and dashed.

GRAPH FILE WF_RETAIL_LITE
SUM DISCOUNT_US 
BY BRAND
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH SCATTER
ON GRAPH SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/ibi_themes/Warm.sty,$
TYPE=DATA, COLUMN=BRAND, BUCKET=x-axis,$
TYPE=DATA, COLUMN=DISCOUNT_US , BUCKET=y-axis,$
*GRAPH_JS
"series": [
{"series": 0, "color": "blue", "trendline": {"enabled": true, 
   "mode": "polynomial", "order": 3, 
   "lineStyle": {"width": 2, "color": "red", "dash": "2 4"},
}}]
*END
ENDSTYLE
END

The output is shown in the following image.

 WebFOCUS

Feedback