点击折线的哪个部分?

时间:2012-04-04 19:32:42

标签: javascript google-maps google-maps-api-3 map-projections

我设置了sample polyline with five segments,我允许在用户点击折线时创建新标记。

我想知道是否有一种万无一失的方法来确定新标记是在标记0和1之间,还是1和2之间......还是在4到5之间。我考虑过检查新标记是否是在一个边界框内,和一个直线公式,但都不是100%精确。

1 个答案:

答案 0 :(得分:5)

由于Google地图使用Mercator Projection来投射GPS坐标,因此您无法对gps坐标使用“线方程”,因为投影对于gps点而言不是线性的。但您可以使用world coordinates是线性的。在这里,我使用了参数形式的线方程来检查段上是否point

function isPointOnSegment( map, gpsPoint1, gpsPoint2, gpsPoint ){
     var p1 = map.getProjection().fromLatLngToPoint( gpsPoint1 );
     var p2 = map.getProjection().fromLatLngToPoint( gpsPoint2 );
     var p = map.getProjection().fromLatLngToPoint( gpsPoint );
     var t_x;
     var t_y;
     //Parametric form of line equation is:
     //--------------------------------
     //      x = x1 + t(x2-x1)
     //      y = y1 + t(y2-y1) 
     //--------------------------------
     //'p' is on [p1,p2] segment,if 't' is number from [0,1]
     //-----Case 1----
     //      x = x1
     //      y = y1
     //---------------
     if( p2.x-p1.x == 0 && p2.y-p1.y == 0){
        return p.x == p1.x && p.y == p1.y;
     }else 
     //-----Case 2----
     //      x = x1
     //      y = y1 + t(y2-y1)
     //---------------
     if( p2.x-p1.x == 0 && p2.y-p1.y != 0){
        t_y = (p.y - p1.y)/(p2.y-p1.y);
        return p.x == p1.x && t_y >= 0 && t_y <= 1;
     }else
     //-----Case 3----
     //      x = x1 + t(x2-x1)
     //      y = y1 
     //---------------
     if( p2.x-p1.x != 0 && p2.y-p1.y == 0){
        t_x = (p.x - p1.x)/(p2.x-p1.x);
        return p.y == p1.y && t_x >= 0 && t_x <= 1;
     }
     //-----Case 4----
     //      x = x1 + t(x2-x1)
     //      y = y1 + t(y2-y1) 
     //---------------
     t_x = (p.x - p1.x)/(p2.x-p1.x);
     t_y = (p.y - p1.y)/(p2.y-p1.y);
     return ( t_x == t_y && t_x >= 0 && t_x <= 1 && t_y >= 0 && t_y <= 1);
} 

通过点击点和折线的所有线段,您可以使用上面实现的函数并检索您正在寻找的线段。