JavaFX中如何获取Canvas上绘制的二次曲线路径坐标？

核心思路：用二次贝塞尔参数方程计算路径点 #

二次贝塞尔曲线的位置可以通过参数方程精确计算，无需从Canvas像素中提取。公式如下：
对于起点P0(x0,y0)、控制点P1(x1,y1)、终点P2(x2,y2)，曲线上任意一点的坐标由参数t（取值范围[0,1]）决定：

x(t) = (1-t)²*x0 + 2*(1-t)*t*x1 + t²*x2
y(t) = (1-t)²*y0 + 2*(1-t)*t*y1 + t²*y2

通过遍历t的取值，就能生成曲线上的一系列采样点。

步骤1：实现采样点生成方法 #

写一个工具方法，传入起止点、控制点和采样步数，返回曲线上的坐标列表：

import javafx.geometry.Point2D;
import java.util.ArrayList;
import java.util.List;

public List<Point2D> generateQuadCurvePoints(
        double startX, double startY,
        double controlX, double controlY,
        double endX, double endY,
        int sampleCount) {
    
    List<Point2D> points = new ArrayList<>();
    double step = 1.0 / sampleCount;
    
    for (int i = 0; i <= sampleCount; i++) {
        double t = i * step;
        double oneMinusT = 1 - t;
        
        // 计算当前t对应的坐标
        double x = oneMinusT * oneMinusT * startX 
                + 2 * oneMinusT * t * controlX 
                + t * t * endX;
        double y = oneMinusT * oneMinusT * startY 
                + 2 * oneMinusT * t * controlY 
                + t * t * endY;
        
        points.add(new Point2D(x, y));
    }
    return points;
}

sampleCount越大，生成的点越密集，模拟的曲线越平滑，根据需求调整即可（比如设为20-50）。

步骤2：用采样点创建Circle和Line模拟曲线 #

拿到采样点列表后，遍历创建Circle节点，并用Line连接相邻节点：

import javafx.scene.Node;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Line;
import java.util.List;

public void buildSimulatedCurve(List<Point2D> points) {
    // 假设parent是你要添加节点的容器（比如Pane）
    for (int i = 0; i < points.size(); i++) {
        Point2D p = points.get(i);
        // 创建小Circle标记采样点
        Circle dot = new Circle(p.getX(), p.getY(), 2); // 半径设为2，可调整
        parent.getChildren().add(dot);
        
        // 连接当前点和前一个点
        if (i > 0) {
            Point2D prevP = points.get(i-1);
            Line line = new Line(prevP.getX(), prevP.getY(), p.getX(), p.getY());
            line.setStroke(Constants.DRAG_COLOR);
            line.setStrokeWidth(Constants.LINE_THICKNESS);
            parent.getChildren().add(line);
        }
    }
}

步骤3：结合拖拽更新逻辑 #

当原来的起止点或控制点Circle被拖拽时，需要重新生成采样点，更新模拟曲线的节点：

1. 给拖拽的Circle添加setOnMouseDragged事件监听器
2. 在拖拽事件中，清除之前的模拟节点（Circle和Line）
3. 重新调用generateQuadCurvePoints生成新的点，再调用buildSimulatedCurve重建模拟曲线

示例代码片段：

// 假设startCircle、controlCircle、endCircle是你的起止点和控制点
startCircle.setOnMouseDragged(event -> {
    // 清除旧的模拟节点
    parent.getChildren().removeIf(node -> 
            node instanceof Circle && ((Circle) node).getRadius() == 2 
            || node instanceof Line);
    
    // 重新生成点并构建模拟曲线
    List<Point2D> newPoints = generateQuadCurvePoints(
            startCircle.getCenterX(), startCircle.getCenterY(),
            controlCircle.getCenterX(), controlCircle.getCenterY(),
            endCircle.getCenterX(), endCircle.getCenterY(),
            30);
    buildSimulatedCurve(newPoints);
});

// 给controlCircle和endCircle添加同样的拖拽监听逻辑

注意事项 #

• 如果不需要保留采样点的Circle，也可以直接用Path和LineTo连接采样点，效果类似，但按需求用Circle+Line实现即可。
• 采样步数不要设置过大，否则会生成过多节点，影响性能。

内容的提问来源于stack exchange，提问作者Alexandre Carvalho