Question

如何从偏移向量转换向量。

我有一条线，其中有2个点，在线的起点和终点向量上分别附加一个点。

我想基于DragConstrols位置而不是基于直线位置平移直线和点，我只是根据直线的起始和结束向量更新直线的几何顶点和点的位置。

切记点不是线的子代，所有对象都是场景的子代该行将点存储在该行的userData中。

我的目标是从拖动偏移量Vector3转换所有这3个对象

这是带有这些点的线的屏幕截图。 start_vector = (-140, 60, 0) end_vector = (-70, 100, 0)

在用户拖动行v1 = (-140, 60, 0)之前，我知道行开始矢量知道拖动v2 = (-70, 100, 0)

之前的行结束向量

现在，当用户使用DragConstrols拖动线时，我不让dragControls更改线位置，而是得到了dragConstrol vector3，我想基于该矢量来转换线向量。

DragControls始终从(0, 0, 0)开始，因此我尝试将线向量（v1，v2）与该位置相加，但得到此结果。

有人可以告诉我如何从dragControls位置设置行的开始和结束向量。或如何从偏移向量转换向量。

谢谢。

到目前为止我的代码。

请注意，该行是Line2（胖行）three/examples/jsm/lines/Line2



class NewLine extends Line2 {

  private _start = new Vector3();
  private _end = new Vector3();

  /** The viewport width */
  public viewportWidth: number;

  /** The viewport height */
  public viewportHeight: number;

  /** The line3 */
  public line3 = new Line3();

  public get start() { return this._start; }
  public set start(v: Vector3) {
    this._start = v;
    this.line3.set(v, this._end);
    this.geometry['setPositions']([
      v.x,
      v.y,
      v.z,
      this._end.x,
      this._end.y,
      this._end.z
    ]);
    this.geometry['verticesNeedUpdate'] = true;  // maybe i don't need that
    this.geometry.computeBoundingSphere();
    this.computeLineDistances();
  }

  public get end() { return this._end; }
  public set end(v: Vector3) {
    this._end = v;
    this.line3.set(this._start, v);
    this.geometry['setPositions']([
      this._start.x,
      this._start.y,
      this._start.z,
      v.x,
      v.y,
      v.z,
    ]);
    this.geometry['verticesNeedUpdate'] = true; // maybe i don't need that
    this.geometry.computeBoundingSphere();
    this.computeLineDistances();
  }


  constructor( start: Vector3, end: Vector3 ) {
    super();

    // create geometry
    const geometry = new LineGeometry();
    geometry.setPositions([
      start.x, start.y, start.z,
      end.x, end.y, end.z
    ]);
    this.geometry = geometry;

    // create material
    const material = new LineMaterial({
      color: 0x000000,
      linewidth:5,
      depthTest: false, // new
      vertexColors: false,
    });
    this.material = material;

    this.computeLineDistances();
    this.scale.set( 1, 1, 1 );
    this.line3.set(start, end);

  }

}



/**
 * Translates a line base on DragControls position.
 * line: The NewLine
 * position: The new Vector3 position from dragControls
 */
translateLineFromVector(line: NewLine, position: Vector3) {

  const v1 = line.start;
  const v2 = line.end;

  const offset_start = line.start.clone().add( position ).sub(line.position);
  const offset_end = line.end.clone().add( position ).sub(line.position);

  line.start.copy( offset_start );
  line.end.copy( offset_end );
}

Answer 1

拖动的标准方法：

On mouse down(X,Y):
    If Clicked at object and not Dragging:
         Dragging = True
         X0 = X
         Y0 = Y
         //important - remember object coordinates at this moment!
         V1_0 = V1
         V2_0 = V2

On mouse moving (X,Y) :
   If Dragging: 
       //Draw object at coordinates shifted by (X - X0), (Y - Y0)
       //from initial position, not from the current one
       V1.X = V1_0.X + X - X0
       V1.Y = V1_0.Y + Y - Y0
       same for V2
       DrawObject(V1,V2)


On Mouse Up(X,Y):
   If Dragging: 
       Fragging = False
       Fix positions V1,V2 if needed

如何从偏移向量转换向量

1 个答案: