javascript - 将箭头助手移离对象

Question

这就是我想要实现的目标。

如您所见，两个箭头助手向内移动，而不是远离对象。我怎样才能把它从物体上移开？

这是我的代码

var startx = wall.getStartX();
    var starty = wall.getStartY();
    var endx = wall.getEndX();
    var endy = wall.getEndY();

    // this section sets how far the arrow should move away
    // this is the part where I'm having trouble
    if (wall.getWallOrientation() == 'horizontal') {
        starty += 50;
        endy += 50;
    } else {
        // vertical 
        startx += 50;
        endx += 50;
    }

    // define start and end point of dimension
    var from = new THREE.Vector3(startx, 0, starty);
    var to = new THREE.Vector3(endx, 0, endy);

    var direction = to.clone().sub(from);
    var length = direction.length();

    var hex = 0x0;
    var arrorGroupHelper = new THREE.Group();
    arrorGroupHelper.add(new THREE.ArrowHelper(direction.normalize(), from, length, hex, 10, 10));
    arrorGroupHelper.add(new THREE.ArrowHelper(direction.negate(), to, length, hex, 10, 10));

谢谢你和更多的力量。

标签： javascriptthree.js

Answer 1

得到它的工作。首先我得到线的中心然后计算角度。这样我就知道它应该移到哪里去了。

var degrees = Utils.angleAccurate(center.x, center.y, lineCenterPoint.x, lineCenterPoint.y);

        var radians = degrees * Math.PI / 180;
        var x = startx + Math.cos(radians) * 30;
        var y = starty + Math.sin(radians) * 30;

var orientation = edge.wall.getWallOrientation();
        if (orientation == 'horizontal') {
            starty = y;
            endy = y;
        } else if (orientation == 'vertical') {
            // vertical 
            startx = x;
            endx = x;
        }