source: src/django_gheat/wlheatmap/static/heatmap.js@ 9587

Last change on this file since 9587 was 9587, checked in by rick, 13 years ago

Example usage of adding the actual location of the Node as well.

File size: 4.8 KB
Line 
1/**
2 * Var 'map' is set global, used in 'heatmap_extensions.js'.
3 */
4var map;
5
6function init_heatmap(){
7 var lat = getURLParameter('lat');
8 var lon = getURLParameter('lon');
9 var zoom = getURLParameter('zoom');
10
11 if(lat=='null' || lon=='null' || zoom=='null'){
12 var lat = 52.15514;
13 var lon = 4.48959;
14 var zoom = 13;
15 }
16 var projection_wgs = new OpenLayers.Projection("EPSG:4326"); // WGS 1984
17
18 map = new OpenLayers.Map('heatmap', {
19 theme: null,
20 controls: [
21 new OpenLayers.Control.Navigation(),
22 new OpenLayers.Control.Permalink(),
23 new OpenLayers.Control.PanZoomBar(),
24 new OpenLayers.Control.ZoomBox(),
25 new OpenLayers.Control.OverviewMap({
26 maximized : false,
27 mapOptions: { theme: null, },
28 }),
29 new OpenLayers.Control.MousePosition({ 'displayProjection' : projection_wgs }),
30 /**
31 * Decided to disable these controls.
32 * The layerswitcher has been replaced with a custom one. If you want the original back,
33 * make sure to disable the custom one to prevent collision.
34 */
35
36 //new OpenLayers.Control.PanZoomBav(),
37 //new OpenLayers.Control.ScaleLine(),
38 //new OpenLayers.Control.LayerSwitcher(),
39 ],
40 maxExtent: new OpenLayers.Bounds(-20037508.3427892,-20037508.3427892,20037508.3427892,20037508.3427892),
41 numZoomLevels:16,
42 maxResolution:156543.0339,
43 units:'m',
44 projection: "EPSG:900913",
45 displayProjection: new OpenLayers.Projection("EPSG:4326")
46 });
47
48 map.events.register('click', map, GetMousePos);
49 function GetMousePos(pos) {
50 var pix = map.getLonLatFromPixel(new OpenLayers.Pixel(pos.xy.x,pos.xy.y));
51 var mousepos = OpenLayers.Layer.SphericalMercator.inverseMercator(pix.lon, pix.lat);
52 var zoomlevel = map.getZoom();
53 getNodeList(zoom, mousepos);
54 }
55
56 layerMapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik");
57 map.addLayer(layerMapnik);
58
59 layerHeatmap2 = new OpenLayers.Layer.OSM.Overlay2("All Access points", {isBaseLayer: false, visibility: false});
60 //map.addLayer(layerHeatmap2);
61
62 signallayer = new OpenLayers.Layer.OSM.Overlay4("signallayer", {isBaseLayer: false, visibility: false});
63 map.addLayer(signallayer);
64
65 layerHeatmap3 = new OpenLayers.Layer.OSM.Overlay3("Wireless Leiden Coverage", {isBaseLayer: false, visibility: true});
66 map.addLayer(layerHeatmap3);
67
68 layerHeatmap = new OpenLayers.Layer.OSM.Overlay1("Original Heatmap generator", {isBaseLayer: false, visibility: false});
69 //map.addLayer(layerHeatmap);
70
71 // create the layer styleMap by giving the default style a context
72 var colors = ["red", "green", "blue"];
73 var context = {
74 getSize: function(feature) {
75 var resolution = map.getResolution();
76 var scale = map.getZoom();
77 var base = 1;
78 if (scale > 16) {
79 base = 5;
80 } else if (scale > 14) {
81 base = 20;
82 } else {
83 base = 50;
84 }
85 return (base / map.getResolution());
86 }
87 };
88 var template = {
89 pointRadius: "${getSize}", // using context.getSize(feature)
90 fillColor: "lightgreen", // using context.getColor(feature)
91 strokeWidth: 0.5,
92 };
93 var style = new OpenLayers.Style(template, {context: context});
94 var geojson = new OpenLayers.Layer.GML("GeoJSON", "/static/nodes.json", {
95 projection: new OpenLayers.Projection("EPSG:4326"),
96 styleMap: new OpenLayers.StyleMap(style),
97 format: OpenLayers.Format.GeoJSON
98 });
99 map.addLayer(geojson);
100
101
102 var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
103 map.setCenter (lonLat, zoom);
104
105
106 /**
107 * Layers above are put in switcher, category 'default', with code below.
108 * TODO: Make process for putting layers into layerswitcher dynamic instead of putting every layer there manually.
109 */
110
111 //$("#default").append("<span id=\"" + layerHeatmap.name + "\"><div id='layer_switcher_colour' style='background-color:rgb(" + layerHeatmap.colour + ")' /><input type=checkbox id=togglelayer /><font>" + layerHeatmap.name + " </font><br /></span>");
112
113 //$("#default").append("<span id=\"" + layerHeatmap2.name + "\"><div id='layer_switcher_colour' style='background-color:rgb(" + layerHeatmap2.colour + ")' /><input type=checkbox id=togglelayer /><font>" + layerHeatmap2.name + " </font><br /></span>");
114
115 $("#default").append("<span id=\"" + signallayer.name + "\"><div id='layer_switcher_colour' style='background-color:rgb(" + signallayer.colour + ")' /><input type=checkbox id=togglelayer /><font>Replaced during init</font><br /></span>");
116
117 $("#default").append("<span id=\"" + layerHeatmap3.name + "\"><div id='layer_switcher_colour' style='background-color:rgb(" + layerHeatmap3.colour + ")' /><input type=checkbox id=togglelayer checked/><font>" + layerHeatmap3.name + " </font><br /></span>");
118
119}
Note: See TracBrowser for help on using the repository browser.