6

在 JavaFX 2.x 中,我使用的是 XYChart,并且我想在鼠标在图表上移动时显示图表的 (X,Y) 轴坐标值。我在图表上设置了一个事件处理程序来处理 setOnMouseMoved 事件。但是,我不确定如何将 MouseEvent 的 getX() 值转换为图表的坐标值?

4

2 回答 2

16

使用axis.getValueForDisplay(displayPosition)确定鼠标在轴值坐标中的位置:

xAxis.getValueForDisplay(mouseEvent.getX()),
yAxis.getValueForDisplay(mouseEvent.getY())

这是一个示例,它报告了鼠标在折线图中悬停的坐标。屏幕截图不会捕获鼠标光标 - 你只需要在那里想象它;-)

悬停记者

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.*;
import javafx.scene.chart.*;
import javafx.scene.control.Label;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class LineChartWithHoverCoords extends Application {

  @Override public void start(Stage stage) {
    stage.setTitle("Line Chart Sample");

    final LineChart<Number, Number> lineChart = createChart();
    Label cursorCoords = createCursorGraphCoordsMonitorLabel(lineChart);

    stage.setScene(
      new Scene(
        layoutScene(
          lineChart, 
          cursorCoords
        )
      )
    );
    stage.show();
  }

  private VBox layoutScene(LineChart<Number, Number> lineChart, Label cursorCoords) {
    VBox layout = new VBox(10);
    layout.setPadding(new Insets(10));
    layout.setAlignment(Pos.CENTER);
    layout.getChildren().setAll(
      cursorCoords,
      lineChart
    );
    return layout;
  }

  private LineChart<Number, Number> createChart() {
    final NumberAxis xAxis = new NumberAxis();
    final NumberAxis yAxis = new NumberAxis();
    xAxis.setLabel("Number of Month");
    final LineChart<Number,Number> lineChart =
        new LineChart<>(xAxis,yAxis);

    lineChart.setTitle("Stock Monitoring, 2010");
    XYChart.Series<Number, Number> series = new XYChart.Series<>(
      "My portfolio", FXCollections.<XYChart.Data<Number, Number>>observableArrayList(
        new XYChart.Data<Number, Number>(1, 23),
        new XYChart.Data<Number, Number>(2, 14),
        new XYChart.Data<Number, Number>(3, 15),
        new XYChart.Data<Number, Number>(4, 24),
        new XYChart.Data<Number, Number>(5, 34),
        new XYChart.Data<Number, Number>(6, 36),
        new XYChart.Data<Number, Number>(7, 22),
        new XYChart.Data<Number, Number>(8, 45),
        new XYChart.Data<Number, Number>(9, 43),
        new XYChart.Data<Number, Number>(10, 17),
        new XYChart.Data<Number, Number>(11, 29),
        new XYChart.Data<Number, Number>(12, 25)
    )
    );

    lineChart.getData().add(series);
    return lineChart;
  }

  private Label createCursorGraphCoordsMonitorLabel(LineChart<Number, Number> lineChart) {
    final Axis<Number> xAxis = lineChart.getXAxis();
    final Axis<Number> yAxis = lineChart.getYAxis();

    final Label cursorCoords = new Label();

    final Node chartBackground = lineChart.lookup(".chart-plot-background");
    for (Node n: chartBackground.getParent().getChildrenUnmodifiable()) {
      if (n != chartBackground && n != xAxis && n != yAxis) {
        n.setMouseTransparent(true);
      }
    }

    chartBackground.setOnMouseEntered(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setVisible(true);
      }
    });

    chartBackground.setOnMouseMoved(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setText(
          String.format(
            "(%.2f, %.2f)",
            xAxis.getValueForDisplay(mouseEvent.getX()),
            yAxis.getValueForDisplay(mouseEvent.getY())
          )
        );
      }
    });

    chartBackground.setOnMouseExited(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setVisible(false);
      }
    });

    xAxis.setOnMouseEntered(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setVisible(true);
      }
    });

    xAxis.setOnMouseMoved(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setText(
          String.format(
            "x = %.2f",
            xAxis.getValueForDisplay(mouseEvent.getX())
          )
        );
      }
    });

    xAxis.setOnMouseExited(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setVisible(false);
      }
    });

    yAxis.setOnMouseEntered(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setVisible(true);
      }
    });

    yAxis.setOnMouseMoved(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setText(
          String.format(
            "y = %.2f",
            yAxis.getValueForDisplay(mouseEvent.getY())
          )
        );
      }
    });

    yAxis.setOnMouseExited(new EventHandler<MouseEvent>() {
      @Override public void handle(MouseEvent mouseEvent) {
        cursorCoords.setVisible(false);
      }
    });

    return cursorCoords;
  }

  public static void main(String[] args) {
    launch(args);
  }
}
于 2013-05-10T06:18:15.730 回答
2

想写评论,不知道怎么写。这是一个附加评论,因此遇到问题的下一个人不会花费数小时来找出原因。答案是正确的,但是当你使用 ImageCursor 时要小心,它给出了错误的坐标。在停用缩放、滚动和日期以及我的所有自定义之后,我最终发现使用自定义光标会破坏“getValueForDisplay”的坐标。

于 2013-05-14T23:21:36.090 回答