CODEWITHSUNDEEP
phpjavascriptgoogle-maps
Jinbom Heo
Jinbom Heo

Reputation: 7400

google map gpx loading, how to?

There are lots of gpx data out there. using google map, Kml data loading and displaying is easy. the code is:

var ctaLayer = new google.maps.KmlLayer('http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml');
        ctaLayer.setMap(this.mMap);

but, I want to make a gpx data display on the google map. I know I can use babel, the converter, it's a software not library.

I have no idea what's the best way to display gpx data on google map. making converter using php(duplicated file), or making loader using javascript... --;

my current programming language is php for server.

any good idea or comment please~~~

Upvotes: 2

Views: 6287

Answers (3)

Paul Spencer
Paul Spencer

Reputation: 1385

I have two suggestions, both require some work on your side. OpenLayers is a javascript mapping API that includes a GPX reader, you could possibly use OpenLayers (with Google as a base map) or just use the GPX format reader. Alternately, you could use the OGR library command line utility ogr2ogr to convert from GPX to KML, possibly setting up a web service to do so. It would be easy to wrap the command line call in a PHP script that could retrieve a GPX file by URL and convert it into KML and return the resulting KML.

Upvotes: 2

Pedro
Pedro

Reputation: 1344

You can feed GPX files to the KmlLayer constructor you have on your question. The code below worked for me:

function initialize() {

    var latlng = new google.maps.LatLng(40.73, -111.93);
    var myOptions = {
        zoom: 10,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var ctaLayer = new google.maps.KmlLayer('http://siteyoucontrol.com/lake-gpx.xml');

    ctaLayer.setMap(map);
}

Upvotes: 3

ChrisJ
ChrisJ

Reputation: 5251

I propose a very simple way to do this: perform an AJAX request to load the GPX file from Javascript, then parse it (very staightforward using jQuery) and create a polyline to display on the Google map.

More details and live example here: Display GPX tracks using Google Maps API (works with Google Maps API v3).

Upvotes: 0

Related Questions