JavaFX - 차트 컨트롤

차트 컨트롤

 

차트 컨트롤들은 javafx.scene.chart 패키지에 포함되어 있고, 

 

다양항 차트를 생성하는 컨트롤을 제공함. 

 

종류 : PieChart, LineChart, AreaChart, BarChart, BubbleChart, ScatterChart

 

PieChart : <PieChart/> 끝! X축과 Y축이 없으므로 정의할 필요 X 

 

LineChart,AreaChart,BarChart 는 X축과 Y축의 정의가 필요!

 

ex) BarChart

 

X축이 위 아래 있고, Y축이 좌우에 있다 => 눈금을 나타낼 위치를 지정해야함.

<BarChart>

   <xAxis>

      <CategoryAxis side="BOTTOM"/> // 분류 눈금을 아래 축에 나타냄.

   </xAxis>

   <yAxis>

      <NumberAxis side="LEFT" /> // 숫자 눈금을 왼쪽 축에 나타냄.

   </yAxis>

</BarChart>

컨트롤러는 DB나 네트워크에서 차트의 데이터를 전달받아 차트컨트롤에 추가함.

ex)

pieChart.setData(FXCollections.observableArrayList(

    new PieChart.Data("봄", 20),

    new PieChart.Data("여름", 32),

    new PieChart.Data("가을", 24),

    new PieChart.Data("겨울", -7)

));

 

X축과 Y축이 필요한 차트에서 데이터 추가 방법. (LineChart,AreaChart,BarChart모두 동일)

XYChart.Series s1 = new XYChart.Series();

s1.setName("시리즈이름");

s1.setData(FXCollections.observableArrayList(

    new XYChart.Data("네이버", 1),

    new XYChart.Data("블로그", 2),

    new XYChart.Data("부르곰", 3)

));

barChart.getData().add(s1); // 차트에 시리즈 추가

XYChart.Series : 하나의 그래프를 의미.

 

XYChart.Series를 그래프 갯수에 맞게 생성하면 여러 개의 그래프가 겹쳐보인다.

 

예제

<?xml version="1.0" encoding="UTF-8"?>



<?import javafx.scene.chart.*?>

<?import java.lang.*?>

<?import javafx.geometry.*?>

<?import javafx.scene.layout.*?>

<?import javafx.scene.control.*?>



<HBox xmlns:fx="http://javafx.com/fxml" fx:controller="thisisjava.RootController"

prefHeight="250" prefWidth="850" >

   <children>

      <PieChart fx:id="pieChart" />

      <BarChart fx:id="barChart">

        <xAxis>

          <CategoryAxis side="BOTTOM" />

        </xAxis>

        <yAxis>

          <NumberAxis side="LEFT" />

        </yAxis>

      </BarChart>

      <AreaChart fx:id="areaChart">

        <xAxis>

          <CategoryAxis side="TOP" />

        </xAxis>

        <yAxis>

          <NumberAxis side="RIGHT" />

        </yAxis>

      </AreaChart>

   </children>

</HBox>




자바1)

package thisisjava;



import java.net.URL;

import java.util.ResourceBundle;



import javafx.collections.FXCollections;

import javafx.fxml.FXML;

import javafx.fxml.Initializable;

import javafx.scene.chart.AreaChart;

import javafx.scene.chart.BarChart;

import javafx.scene.chart.PieChart;

import javafx.scene.chart.XYChart;



public class RootController implements Initializable {

@FXML private PieChart pieChart;

@FXML private BarChart barChart;

@FXML private AreaChart areaChart;


@Override

public void initialize(URL location, ResourceBundle resources) {

pieChart.setData(FXCollections.observableArrayList(

new PieChart.Data("10대", 12),

new PieChart.Data("20대", 18),

new PieChart.Data("30대", 20),

new PieChart.Data("40대이상", 50)

));


XYChart.Series series1 = new XYChart.Series();

series1.setName("남자");       

series1.setData(FXCollections.observableArrayList(

new XYChart.Data("2015", 70),

new XYChart.Data("2016", 40),

new XYChart.Data("2017", 50),

new XYChart.Data("2018", 30)

));  

XYChart.Series series2 = new XYChart.Series();

series2.setName("여자");       

series2.setData(FXCollections.observableArrayList(

new XYChart.Data("2015", 30),

new XYChart.Data("2016", 60),

new XYChart.Data("2017", 50),

new XYChart.Data("2018", 60)

));

barChart.getData().add(series1);

barChart.getData().add(series2);


XYChart.Series series3 = new XYChart.Series();

series3.setName("평균온도");       

series3.setData(FXCollections.observableArrayList(

new XYChart.Data("봄", 20),

new XYChart.Data("여름", 32),

new XYChart.Data("가을", 24),

new XYChart.Data("겨울", -7)

));

areaChart.getData().add(series3);

}

}

















자바2)

package thisisjava;



import javafx.application.Application;

import javafx.fxml.FXMLLoader;

import javafx.scene.Parent;

import javafx.scene.Scene;

import javafx.stage.Stage;



public class AppMain extends Application {

@Override

public void start(Stage primaryStage) throws Exception {

Parent root = (Parent)FXMLLoader.load(getClass().getResource("root.fxml"));

Scene scene = new Scene(root);


primaryStage.setTitle("ChartControl");

primaryStage.setScene(scene);

primaryStage.show();

}


public static void main(String[] args) {

launch(args);

}

}