JavaFX - Gráfico de Área

Os gráficos de área são usados ​​para desenhar gráficos baseados em área. Ele plota a área entre a série de pontos fornecida e o eixo. Em geral, este gráfico é usado para comparar duas quantidades.

A seguir está um gráfico de área que descreve o número de frutas consumidas por duas pessoas em uma semana.

No JavaFX, um gráfico de área é representado por uma classe chamada AreaChart. Esta classe pertence ao pacotejavafx.scene.chart. Ao instanciar essa classe, você pode criar um nó AreaChart no JavaFX.

Etapas para gerar gráfico de área

Para gerar um gráfico de área em JavaFX, siga as etapas fornecidas abaixo.

Etapa 1: Criação de uma classe

Crie uma classe Java e herde o Application classe do pacote javafx.application e implementar o start() método desta classe da seguinte forma.

public class ClassName extends Application { 
   @Override     
   public void start(Stage primaryStage) throws Exception {     
   }    
}

Etapa 2: Definindo o eixo

Defina os eixos X e Y do gráfico de área e defina rótulos para eles. Em nosso exemplo, o eixo X representa os dias de uma semana e o eixo y representa as unidades de frutas consumidas.

//Defining the X axis               
CategoryAxis xAxis = new CategoryAxis();  
           
//Defining the y Axis 
NumberAxis yAxis = new NumberAxis(0, 15, 2.5); 
yAxis.setLabel("Fruit units");

Etapa 3: Criação do gráfico de área

Crie um gráfico de linha instanciando a classe chamada AreaChart do pacote javafx.scene.chart. Para o construtor desta classe, passe os objetos que representam os eixos X e Y criados na etapa anterior.

//Creating the Area chart 
AreaChart<String, Number> areaChart = new AreaChart(xAxis, yAxis);         
areaChart.setTitle("Average fruit consumption during one week");

Etapa 4: preparação dos dados

Instancie o XYChart.Seriesclasse. Em seguida, adicione os dados (uma série de coordenadas xey) à lista Observável desta classe da seguinte forma -

//Prepare XYChart.Series objects by setting data  
XYChart.Series series1 = new XYChart.Series();  
series1.setName("John"); 
series1.getData().add(new XYChart.Data("Monday", 3)); 
series1.getData().add(new XYChart.Data("Tuesday", 4)); 
series1.getData().add(new XYChart.Data("Wednesday", 3)); 
series1.getData().add(new XYChart.Data("Thursday", 5)); 
series1.getData().add(new XYChart.Data("Friday", 4)); 
series1.getData().add(new XYChart.Data("Saturday", 10)); 
series1.getData().add(new XYChart.Data("Sunday", 12));  

XYChart.Series series2 = new XYChart.Series(); 
series2.setName("Jane"); 
series2.getData().add(new XYChart.Data("Monday", 1)); 
series2.getData().add(new XYChart.Data("Tuesday", 3)); 
series2.getData().add(new XYChart.Data("Wednesday", 4));  

series2.getData().add(new XYChart.Data("Thursday", 3)); 
series2.getData().add(new XYChart.Data("Friday", 3)); 
series2.getData().add(new XYChart.Data("Saturday", 5)); 
series2.getData().add(new XYChart.Data("Sunday", 4));

Etapa 5: adicionar dados ao gráfico de área

Adicione a série de dados preparada na etapa anterior ao gráfico de área da seguinte forma -

//Setting the XYChart.Series objects to area chart        
areaChart.getData().addAll(series1,series2);

Etapa 6: Criação de um objeto de grupo

No start() método, crie um objeto de grupo instanciando a classe chamada Group, que pertence ao pacote javafx.scene.

Passe o objeto AreaChart (nó), criado na etapa anterior como parâmetro para o construtor da classe Group. Isso deve ser feito para adicioná-lo ao grupo da seguinte forma -

Group root = new Group(areaChart);

Etapa 7: Criação de um objeto de cena

Crie uma cena instanciando a classe chamada Scene, que pertence ao pacote javafx.scene. Para esta classe, passe o objeto Grupo (root) criado na etapa anterior.

Além do objeto raiz, você também pode passar dois parâmetros duplos que representam a altura e a largura da tela, junto com o objeto da classe Grupo da seguinte maneira.

