折线标签定位算法

时间:2011-12-17 05:33:07

标签: javascript algorithm label line

我正在寻找能够帮助自动在折线上定位标签的算法指针。

在这种特定情况下,折线被定义为一系列[x,y]点。第一点是原点,最后一点是目的地。两点之间的直线总是直的(即不是曲线/弧/贝塞尔曲线)。

目前,我正在选择“中间”线段,并将标签定位在该线段的中间位置。

这可能导致奇数标签放置,除非每个线段的长度大致相同。如果一个线段长得多,那么标签“看起来很奇怪”。

那么......关于我应该在Google上搜索什么的任何想法?

谢谢!

2 个答案:

答案 0 :(得分:1)

受Petar Ivanov的评论启发:

//
// Calculate the distance between two points
//
function distance(a, b) {
    var dx = a.x - b.x;
    var dy = a.y - b.y;
    return Math.sqrt(dx * dx + dy * dy);
}

//
// Given a line between point1 and point2 return a point that 
// is distance away from point1
//
function lineInterpolate(point1, point2, distance) {
    var xabs = Math.abs(point1.x - point2.x);
    var yabs = Math.abs(point1.y - point2.y);
    var xdiff = point2.x - point1.x;
    var ydiff = point2.y - point1.y;

    var length = Math.sqrt((Math.pow(xabs, 2) + Math.pow(yabs, 2)));
    var steps = length / distance;
    var xstep = xdiff / steps;
    var ystep = ydiff / steps;

    return { x: point1.x + xstep, y: point1.y + ystep };
}

//
// Return the point that is the midpoint for the line
//
function lineMidpoint(lineSegments) {
    //
    // Sum up the total distance of the line
    //
    var TotalDistance = 0;
    for (var i = 0; i < lineSegments.length - 1; i += 1) {
        TotalDistance += distance(lineSegments[i], lineSegments[i + 1]);
    }

    //
    // Find the middle segemnt of the line
    //
    var DistanceSoFar = 0;
    for (var i = 0; i < lineSegments.length - 1; i += 1) {
        //
        // If this linesegment puts us past the middle then this
        // is the segment in which the midpoint appears
        //
        if (DistanceSoFar + distance(lineSegments[i], lineSegments[i + 1]) > TotalDistance / 2) {
            //
            // Figure out how far to the midpoint
            //
            var DistanceToMidpoint = TotalDistance / 2 - DistanceSoFar;

            //
            // Given the start/end of a line and a distance return the point
            // on the line the specified distance away
            //
            return lineInterpolate(lineSegments[i], lineSegments[i + 1], DistanceToMidpoint);
        }

        DistanceSoFar += distance(lineSegments[i], lineSegments[i + 1]);
    }

    //
    // Can happen when the line is of zero length... so just return the first segment
    //
    return lineSegments[0];
}

答案 1 :(得分:0)

为什么不把标签放在中间。这是计算线段的总长度,然后取一半,并将标签放在该距离(在路径之后)。