From d9ba4e387c568a9035b3a1869620bdcbed1a1d61 Mon Sep 17 00:00:00 2001 From: Bart van den Eijnden Date: Mon, 2 Dec 2013 09:46:11 +0100 Subject: [PATCH 1/2] add an example to display GPX tracks --- examples/data/gpx/gpx4j.xml | 37 +++++++++++++++++++++++++++ examples/gpx-trkpt.html | 50 +++++++++++++++++++++++++++++++++++++ examples/gpx-trkpt.js | 37 +++++++++++++++++++++++++++ 3 files changed, 124 insertions(+) create mode 100644 examples/data/gpx/gpx4j.xml create mode 100644 examples/gpx-trkpt.html create mode 100644 examples/gpx-trkpt.js diff --git a/examples/data/gpx/gpx4j.xml b/examples/data/gpx/gpx4j.xml new file mode 100644 index 0000000000..7c58942267 --- /dev/null +++ b/examples/data/gpx/gpx4j.xml @@ -0,0 +1,37 @@ + + + + 290311 + (null) + + + 126.951324 + + + + 122.974365 + + + + 122.974365 + + + + 120.310211 + + + + 117.177261 + + + + 116.083771 + + + + 115.956726 + + + + + diff --git a/examples/gpx-trkpt.html b/examples/gpx-trkpt.html new file mode 100644 index 0000000000..84d45a6a77 --- /dev/null +++ b/examples/gpx-trkpt.html @@ -0,0 +1,50 @@ + + + + + + + + + + + GPX tracks example + + + +
+
+
+ OpenLayers 3 Examples +
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+

GPX tracks example

+

Example of using the GPX parser to display tracks.

+
+

See the gpx-trkpt.js source to see how this is done.

+
+
GPX trackpoint tracks
+
+
+ +
+ + + + + + + diff --git a/examples/gpx-trkpt.js b/examples/gpx-trkpt.js new file mode 100644 index 0000000000..0e7e9e97e0 --- /dev/null +++ b/examples/gpx-trkpt.js @@ -0,0 +1,37 @@ +goog.require('ol.Map'); +goog.require('ol.RendererHint'); +goog.require('ol.View2D'); +goog.require('ol.layer.Tile'); +goog.require('ol.layer.Vector'); +goog.require('ol.parser.GPX'); +goog.require('ol.source.OSM'); +goog.require('ol.source.Vector'); + +var raster = new ol.layer.Tile({ + source: new ol.source.OSM() +}); + +var vector = new ol.layer.Vector({ + source: new ol.source.Vector({ + parser: new ol.parser.GPX(), + url: 'data/gpx/gpx4j.xml' + }), + style: new ol.style.Style({ + symbolizers: [ + new ol.style.Stroke({ + color: 'red', + opacity: 1 + }) + ] + }) +}); + +var map = new ol.Map({ + layers: [raster, vector], + renderer: ol.RendererHint.CANVAS, + target: 'map', + view: new ol.View2D({ + center: ol.proj.transform([-0.425692, 39.114318], 'EPSG:4326', 'EPSG:3857'), + zoom: 19 + }) +}); From 029c7ea7f3b598aa833a9bf3abc2712919878223 Mon Sep 17 00:00:00 2001 From: Bart van den Eijnden Date: Mon, 2 Dec 2013 09:48:59 +0100 Subject: [PATCH 2/2] add missing requires --- examples/gpx-trkpt.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/examples/gpx-trkpt.js b/examples/gpx-trkpt.js index 0e7e9e97e0..b0b330a57f 100644 --- a/examples/gpx-trkpt.js +++ b/examples/gpx-trkpt.js @@ -4,8 +4,11 @@ goog.require('ol.View2D'); goog.require('ol.layer.Tile'); goog.require('ol.layer.Vector'); goog.require('ol.parser.GPX'); +goog.require('ol.proj'); goog.require('ol.source.OSM'); goog.require('ol.source.Vector'); +goog.require('ol.style.Stroke'); +goog.require('ol.style.Style'); var raster = new ol.layer.Tile({ source: new ol.source.OSM()