Scene scene = new Scene(group ,600, 300);

Etapa 8: Definir o título do palco

Você pode definir o título do palco usando o setTitle() método do Stageclasse. oprimaryStage é um objeto Stage, que é passado para o método start da classe Scene como um parâmetro.

Usando o primaryStage objeto, defina o título da cena como Sample Application do seguinte modo.

primaryStage.setTitle("Sample Application");

Etapa 9: Adicionando cena ao palco

Você pode adicionar um objeto Scene ao palco usando o método setScene() da classe chamada Stage. Adicione o objeto Scene preparado nas etapas anteriores usando o método a seguir.

primaryStage.setScene(scene);

Etapa 10: Exibindo o conteúdo do palco

Exibir o conteúdo da cena usando o método chamado show() do Stage classe da seguinte forma.

primaryStage.show();

Etapa 11: iniciar o aplicativo

Inicie o aplicativo JavaFX chamando o método estático launch() do Application classe do método principal da seguinte forma.

public static void main(String args[]){   
   launch(args);      
}

Exemplo

A tabela a seguir mostra o número de frutas consumidas por John e Jane em uma semana.

Dia da semana Frutas consumidas por joão Frutas consumidas por Jane
Segunda-feira 3 1
terça 4 3
Quarta feira 3 4
Quinta feira 5 3
Sexta-feira 4 3
sábado 10 5
Domigo 12 4

A seguir está um programa Java que gera um gráfico de área, descrevendo os dados acima usando JavaFX.

Salve este código em um arquivo com o nome AreaChartExample.java.

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.chart.AreaChart; 
import javafx.scene.chart.CategoryAxis; 
import javafx.stage.Stage; 
import javafx.scene.chart.NumberAxis; 
import javafx.scene.chart.XYChart; 
         
public class AreaChartExample extends Application { 
   @Override 
   public void start(Stage stage) {     
      //Defining the X axis               
      CategoryAxis xAxis = new CategoryAxis();  
           
      //defining the y Axis 
      NumberAxis yAxis = new NumberAxis(0, 15, 2.5); 
      yAxis.setLabel("Fruit units");  
      
      //Creating the Area chart 
      AreaChart<String, Number> areaChart = new AreaChart(xAxis, yAxis);
      areaChart.setTitle("Average fruit consumption during one week");        
         
      //Prepare XYChart.Series objects by setting data  
      XYChart.Series series1 = new XYChart.Series();  
      series1.setName("John"); 
      series1.getData().add(new XYChart.Data("Monday", 3)); 
      series1.getData().add(new XYChart.Data("Tuesday", 4)); 
      series1.getData().add(new XYChart.Data("Wednesday", 3)); 
      series1.getData().add(new XYChart.Data("Thursday", 5)); 
      series1.getData().add(new XYChart.Data("Friday", 4));
      series1.getData().add(new XYChart.Data("Saturday", 10));  
      series1.getData().add(new XYChart.Data("Sunday", 12)); 
                         
      XYChart.Series series2 = new XYChart.Series(); 
      series2.setName("Jane"); 
      series2.getData().add(new XYChart.Data("Monday", 1)); 
      series2.getData().add(new XYChart.Data("Tuesday", 3)); 
      series2.getData().add(new XYChart.Data("Wednesday", 4)); 
      series2.getData().add(new XYChart.Data("Thursday", 3)); 
      series2.getData().add(new XYChart.Data("Friday", 3)); 
      series2.getData().add(new XYChart.Data("Saturday", 5)); 
      series2.getData().add(new XYChart.Data("Sunday", 4));       
                
      //Setting the XYChart.Series objects to area chart        
      areaChart.getData().addAll(series1,series2); 
         
      //Creating a Group object  
      Group root = new Group(areaChart); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 400);  
      
      //Setting title to the Stage 
      stage.setTitle("Area Chart"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show();         
   } 
   public static void main(String args[]){ 
      launch(args)
   }
}

Compile e execute o arquivo java salvo no prompt de comando usando os comandos a seguir.

javac AreaChartExample.java 
java AreaChartExample

Ao ser executado, o programa acima gera uma janela JavaFX exibindo um gráfico de área conforme mostrado abaixo.