Javatpoint Logo
Javatpoint Logo

Component in Visualforce Page

It is one of the most important components that is used for defining the data series that needs to be rendered as a shaded area in a VF chart. The <apex:areaSeries> component is similar to the <apex:lineSeries> component with the fill attribute set to true.

The <apex:areaSeries> component has the following attributes:

1. axis

The axis attribute is of type String that is used to define the axis by which the chart series should bind to. Left, right, top and bottom are the possible values for it.

The bound axis should be defined by a sibling component, i.e., <apex:axis> component.

Syntax:

2. colorSet

It is of type String that is used for defining the set of color values. We specify the colors as the hexadecimal color that should be comma separated.

Syntax:

3. highlight

It is of type Boolean that is used for specifying whether each level should be highlighted or not when the mouse pointer passes over it. By default, its value is set to true.

Syntax:

4. hightlightLineWidth

It is of type Integer that is used for specifying the width(pixels) of the line that surrounds a level when it's highlighted.

Syntax:

5. highlightOpacity

It is of type String that is used for specifying the decimal number between 0 and 1. The decimal number represents the opacity of the color overlay on a level when it's highlighted.

Syntax:

6. highlightStrokeColor

It is of type String that is used for specifying the color(hex code) of the line that surrounds a level when it's highlighted.

Syntax:

7. id

The id attribute is of type string that allows the chart component to be referenced by other components on the page.

Syntax:

8. opacity

It is of type string that is used for specifying the decimal number between 0 and 1. The decimal number represents the opacity of the filled area for this level of series.

Syntax:

9. rendered

It is of type Boolean that is used for specifying whether the char series is rendered in the chart or not. By default, its value is set to true.

Syntax:

10. rendererFn

It is of type string that is used for specifying the name of the JavaScript function. The specified function overrides how each data point is rendered.

Syntax:

11. showInLegend

It is of type Boolean that is used for specifying whether this chart needs to be added to the chart legend or not. By default, its value is set to true.

Syntax:

12. tips

We use this attribute when we need to display a tooltip for each data point marker when the mouse pointer passes over it. This attribute is of type Boolean, and by default, its value is set to true.

Syntax:

13. title

It is of type string that is used for defining the title of this chart series that need to be displayed in the chart legend.

Syntax:

14. xField

The field in each record is provided in the chart data from which to retrieve the x-axis value for each data point in the series. This field must exist in every record in the chart data.

Syntax:

15. yField

The field in each record is provided in the chart data from which to retrieve the x-axis value for each data point in the series. This field must exist in every record in the chart data.

Syntax:

Let's take an example to understand how we can use the areaSeries component in VF:

ApexAreaSeriesExample.vfp

ApexAreaSeriesController.apxc

Output

apex:areaSeries Component in Visualforce Page
apex:areaSeries Component in Visualforce Page





Youtube For Videos Join Our Youtube Channel: Join Now

Feedback


Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Preparation


Trending Technologies


B.Tech / MCA