From 46f0c154716d49cf6e12ed306f85fb9e9a9e419f Mon Sep 17 00:00:00 2001 From: Oliver Jowett Date: Thu, 15 Sep 2016 01:29:57 +0100 Subject: [PATCH] Test page for markers. --- public_html/test/markers_test.html | 18 +++++++ public_html/test/markers_test.js | 75 ++++++++++++++++++++++++++++++ 2 files changed, 93 insertions(+) create mode 100644 public_html/test/markers_test.html create mode 100644 public_html/test/markers_test.js diff --git a/public_html/test/markers_test.html b/public_html/test/markers_test.html new file mode 100644 index 0000000..f89ad9b --- /dev/null +++ b/public_html/test/markers_test.html @@ -0,0 +1,18 @@ + + + + + + + + + + + DUMP1090 MARKERS TEST + + + +
+ + + diff --git a/public_html/test/markers_test.js b/public_html/test/markers_test.js new file mode 100644 index 0000000..c8e7bcf --- /dev/null +++ b/public_html/test/markers_test.js @@ -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; + } +}