JavaFX - Gráfico de área
Los gráficos de área se utilizan para dibujar gráficos basados en áreas. Traza el área entre la serie de puntos dada y el eje. En general, esta tabla se usa para comparar dos cantidades.
A continuación se muestra un gráfico de área que muestra la cantidad de frutas consumidas por dos personas en una semana.
En JavaFX, un gráfico de área está representado por una clase llamada AreaChart. Esta clase pertenece al paquetejavafx.scene.chart. Al crear una instancia de esta clase, puede crear un nodo AreaChart en JavaFX.
Pasos para generar un gráfico de áreas
Para generar un gráfico de áreas en JavaFX, siga los pasos que se indican a continuación.
Paso 1: crear una clase
Cree una clase Java y herede la Application clase del paquete javafx.application e implementar el start() método de esta clase de la siguiente manera.
public class ClassName extends Application {
@Override
public void start(Stage primaryStage) throws Exception {
}
}
Paso 2: Definición del eje
Defina los ejes X e Y del gráfico de áreas y establezca etiquetas para ellos. En nuestro ejemplo, el eje X representa los días de una semana y el eje Y representa las 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");
Paso 3: creación del gráfico de áreas
Cree un gráfico de líneas creando una instancia de la clase llamada AreaChart del paquete javafx.scene.chart. Al constructor de esta clase, pase los objetos que representan los ejes X e Y creados en el paso anterior.
//Creating the Area chart
AreaChart<String, Number> areaChart = new AreaChart(xAxis, yAxis);
areaChart.setTitle("Average fruit consumption during one week");
Paso 4: preparar los datos
Instancia del XYChart.Seriesclase. Luego agregue los datos (una serie de coordenadas xey) a la lista Observable de esta clase de la siguiente manera:
//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));
Paso 5: agregue datos al gráfico de área
Agregue la serie de datos preparada en el paso anterior al gráfico de áreas de la siguiente manera:
//Setting the XYChart.Series objects to area chart
areaChart.getData().addAll(series1,series2);
Paso 6: creación de un objeto de grupo
En el start() método, cree un objeto de grupo instanciando la clase llamada Group, que pertenece al paquete javafx.scene.
Pase el objeto AreaChart (nodo), creado en el paso anterior, como parámetro al constructor de la clase Group. Esto debe hacerse para agregarlo al grupo de la siguiente manera:
Group root = new Group(areaChart);
Paso 7: creación de un objeto de escena
Cree una escena creando una instancia de la clase llamada Scene, que pertenece al paquete javafx.scene. A esta clase, pase el objeto Grupo (root) creado en el paso anterior.
Además del objeto raíz, también puede pasar dos parámetros dobles que representan la altura y el ancho de la pantalla, junto con el objeto de la clase Group de la siguiente manera.
Scene scene = new Scene(group ,600, 300);
Paso 8: Establecer el título del escenario
Puede establecer el título del escenario utilizando el setTitle() método del Stageclase. losprimaryStage es un objeto Stage, que se pasa al método de inicio de la clase de escena como parámetro.
Utilizando el primaryStage objeto, establezca el título de la escena como Sample Application como sigue.
primaryStage.setTitle("Sample Application");
Paso 9: Agregar escena al escenario
Puede agregar un objeto de escena al escenario usando el método setScene() de la clase nombrada Stage. Agregue el objeto Scene preparado en los pasos anteriores utilizando el siguiente método.
primaryStage.setScene(scene);
Paso 10: Visualización del contenido del escenario
Muestre el contenido de la escena usando el método llamado show() del Stage clase de la siguiente manera.
primaryStage.show();
Paso 11: Lanzamiento de la aplicación
Inicie la aplicación JavaFX llamando al método estático launch() del Application class del método principal de la siguiente manera.
public static void main(String args[]){
launch(args);
}
Ejemplo
La siguiente tabla muestra la cantidad de frutas consumidas por John y Jane en una semana.
Día de la semana | Frutas consumidas por John | Frutas consumidas por Jane |
---|---|---|
lunes | 3 | 1 |
martes | 4 | 3 |
miércoles | 3 | 4 |
jueves | 5 | 3 |
viernes | 4 | 3 |
sábado | 10 | 5 |
domingo | 12 | 4 |
A continuación se muestra un programa de Java que genera un gráfico de áreas, que muestra los datos anteriores utilizando JavaFX.
Guarde este código en un archivo con el nombre 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 y ejecute el archivo java guardado desde el símbolo del sistema utilizando los siguientes comandos.
javac AreaChartExample.java
java AreaChartExample
Al ejecutarse, el programa anterior genera una ventana JavaFX que muestra un gráfico de áreas como se muestra a continuación.