Defining a Border for Series Risers

How to:

The border properties define a border for all risers, for all risers in an individual series, or for an individual riser identified by a series and group number. It can be used for area risers, bar risers, funnel segments, gauge needles, and pie slices.

Top of page
x
Syntax: How to Define a Border for Series Risers
series: [
   {
      series: snumber, 
      group: gnumber, // optional
      border: {
         width: wnumber, 
         color: 'cstring',
         dash: 'dstring'
      },
   }
]

where:

snumber

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

gnumber

Is an optional zero-based group number. If the group does not exist in the chart, the property is ignored. If a group number is not specified, the border is applied to all risers in the series.

wnumber

Is a number that defines the width of the border in pixels.

'cstring'

Is a color defined by a color name or numeric specification string.

For information about defining colors, see Colors and Gradients.

'dstring'

Is a string that defines the border dash style. Use a string of numbers that defines the width of a dash in pixels followed by the width of the gap between dashes in pixels.
Example: Defining Borders for Series Risers

The following request against the GGSALES data source generates a bar chart with three series. The risers for series 0 have a green dashed border, and the risers for series 2 have a red solid border:

GRAPH FILE GGSALES
SUM DOLLARS UNITS BUDDOLLARS
BY CATEGORY
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH VBAR
ON GRAPH SET STYLE *
*GRAPH_JS
series: [
   {series: 0, color: 'aquamarine', border: {width: 2, color: 'green', dash: '2 2'}},
   {series: 1, color: 'burlywood'},
   {series: 2, color: 'coral', border: {width: 2, color: 'red'}},
]
*END
ENDSTYLE
END

The output is:

The following request generates a stacked area chart. The riser for series 0 has a blue solid border, the riser for series 1 has a brown dashed border, and the riser for series 2 has a red solid border:

GRAPH FILE GGSALES
SUM AVE.DOLLARS MAX.UNITS MDN.BUDDOLLARS
BY PRODUCT
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH VAREASTK
ON GRAPH SET STYLE *
*GRAPH_JS
series: [
   {series: 0, color: 'aquamarine', border: {width: 3, color: 'blue'}},
   {series: 1, color: 'burlywood', border: {width: 4, color: 'brown', 
dash: '2 2'} },
   {series: 2, color: 'coral', border: {width: 2, color: 'red'} },
]
*END
ENDSTYLE
END

The output is:

The following request generates a pie chart and defines borders for some of the slices: 

GRAPH FILE GGSALES
SUM DOLLARS
BY PRODUCT 
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH PIE
ON GRAPH SET STYLE *
*GRAPH_JS
series: [
   {series: 0, color: 'cyan', border: {width: 4, color: 'blue'}},
   {series: 1, color: 'bisque'},
   {series: 2, color: 'slateblue', border: {width: 4, color: 'navy', dash: '2 4'}},
   {series: 3, color: 'red'},
   {series: 4, color: 'green', border: {width: 4, color: 'limegreen'}},
   {series: 5, color: 'yellow'},
   {series: 6, color: 'blue', border: {width: 4, color: 'lightblue', dash: '4 2'}},
   {series: 7, color: 'orange'},
   {series: 8, color: 'limegreen', border: {width: 4, color: 'green'}},
   {series: 9, color: 'lavender'}
]
*END
ENDSTYLE
END

The output is:

WebFOCUS