[OpenLayers-Users] Dynamic display line follow line route

shane_china xiaying4415139 at 163.com
Tue Jul 21 14:38:02 EDT 2009


I spend hours to finish the simplest implement. The following is the code,
here I used another person's lib to calculate the distance and point on
earth, see method "getPointOnLineByDistance" and the attached file
"Point.js". Now it just support LineString, I'll add more functionalities,
"start stop suspend" for example, and some event listeners in the furture.
Hope your suggestions.

====================================================================

function Point (x, y) {
    this.x = parseFloat(x);
    this.y = parseFloat(y);
}

Point.prototype = new OpenLayers.Geometry.Point(0,0);

Point.prototype.isValid = function() {
    if((this.x != null) && (this.y != null) && (this.x != NaN) && (this.y !=
NaN))
        return( true );
    else
        return( false );
}

Point.prototype.geoIsValid = function() {
    if( this.isValid() && (this.x >= -180) && (this.x <= 180) && (this.y >=
-90) && (this.y <= 90)) 
        return( true );
    else
        return( false );
}

/**
 *    Geo Constants
 */
// Point.EARTH_RADIUS = 3958.75;    // in miles
Point.EARTH_RADIUS = 6370.856; // in km
Point.DEG2RAD =  0.01745329252;  // factor to convert degrees to radians
(PI/180)
Point.RAD2DEG = 57.29577951308;

/**
 *    Method: geoDistanceTo
 *
 *    Parameters:
 *    point - {<Point>}
 *
 *    Returns:
 *    Great Circle distance (in miles) to Point. 
 *    Coordinates must be in decimal degrees.
 *    
 *    Reference:
 *    Williams, Ed, 2000, "Aviation Formulary V1.43" web page
 *    http://williams.best.vwh.net/avform.htm
 */
Point.prototype.geoDistanceTo = function( point ) {
var x = [];
var y = [];

    if( this.geoIsValid() && point.geoIsValid()) {
        x[0] = this.x * Point.DEG2RAD;    y[0] = this.y * Point.DEG2RAD;
        x[1] = point.x * Point.DEG2RAD;    y[1] = point.y * Point.DEG2RAD;
        
        var a = Math.pow( Math.sin(( y[1]-y[0] ) / 2.0 ), 2);
        var b = Math.pow( Math.sin(( x[1]-x[0] ) / 2.0 ), 2);
        var c = Math.pow(( a + Math.cos( y[1] ) * Math.cos( y[0] ) * b ),
0.5);
    
        return ( 2 * Math.asin( c ) * Point.EARTH_RADIUS );
    } else
        return null;
}


Point.prototype.geoBearingTo = function( point ) {
var x = new Array(2);
var y = new Array(2);
var bearing;
var adjust;

    if( this.geoIsValid() && point.geoIsValid()) {
        x[0] = this.x * Point.DEG2RAD;    y[0] = this.y * Point.DEG2RAD;
        x[1] = point.x * Point.DEG2RAD;    y[1] = point.y * Point.DEG2RAD;

         var a = Math.cos(y[1]) * Math.sin(x[1] - x[0]);
        var b = Math.cos(y[0]) * Math.sin(y[1]) - Math.sin(y[0]) 
            * Math.cos(y[1]) * Math.cos(x[1] - x[0]);
        
        if((a == 0) && (b == 0)) {
            bearing = 0;
            return bearing;
        }
        
        if( b == 0) {
            if( a < 0)  
                bearing = 270;
            else
                bearing = 90;
            return bearing;
        }
         
        if( b < 0) 
            adjust = Math.PI;
        else {
            if( a < 0) 
                adjust = 2 * Math.PI;
            else
                adjust = 0;
        }
        bearing = (Math.atan(a/b) + adjust) * Point.RAD2DEG;
        return bearing;
    } else
        return null;
}


/**
 *
 */
Point.prototype.geoWaypoint = function( distance, bearing ) {
var wp = new Point( 0, 0 );

    // Math.* trig functions require angles to be in radians
    var x = this.x * Point.DEG2RAD;
    var y = this.y * Point.DEG2RAD;
    var radBearing = bearing * Point.DEG2RAD;

    // Convert arc distance to radians
    var c = distance / Point.EARTH_RADIUS;

    wp.y = Math.asin( Math.sin(y) * Math.cos(c) + Math.cos(y) * Math.sin(c)
* Math.cos(radBearing)) * Point.RAD2DEG;

    var a = Math.sin(c) * Math.sin(radBearing);
    var b = Math.cos(y) * Math.cos(c) - Math.sin(y) * Math.sin(c) *
Math.cos(radBearing)

    if( b == 0 ) 
        wp.x = this.x;
    else
        wp.x = this.x + Math.atan(a/b) * Point.RAD2DEG;

    return wp;
}

====================================================================



Julien-Samuel Lacroix wrote:
> 
> Hi,
> 
> I don't recall to have seen any example of this before. You can probably 
> start looking here [1] for vector construction and here [2] for 
> JavaScript timing event. Start really simple with only 2 points and then 
> try to include your multiline. If you have it working at some point let 
> us know. I would be curious to see it working.
> 
> [1] http://openlayers.org/dev/examples/vector-features.html
> 
> [2] http://www.w3schools.com/js/js_timing.asp
> 
> Julien
> 
> 
> shane_china wrote:
>> Is there anyone can help me? thank you.
> 
> -- 
> Julien-Samuel Lacroix
> Mapgears
> http://www.mapgears.com/
> _______________________________________________
> Users mailing list
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
> 
> 

-- 
View this message in context: http://n2.nabble.com/Dynamic-display-line-follow-line-route-tp3279524p3295288.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.



More information about the Users mailing list