AFG/dump1090
3
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Test page for markers.

Browse source
This commit is contained in:
Oliver Jowett 2016-09-15 01:29:57 +01:00
parent 50a606d23f
commit 46f0c15471
2 changed files with 93 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
public_html/test/markers_test.html Normal file
View file

@ -0,0 +1,18 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="../ol3/ol-3.17.1.css" type="text/css" />
<script src="../ol3/ol-3.17.1.js" type="text/javascript"></script>
<script type="text/javascript" src="../markers.js"></script>
<script type="text/javascript" src="markers_test.js"></script>
<title>DUMP1090 MARKERS TEST</title>
</head>
<body onload="setup_markers_test()">
<div id="map_canvas"></div>
</body>
</html>

75
public_html/test/markers_test.js Normal file
View file

@ -0,0 +1,75 @@
"use strict";
var MarkerLayer;
var NextLon = 0;
var NextLat = 0;
function setup_markers_test() {
MarkerLayer = new ol.layer.Vector({
source: new ol.source.Vector(),
});
var map = new ol.Map({
target: 'map_canvas',
layers: [
MarkerLayer
],
view: new ol.View({
center: ol.proj.fromLonLat([5, 0]),
zoom: 7
}),
controls: [new ol.control.Zoom(),
new ol.control.Rotate()],
loadTilesWhileAnimating: true,
loadTilesWhileInteracting: true
});
for (var type in TypeIcons) {
add_marker(type, TypeIcons[type]);
}
for (var category in CategoryIcons) {
add_marker(category, CategoryIcons[category]);
}
add_marker("Default", DefaultIcon);
map.getView().setCenter(ol.proj.fromLonLat([5, NextLat/2]));
}
function add_marker(title, baseMarker) {
var weight = (1 / baseMarker.scale).toFixed(1);
var icon = new ol.style.Icon({
anchor: baseMarker.anchor,
anchorXUnits: 'pixels',
anchorYUnits: 'pixels',
scale: baseMarker.scale,
imgSize: baseMarker.size,
src: svgPathToURI(baseMarker.path, baseMarker.size, '#000000', weight, '#00C000'),
rotation: 0,
opacity: 1.0,
rotateWithView: (baseMarker.noRotate ? false : true)
});
var markerStyle = new ol.style.Style({
image: icon,
text: new ol.style.Text({
textAlign: 'center',
textBaseline: 'top',
offsetY: 30,
text: title,
scale: 1.5
})
});
var pos = [NextLon, NextLat];
var marker = new ol.Feature(new ol.geom.Point(ol.proj.fromLonLat(pos)));
marker.setStyle(markerStyle);
MarkerLayer.getSource().addFeature(marker);
NextLon += 1;
if (NextLon >= 10) {
NextLon -= 10;
NextLat -= 1;
}
}