1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
|
<html>
<head>
<title>
Tests for OSM
</title>
<link rel="stylesheet" href="mmd.css" type="text/css" />
</head>
<body>
<div id="osm"></div>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script>
// satellite and user position
var from = new OpenLayers.Projection ("EPSG:4326");
var to = new OpenLayers.Projection ("EPSG:900913");
var sat_position = new OpenLayers.LonLat (45.7209722222, -22.5726666667).transform (from, to);
var user_location = new OpenLayers.LonLat (15.4422, 47.0657).transform (from, to);
// create a map
var map = new OpenLayers.Map ("osm");
map.addLayer (new OpenLayers.Layer.OSM ());
// create a markers
var markersLayer = new OpenLayers.Layer.Markers ("Markers");
var sat = new OpenLayers.Marker (sat_position);
var user = new OpenLayers.Marker (user_location);
user.setOpacity (0.5);
map.addLayer (markersLayer);
markersLayer.addMarker (sat);
markersLayer.addMarker (user);
// points/polygons
var lineLayer = new OpenLayers.Layer.Vector ("Polygons");
map.addLayer (lineLayer);
map.addControl (new OpenLayers.Control.DrawFeature(lineLayer, OpenLayers.Handler.Path));
// create a fake trjaectory
var trajectory = new Array (
new OpenLayers.LonLat (44.7, -21.5).transform (from, to),
new OpenLayers.LonLat (42.7, -19.5).transform (from, to),
new OpenLayers.LonLat (40.7, -17.5).transform (from, to),
new OpenLayers.LonLat (38.7, -15.5).transform (from, to),
new OpenLayers.LonLat (36.7, -13.5).transform (from, to),
new OpenLayers.LonLat (34.7, -11.5).transform (from, to),
new OpenLayers.LonLat (32.7, -9.5).transform (from, to),
new OpenLayers.LonLat (30.7, -7.5).transform (from, to),
new OpenLayers.LonLat (28.7, -5.5).transform (from, to),
new OpenLayers.LonLat (26.7, -3.5).transform (from, to),
new OpenLayers.LonLat (24.7, -1.5).transform (from, to),
new OpenLayers.LonLat (22.7, 1.5).transform (from, to),
new OpenLayers.LonLat (20.7, 3.5).transform (from, to),
new OpenLayers.LonLat (18.7, 5.5).transform (from, to),
new OpenLayers.LonLat (16.7, 7.5).transform (from, to),
new OpenLayers.LonLat (14.7, 9.5).transform (from, to),
new OpenLayers.LonLat (12.7, 11.5).transform (from, to),
new OpenLayers.LonLat (10.7, 13.5).transform (from, to),
new OpenLayers.LonLat (8.7, 15.5).transform (from, to),
new OpenLayers.LonLat (6.7, 17.5).transform (from, to),
new OpenLayers.LonLat (4.7, 19.5).transform (from, to),
new OpenLayers.LonLat (2.7, 21.5).transform (from, to),
new OpenLayers.LonLat (0.7, 23.5).transform (from, to)
);
var points = new Array (new OpenLayers.Geometry.Point (sat_position.lon, sat_position.lat));
for (var i = 0; i < trajectory.length; i++)
points.push (new OpenLayers.Geometry.Point (trajectory[i].lon, trajectory[i].lat));
var polygon = new OpenLayers.Geometry.LineString (points);
var lineStyle = {strokeColor: '#00ff00', strokeOpacity: 1, strokeWidth: 2};
var lineFeature = new OpenLayers.Feature.Vector (polygon, null, lineStyle);
lineLayer.addFeatures ([lineFeature]);
// center the map
map.setCenter (sat_position, 2);
</script>
</body>
</html>
|