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

Putting the script tag at the end of the body (for demonstration purposes).

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@10725 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
Tim Schaub
2010-09-10 13:14:06 +00:00
parent d879ca8d00
commit 3aeab46132
2 changed files with 50 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
examples/filter-strategy.html
View File

@@ -7,7 +7,6 @@
<link rel="stylesheet" href="style.css" type="text/css"> <link rel="stylesheet" href="style.css" type="text/css">
<script src="../lib/OpenLayers.js"></script> <script src="../lib/OpenLayers.js"></script>
<script>OpenLayers.ImgPath = "../img/";</script> <script>OpenLayers.ImgPath = "../img/";</script>
<script src="filter-strategy.js"></script>
<style> <style>
.olControlAttribution { .olControlAttribution {
font-size: 9px; font-size: 9px;
@@ -15,7 +14,7 @@
} }
</style> </style>
</head> </head>
<body onload="init()"> <body>
<h1 id="title">Filter Strategy</h1> <h1 id="title">Filter Strategy</h1>
<p id="shortdesc"> <p id="shortdesc">
Demonstrates the filter strategy for limiting features passed to the layer. Demonstrates the filter strategy for limiting features passed to the layer.
@@ -44,5 +43,6 @@
source to see how this is done source to see how this is done
</p> </p>
</div> </div>
<script src="filter-strategy.js"></script>
</body> </body>
</html> </html>

101
examples/filter-strategy.js
View File

@@ -1,62 +1,11 @@
var map, filter, filterStrategy; var map, filter, filterStrategy;
var animationTimer;
var currentDate;
var startDate = new Date(1272736800000); // lower bound of when values var startDate = new Date(1272736800000); // lower bound of when values
var endDate = new Date(1272737100000); // upper value of when values var endDate = new Date(1272737100000); // upper value of when values
var step = 8; // sencods to advance each interval var step = 8; // sencods to advance each interval
var interval = 0.125; // seconds between each step in the animation var interval = 0.125; // seconds between each step in the animation
function init() {
// add behavior to elements
document.getElementById("start").onclick = startAnimation;
document.getElementById("stop").onclick = stopAnimation;
var spanEl = document.getElementById("span");
var mercator = new OpenLayers.Projection("EPSG:900913");
var geographic = new OpenLayers.Projection("EPSG:4326");
map = new OpenLayers.Map("map");
var osm = new OpenLayers.Layer.OSM();
filter = new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.Comparison.BETWEEN,
property: "when",
lowerBoundary: startDate,
upperBoundary: new Date(startDate.getTime() + (parseInt(spanEl.value, 10) * 1000))
});
filterStrategy = new OpenLayers.Strategy.Filter({filter: filter});
var flights = new OpenLayers.Layer.Vector("Aircraft Locations", {
projection: geographic,
strategies: [new OpenLayers.Strategy.Fixed(), filterStrategy],
protocol: new OpenLayers.Protocol.HTTP({
url: "kml-track.kml",
format: new OpenLayers.Format.KML({
extractTracks: true
//,extractStyles: true // use style from KML instead of styleMap below
})
}),
styleMap: new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
graphicName: "circle",
pointRadius: 3,
fillOpacity: 0.25,
fillColor: "#ffcc66",
strokeColor: "#ff9933",
strokeWidth: 1
})
}),
renderers: ["Canvas", "SVG", "VML"]
});
map.addLayers([osm, flights]);
map.setCenter(new OpenLayers.LonLat(-93.2735, 44.8349).transform(geographic, mercator), 8);
};
var animationTimer;
var currentDate;
function startAnimation() { function startAnimation() {
if (animationTimer) { if (animationTimer) {
stopAnimation(true); stopAnimation(true);
@@ -87,3 +36,49 @@ function stopAnimation(reset) {
} }
} }
// add behavior to elements
document.getElementById("start").onclick = startAnimation;
document.getElementById("stop").onclick = stopAnimation;
var spanEl = document.getElementById("span");
var mercator = new OpenLayers.Projection("EPSG:900913");
var geographic = new OpenLayers.Projection("EPSG:4326");
map = new OpenLayers.Map("map");
var osm = new OpenLayers.Layer.OSM();
filter = new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.Comparison.BETWEEN,
property: "when",
lowerBoundary: startDate,
upperBoundary: new Date(startDate.getTime() + (parseInt(spanEl.value, 10) * 1000))
});
filterStrategy = new OpenLayers.Strategy.Filter({filter: filter});
var flights = new OpenLayers.Layer.Vector("Aircraft Locations", {
projection: geographic,
strategies: [new OpenLayers.Strategy.Fixed(), filterStrategy],
protocol: new OpenLayers.Protocol.HTTP({
url: "kml-track.kml",
format: new OpenLayers.Format.KML({
extractTracks: true
//,extractStyles: true // use style from KML instead of styleMap below
})
}),
styleMap: new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
graphicName: "circle",
pointRadius: 3,
fillOpacity: 0.25,
fillColor: "#ffcc66",
strokeColor: "#ff9933",
strokeWidth: 1
})
}),
renderers: ["Canvas", "SVG", "VML"]
});
map.addLayers([osm, flights]);
map.setCenter(new OpenLayers.LonLat(-93.2735, 44.8349).transform(geographic, mercator), 8);