ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Making Layer.PointTrack play nicely with gx:Track from Format.KML. Thanks bartvde for the updated patch. r=fredj,bartvde (closes #2792)

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@11722 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
ahocevar
2011-03-22 13:46:33 +00:00
parent 2d29236fb0
commit 8f584f2b84
2 changed files with 89 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
examples/kml-pointtrack.html Normal file
View File

@@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>OpenLayers KML Track in a PointTrack Layer Example</title>
<link rel="stylesheet" href="../theme/default/style.css" type="text/css">
<link rel="stylesheet" href="../theme/default/google.css" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
<style>
.olControlAttribution {
bottom: 2px;
}
</style>
<script src="../lib/OpenLayers.js"></script>
<script src="kml-pointtrack.js"></script>
</head>
<body onload="init()">
<h1 id="title">Parsing gx:Track in KML</h1>
<p id="shortdesc">
Demonstrates populating a PointTrack layer with gx:Track elements from KML.
</p>
<div id="map" class="smallmap"></div>
<div id="docs">
<p>
If a KML document contains <code>&lt;gx:Track&gt;</code>
elements and the extractTracks property is set true on the
parser, features will be created that represent track points.
These track points can easily be visualized as track lines with
a <code>PointTrack</code> layer, preserving the KML's original
styles.
</p>
<p>
View the <a href="kml-pointtrack.js" target="_blank">kml-pointtrack.js</a>
source to see how this is done.
</div>
</body>
</html>

51
examples/kml-pointtrack.js Normal file
View File

@@ -0,0 +1,51 @@
var map;
function init() {
var mercator = new OpenLayers.Projection("EPSG:900913");
var geographic = new OpenLayers.Projection("EPSG:4326");
map = new OpenLayers.Map({
div: "map",
projection: mercator,
layers: [
new OpenLayers.Layer.OSM(),
new OpenLayers.Layer.PointTrack("Aircraft Tracks", {
projection: geographic,
strategies: [new OpenLayers.Strategy.Fixed()],
protocol: new OpenLayers.Protocol.HTTP({
url: "kml-track.kml",
format: new OpenLayers.Format.KML({
extractTracks: true,
extractStyles: true
})
}),
dataFrom: OpenLayers.Layer.PointTrack.TARGET_NODE,
styleFrom: OpenLayers.Layer.PointTrack.TARGET_NODE,
eventListeners: {
"beforefeaturesadded": function(e) {
// group the tracks by fid and create one track for
// every fid
var fid, points = [], feature;
for (var i=0, len=e.features.length; i<len; i++) {
feature = e.features[i];
if (feature.fid !== fid || i === len-1) {
fid = feature.fid;
this.addNodes(points, {silent: true});
points = [];
}
points.push(feature);
}
return false;
}
}
})
],
center: new OpenLayers.LonLat(-93.2735, 44.8349).transform(geographic, mercator),
zoom: 8
});
map.addControl(new OpenLayers.Control.LayerSwitcher());
};