Waterfall charts graphically illustrate the cumulative effect of sequentially introducing positive or negative values to an initial value. The initial and final (or total) values are represented by whole columns drawn from the ordinal axis baseline. Intermediate positive and negative values are drawn as floating columns.
These properties control the general layout of a waterfall chart.
The following code segment shows the default settings:
waterfallProperties: { appendTotalRiser: true, positiveRiserColor: '#77b39a', negativeRiserColor: '#e2675b', zeroRiserColor: '#7593bd', otherRiserColor: '#aaaaaa', subtotalRisers: [], otherRisers: [], connectorLine: { width: 1, color: 'black', dash: '' } },
How to: |
This property controls the generates a total riser as the last riser in a waterfall chart.
waterfallProperties: {
appendTotalRiser: boolean },
where:
Valid values are:
The following request generates a waterfall chart with a total riser (the default):
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; DECR1 = (COGS_US - 1000); DECR2 = (COGS_US -500); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 AS 'Qtr1' INCR2 AS Qtr2' DECR1 AS 'Qtr3' DECR2 AS 'Qtr4' ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * *GRAPH_JS legend: {visible:false}, waterfallProperties: { appendTotalRiser: true } *END INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ ENDSTYLE END
The output is:
Changing appendTotalRiser to false generates the following chart:
How to: |
These properties control the appearance of connector lines between risers in a waterfall chart.
waterfallProperties: { connectorLine: { width: number, color: 'cstring', dash: 'dstring' } },
where:
Is the width of the connector line in pixels. The default value is 1.
Is a color name or numeric specification string. The default value is 'black'.
Is a string that defines the dash style of the connector lines. The default value is '', which produces a solid line. Use a string of numbers that specifies the width of a dash followed by the width of the gap between dashes (for example, dash: '1 1' draws a dotted line).
The following request generates a waterfall chart in which the connector lines are 2 pixels wide, dark blue, and dashed:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; DECR1 = (COGS_US - 1000); DECR2 = (COGS_US -500); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 AS 'Qtr1' INCR2 AS Qtr2' DECR1 AS 'Qtr3' DECR2 AS 'Qtr4' ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS legend: {visible:false}, waterfallProperties: { connectorLine: {width: 2, color: 'darkblue', dash: '2 2'}, } *END ENDSTYLE END
The output is:
How to: |
This property controls the color of risers that represent negative values in a waterfall chart.
Note: You can use series-specific properties to format risers individually, by specifying a color for each group under series 0.
waterfallProperties: {
negativeRiserColor: color },
where:
Defines the negative riser color. Valid values are:
For information about specifying colors and gradients, see Colors and Gradients.
The following request generates a waterfall chart in which the risers for negative values are black:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; DECR1 = (COGS_US - 1000); DECR2 = (COGS_US -500); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 AS 'Qtr1' INCR2 AS Qtr2' DECR1 AS 'Qtr3' DECR2 AS 'Qtr4' ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS legend: {visible:false}, waterfallProperties: { negativeRiserColor: 'black'} *END ENDSTYLE END
The output is:
You can use series-specific properties to format risers individually, by specifying a color for each group under series 0. For example:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; DECR1 = (COGS_US - 1000); DECR2 = (COGS_US -500); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 AS 'Qtr1' INCR2 AS Qtr2' DECR1 AS 'Qtr3' DECR2 AS 'Qtr4' ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS legend: {visible:false},series: [ {series: 0, group: 0, color: '#7593bd'}, {series: 0, group: 1, color: '#77b39a'}, {series: 0, group: 2, color: '#77b39a'}, {series: 0, group: 3, color: '#7593bd'}, {series: 0, group: 4, color: 'coral'}, {series: 0, group: 5, color: 'pink'} ] *END ENDSTYLE END
On the output, each riser has the color specified for that group:
How to: |
The otherRiserColor property controls the color of risers that represent other values (if any) in a waterfall chart. Other values are defined in the otherRisers array.
waterfallProperties: {
otherRiserColor: color },
where;
Specifies a color for the other risers . Valid values are:
For information about specifying colors and gradients, see Colors and Gradients.
The following request generates a waterfall chart in which the other risers are colored light grey:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; INCR3 = COGS_US +1500; INCR4 = COGS_US +2000; DECR1 = (COGS_US - 2000); DECR2 = (COGS_US -1500); DECR3 = (COGS_US -1000); DECR4 = (COGS_US -500); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 INCR2 INCR3 INCR4 DECR1 DECR2 DECR3 DECR4 ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS legend: {visible:false}, groupLabels: ['Initial', 'A', 'B', 'Subtotal', 'C', 'D', 'E', 'F','Total'], waterfallProperties: { otherRiserColor: 'lightgrey', otherRisers: ['E', 'F']} *END ENDSTYLE END
The output is:
Note: You can also use series-specific properties to format risers individually. For an example, see Controlling the Color of Negative Risers in a Waterfall Chart.
How to: |
The otherRisers property defines one or more groups or values to be interpreted as other values. Risers representing these values will be assigned the color defined by the otherRiserColor property.
waterfallProperties: {
otherRisers: [array]
},
where:
Can be an array of:
The following request generates a waterfall chart. The groupLabels object assigns group label names to each group, and the waterfallProperties otherRisers property assigns groups E and F to the other risers category:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; INCR3 = COGS_US +1500; DECR1 = (COGS_US - 2000); DECR2 = (COGS_US -1500); DECR3 = (COGS_US -1000); DECR4 = (COGS_US -500); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 INCR2 INCR3 DECR1 DECR2 DECR3 DECR4 ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS groupLabels: ['Initial', 'A', 'B', 'Subtotal', 'C', 'D', 'E', 'F','Total'], waterfallProperties: { otherRiserColor: 'lightgrey', otherRisers: ['E', 'F'], } *END ENDSTYLE END
On the chart output, the other risers are drawn in light grey, the color assigned by the otherRiserColor property:
How to: |
The positiveRiserColor property controls the color of risers that represent positive values in a waterfall chart.
waterfallProperties: {
positiveRiserColor: color },
where:
Defines a color for the positive risers. Valid values are:
For information about specifying colors and gradients, see Colors and Gradients.
The following request generates a waterfall chart in which the risers for positive values are the color burlywood:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; INCR3 = COGS_US +1500; DECR1 = (COGS_US - 2000); DECR2 = (COGS_US -1500); DECR3 = (COGS_US -1000); DECR4 = (COGS_US -500); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 INCR2 INCR3 DECR1 DECR2 DECR3 DECR4 ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS legend: {visible:false}, groupLabels: ['Initial', 'A', 'B', 'C', 'Subtotal', 'D', 'E', 'F','Total'], waterfallProperties: { positiveRiserColor: 'burlywood'} *END ENDSTYLE END
The output is:
Note: You can also use series-specific properties to format risers individually. For an example, see Controlling the Color of Negative Risers in a Waterfall Chart.
How to: |
This property defines one or more groups or values to be interpreted as subtotal values.
waterfallProperties: {
subtotalRisers: [array]
},
where:
Can be an array of:
The following generates a waterfall chart with two subtotal risers. The groupLabels object assigns names to each riser, and the subtotalRisers object specifies those names in its array:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; INCR3 = COGS_US +INCR1 +INCR2; INCR4 = COGS_US +2000; DECR1 = -(INCR4- 500); DECR2 = INCR3 +500; DECR3 = -(COGS_US-2000); END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 INCR2 INCR3 INCR4 DECR1 DECR2 DECR3 ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS legend: {visible:false}, groupLabels: ["Beginning Cash", "Income", "Expense","Subtotal1","Income2","Expense2","Subtotal2","Expense3","TOTAL" ], waterfallProperties: { subtotalRisers: ['Subtotal1','Subtotal2'], } *END ENDSTYLE END
The output is:
How to: |
The zeroRiserColor property controls the color of any riser placed in the subtotal array and the riser that represents the total value in a waterfall chart.
waterfallProperties: {
zeroRiserColor: color },
where:
Specifies the color for any riser placed in the subtotal array and the riser representing the total value. Valid values are:
For information about specifying colors and gradients, see Colors and Gradients.
The following request generates a waterfall chart and sets the zeroRiserColor property to a linear gradient that transitions from bisque to light blue. It adds the initial value riser to the subtotal array, so the initial value riser also displays using the specified gradient:
DEFINE FILE WF_RETAIL_LITE INCR1 = COGS_US + 500; INCR2 = COGS_US +1000; INCR3 = COGS_US +INCR1 +INCR2; DECR1 = -(INCR4- 500); DECR2 = INCR3 +500; END GRAPH FILE WF_RETAIL_LITE SUM COGS_US INCR1 INCR2 INCR3 DECR1 DECR2 ON GRAPH PCHOLD FORMAT JSCHART ON GRAPH SET LOOKGRAPH VWATERFL ON GRAPH SET STYLE * INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$ *GRAPH_JS legend: {visible:false}, groupLabels: ['Initial', 'A', 'B', 'Subtotal', 'C', 'D','Total'], waterfallProperties: { subtotalRisers: ['Initial','Subtotal'], zeroRiserColor: { type: 'linear', start: {x: '0%', y: '0%'},end: {x: '100%', y: '100%'}, stops: [[0, 'bisque'],[1, 'lightblue']] } } *END ENDSTYLE END
The output is:
Note: You can also use series-specific properties to format risers individually. For an example, see Controlling the Color of Negative Risers in a Waterfall Chart.
WebFOCUS |