JavaFx缩放和平移覆盖固定比例标签的图像

Question

我是一所大学的医生，我正在开发X射线分析软件，在该软件中，用户通过将小圆圈放置在X射线图像上来定义解剖点。到目前为止我很满意，但我需要实现缩放和平移使用鼠标滚轮，根据鼠标位置。

我简化了我的代码以使其清晰，原来的代码比这复杂得多。

在该算法中，在缩放和平移时，点不应该根据图像移动，因此它们的位置保持不变，并且在缩放时，点附近的标签必须保持相同的字体大小（我们不希望看到巨大的标签）。我在这一点上卡住了。

package main.java;

import javafx.fxml.FXML;
import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseButton;
import javafx.scene.layout.AnchorPane;
import javafx.scene.shape.Circle;    

public class ZoomClass {

    @FXML
    AnchorPane xRayAnchorPane;

    @FXML
    ImageView xRayImage;

    @FXML
    ScrollPane xRayScrollPane;

    @FXML
    Label pointsLabel;    

    public void initialize() {    
        xRayImage.setOnMouseClicked(mouseEvent ->
        {
            if(mouseEvent.getButton().equals(MouseButton.PRIMARY)) // ADD POINTS
            {
                Circle circle = new Circle();
                circle.setCenterX(mouseEvent.getX()+58);   // Some Offset values to proper positioning
                circle.setCenterY(mouseEvent.getY()+75);   // Some Offset values to proper positioning
                circle.setRadius(2);

                xRayAnchorPane.getChildren().add(circle);  // Adding circle to mainFrame

                pointsLabel.setText("A");     // Defining the point's name
                pointsLabel.setLayoutX(circle.getCenterX()+5);  // Some Offset values to proper positioning
                pointsLabel.setLayoutY(circle.getCenterY());  // Some Offset values to proper positioning

            }
        });
    }
}

和我的FXML文件：

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

<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane prefHeight="650.0" prefWidth="851.0" xmlns="http://javafx.com/javafx/16" xmlns:fx="http://javafx.com/fxml/1" fx:controller="main.java.ZoomClass" fx:id="xRayAnchorPane">
   <children>
      <ScrollPane layoutX="56.0" layoutY="71.0" prefHeight="533.0" prefWidth="743.0" fx:id="xRayScrollPane">
         <content>
            <ImageView fitHeight="736.0" fitWidth="739.0" pickOnBounds="true" preserveRatio="true" fx:id="xRayImage">
               <image>
                  <Image url="@ceph2.jpg" />
               </image>
            </ImageView>
         </content>
      </ScrollPane>
      <Label fx:id="pointsLabel" layoutX="14.0" layoutY="138.0" />
   </children>
</AnchorPane>

Answer 1

根据这个问题，您需要为要放大的元素创建一个组元素。创建新圆圈时，应添加到缩放组。最后，对创建的组元素应用缩放