JavaFX Area Chart

JavaFX Area Chart

The JavaFX Area Chart is used to draw area charts. An area chart is a line chart with colored paint applied to the area below the lines. The colored part of the chart represents the area or any comparable quantities. The group or collection of data points called markers are used to draw a JavaFX Area Chart. The class JavaFX.scene.chart.AreaChart is used to represent the JavaFX AreaChart component.

Constructors

The class contains two constructors.

• public LineChart(Axis Xaxis, Axis Yaxis ): creates a new LineChart object with the chosen axis.
• public LineChart(Axis Xaxis, Axis Yaxis, ObservableList<xy.chartseries> data): create the new instance of LineChart with the chosen axis and data of the series.

Properties

Steps to Generate JavaFX Area Chart

The steps mentioned below can be used to build JavaFX Area Chart.

Step 1: Creating a Class

Create a new public class in Java and extend the “Application” class to use JavaFX in your class.

public class AreaChartExample extends Application  {

}  

You can also try this code with Online Java Compiler

Run Code

Step 2: Configure the Axes

The y-axis and x-axis must be configured with the specific coordinates and a label to draw the JavaFX Area chart.

//x-axis representation 
var xAxis = new CategoryAxis();
xAxis.setLabel("Time");

//y-axis representation 
var yAxis = new NumberAxis();
yAxis.setLabel("Thousand bbl/d");

You can also try this code with Online Java Compiler

Run Code

Step 3: Create the JavaFX Area chart

Create an object for the AreaChart class and constructors based on your parameters.

var areaChart = new AreaChart<>(xAxis, yAxis);

You can also try this code with Online Java Compiler

Run Code

Step 4: Add Data to the series

The creation of an instance of the XYChart series is the essential phase in creating a JavaFX Area chart. The values shown in the chart will be added using the syntax below.

//to create the series   
var data = new XYChart.Series<String, Number>();

//set the name and the data to the series   
areaChart.setTitle("Oil consumption");
data.getData().add(new XYChart.Data<>("2004", 82502));
data.getData().add(new XYChart.Data<>("2005", 84026));
data.getData().add(new XYChart.Data<>("2006", 85007));
data.getData().add(new XYChart.Data<>("2007", 86216));
data.getData().add(new XYChart.Data<>("2008", 85559));
data.getData().add(new XYChart.Data<>("2009", 84491));
data.getData().add(new XYChart.Data<>("2010", 87672));
data.getData().add(new XYChart.Data<>("2011", 88575));
data.getData().add(new XYChart.Data<>("2012", 89837));
data.getData().add(new XYChart.Data<>("2013", 90701));

You can also try this code with Online Java Compiler

Run Code

Step 5: Add data to the chart

Use the syntax below to add the previously generated data to the series.

//for adding series to the linechart   
areaChart.getData().add(data);
areaChart.setLegendVisible(false);

You can also try this code with Online Java Compiler

Run Code

Step 6: Configure Group and Scene

A group needs to be created to put together all the data. Once the group has been formed, the class javafx.scene is instantiated to generate the scene. The only argument in the scene that may be accepted is the group.

//setting Group and Scene   
var root = new HBox();
var scene = new Scene(root, 490, 350);
stage.setTitle("AreaChart");
stage.setScene(scene);
stage.show();

You can also try this code with Online Java Compiler

Run Code

Below is the Java program, which generates a line chart.

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.AreaChart;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class AreaChartExample extends Application {

    @Override
    public void start(Stage stage) {
        initUI(stage);
    }

    private void initUI(Stage stage) {

        var root = new HBox();
        var scene = new Scene(root, 490, 350);

        var xAxis = new CategoryAxis();
        xAxis.setLabel("Time");

        var yAxis = new NumberAxis();
        yAxis.setLabel("Thousand bbl/d");
        
        //Creating Areachart  
        var areaChart = new AreaChart<>(xAxis, yAxis);

        //Setting title for areachart   
        areaChart.setTitle("Oil consumption");

        var data = new XYChart.Series<String, Number>();

        data.getData().add(new XYChart.Data<>("2004", 82502));
        data.getData().add(new XYChart.Data<>("2005", 84026));
        data.getData().add(new XYChart.Data<>("2006", 85007));
        data.getData().add(new XYChart.Data<>("2007", 86216));
        data.getData().add(new XYChart.Data<>("2008", 85559));
        data.getData().add(new XYChart.Data<>("2009", 84491));
        data.getData().add(new XYChart.Data<>("2010", 87672));
        data.getData().add(new XYChart.Data<>("2011", 88575));
        data.getData().add(new XYChart.Data<>("2012", 89837));
        data.getData().add(new XYChart.Data<>("2013", 90701));

        areaChart.getData().add(data);
        areaChart.setLegendVisible(false);
        root.getChildren().add(areaChart);

        stage.setTitle("AreaChart");
        stage.setScene(scene);
        stage.show();
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}

You can also try this code with Online Java Compiler

Run Code

The above program creates a JavaFX window that displays a JavaFX Area chart, as seen below.

Output 

Frequently Asked Questions

Why do we use the JavaFX Area Chart?

The JavaFX Area Chart is a type of two-axis chart used to show the quantitative volumes of any data or product over a particular time interval and the changes that took place in that specific period of time. They are created by plotting a series of points that can represent changes over a short or long period. 

Are pie charts comparable?

Pies shouldn't typically be used to compare data across pies, judge the relative sizes of categories, or show percentages that don't add up to 100%.

What three elements make up a JavaFX application?

A JavaFX application will typically consist of three main parts: 

• Stage
• Scene
• Nodes.

What are the three life cycle methods of the JavaFX application?

The three life cycle methods of JavaFX application are:-

• public void init()
• public abstract void start(Stage primaryStage)
• public void stop()

What type of data is used in the JavaFX area Chart?

The type of data used in a JavaFx Area Chart is usually the data that represents the time-series relationship. The data markers are used to represent the data and its changes over specific periods.

Conclusion

In this article, we have discussed JavaFX Area Chart. You can now create your own JavaFX Area Chart to represent any dynamic data.

We hope this article helps you to learn something new. And if you're interested in learning more, see our posts on JSP, 15 Best Java Frameworks To Use In 2021, Java Development Kit(JDK), Lambda Expressions in Java, and Java knowledge for your first coding job. Visit our practice platform Coding Ninjas Studio to practice top problems, attempt mock tests, read interview experiences, and much more.! Thank you for reading this post :-)

Feel free to upvote and share this article if it has been helpful for you.