요즘은 자바 8 & 자바 FX8을 전문적으로 배우고 있습니다.
JavaFX는 여러 가지 표준 제어가 있지만.
그 사용 방법에 관해서 나는 일본어 정보를 거의 찾지 못했다.
간신히 찾아봤더니 필기를 한다.

Line Chart 설정

일단 라인 차트부터 틀어.
소재는 매달 팀 수를 주제로 한 그래프다.

<LineChart fx:id="testLineChart" layoutX="-11.0" layoutY="21.0" prefHeight="464.0" prefWidth="578.0" title="月別チーム人数">
                    <xAxis>
                      <CategoryAxis label="Month" side="BOTTOM" />
                    </xAxis>
                    <yAxis>
                      <NumberAxis side="LEFT" />
                    </yAxis>
                  </LineChart>

Pane 같은 설정은 생략이에요.
중요한 것은 xAxis와 yAxis인데 각각 가로축과 세로축이다.다음 두 가지를 설정할 수 있습니다.
4

Numberaxis→이름과 같은 수치축(0,10,20...같은 축)

4

CategoryAxis→문자열 축(1월, 2월...등축)

이번 세로축은 인원수이고, 가로축은 달이고 모두 넘버악시스였으면 좋겠다.
재미가 없어 가로축은'x월'로 Category Axis로 바꿨다.

설정 데이터

이렇게 화면을 표시하면 빈 도표가 나오지만 비었을 때도 도표가 아니기 때문에 데이터를 설정합니다.
데이터도 풍부하고 설정도 재미없기 때문에 아래의 쉼표 구분 텍스트 파일 (chartData.txt) 에서 읽습니다.

01月,10
02月,20
03月,5
04月,9
05月,45
06月,21
07月,9
08月,65
09月,0
10月,11
11月,2
12月,8

이번에는 Controller반의 Initialize에서 설정했습니다.
라인 차트의 폴리라인은 XYChart입니다.시리즈 레벨로 표시하기 때문에 제작되었습니다.

public void initialize(URL location, ResourceBundle resources) {
        XYChart.Series<String, Number> series = new XYChart.Series<String, Number>();
        series.setName("人数");     // 凡例の名前

범례는 Excel에서 모두가 익숙한 것이다.
에서 파일에서 데이터를 가져와 설정합니다.
데이터를 추출하는 부분은 주제가 아니기 때문에 forEach와 split로 빠르게 합니다.

        try (Stream<String> chartStream = Files.lines(Paths.get("chartData.txt"), StandardCharsets.UTF_8)) {

            // 各要素をカンマで区切り、XYChartに設定。設定したXYChartをseriesに追加する。
            chartStream.forEach(s -> {
                String[] splitResult = s.split(",");

                Data<String, Number> xyChart
                    = new XYChart.Data<String, Number>(splitResult[0], Integer.parseInt(splitResult[1]));

                series.getData().add(xyChart);
            });

        } catch (IOException e) {
            e.printStackTrace();
        }

        // Data設定されたSeriesをLineChartに追加する。
        testLineChart.getData().add(series);

주제를 이해하기는 어렵지만 중요한 것은 다음과 같은 몇 가지뿐이다.
폴리라인의 데이터 부분은 XYChart로 표시됩니다.

Data<String, Number> xyChart = new XYChart.Data<String, Number>(splitResult[0], Integer.parseInt(splitResult[1]));

series.getData().add(xyChart);
testLineChart.getData().add(series);

Series의 getData()에서 얻은 Observable List에서 XYChart를 설정하면 됩니다.
마지막으로 Line Chart에서도 Series를 설정합니다.
↓ 이런 느낌의 그래프를 만든다.0의 데이터를 초과하면 어떻게든 되겠습니까?
또한 특별히 지정하지는 않았지만 세로축, 가로축의 최대치를 임의로 설정했다.

마우스 위치의 데이터 값 표시

더 많은 기능을 원합니다.
마우스가 제시간에 맞으면 그 위치의 데이터 값을 보여 줍니다.
조사의 느낌, 아래와 같은 단순한 마우스 사건 설정은 안 된다

// LineChartそのものにMouseMoved設定
testLineChart.setOnMouseMoved(ev ->{/* ～～～ */});

Line Chart에는 축의 일부와 범례의 일부도 포함됩니다.
그래프 부분의 마우스 위치는 제대로 떼어낼 수 없을 것 같다.
그래서 아래처럼 룩업으로 도표 배경 부분의 노드를 찾으면 됩니다.

Node chartBackground = testLineChart.lookup(".chart-plot-background");

마우스 위치의 데이터 값은 각 Axis의 getValueFordaplay 방법을 통해 얻을 수 있기 때문에 이벤트는 이러한 느낌입니다.
(dataLabel은 Label일 뿐)

        chartBackground.setOnMouseMoved(ev -> {
            String pointXAxis = testLineChart.getXAxis().getValueForDisplay(ev.getX());
            Number pointYAxis = testLineChart.getYAxis().getValueForDisplay(ev.getY());
            String dataLabelText = String.format("xAxis:%s, yAxis:%.2f", pointXAxis, pointYAxis);

            dataLabel.setText(dataLabelText);
        });

참고로 그래프 부분의 마우스 커서가 화살표라면 보기 싫을 거예요.
크로스 헤어스타일로 바꿔봤어요.

        chartBackground.setCursor(Cursor.CROSSHAIR);

잘 됐다.

setMouseTransparent

실제로 이렇게 되면 접선이나 ○의 일부 데이터 값이 나오지 않는다.마우스 커서도 복원됩니다.
이것도 당연한 것이다. 접선의 부분은.chart-plot-background가 아니기 때문에 이벤트가 적용되지 않습니다.
모든 양식이 응용하기 어려우니 아래의 방법에 따라 주십시오
라인 차트에 있는캐럿-plot-background 이외의 요소도 setMouseTransparent(진짜)로 사용할 수 있는 게 좋을 것 같은데?

chartBackground.getParent().getChildrenUnmodifiable().stream().filter(
        n -> n != chartBackground).forEach(
                n -> n.setMouseTransparent(true));

testLineChart.get Children~ 그런데 괜찮아 보여요.
이 설정을 하면 그 노드의 마우스 이벤트가 무효가 되고 다음 노드의 이벤트가 불립니다.
하여튼 하고 싶은 거 할 수 있어서 만족해요.