summaryrefslogtreecommitdiff
path: root/map.js
blob: c39421a2efea41345e831336c0271c3710344cc3 (plain)
  1. var map = null; //global map object
  2. // base config
  3. var attribOSM = '&copy; <a href="//openstreetmap.org">OpenStreetMap</a>-bidragydere, <a href="//creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>';
  4. var OSMLayer = L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: attribOSM } );
  5. var Box = L.latLngBounds( [[54.5, 8.0],[57.8, 15.3]] );
  6. // GeoJSON feature styling and grouping
  7. function returnFeatureMarker(feature, latlng) {
  8. var hasPopup = (feature.properties.location && feature.properties.type);
  9. return L.marker(latlng, {
  10. title: feature.properties.title,
  11. zIndexOffset: 1000*feature.properties.priority || 0,
  12. clickable: hasPopup,
  13. keyboard: hasPopup
  14. });
  15. };
  16. function addFeaturePopup(feature, layer) {
  17. if (feature.properties.location && feature.properties.title) {
  18. layer.bindPopup('<strong>'+feature.properties.title+'</strong><br>'+feature.properties.location);
  19. }
  20. };
  21. var center = L.geoJson([],{
  22. pointToLayer: returnFeatureMarker,
  23. onEachFeature: addFeaturePopup,
  24. filter: function(feature, layer) {
  25. return (feature.properties.type == "center");
  26. }
  27. });
  28. var center_begin = L.geoJson([],{
  29. pointToLayer: returnFeatureMarker,
  30. onEachFeature: addFeaturePopup,
  31. filter: function(feature, layer) {
  32. return (feature.properties.type == "center-begin");
  33. }
  34. });
  35. var member = L.geoJson([],{
  36. pointToLayer: returnFeatureMarker,
  37. onEachFeature: addFeaturePopup,
  38. filter: function(feature, layer) {
  39. return (feature.properties.type == "member");
  40. }
  41. });
  42. var diploma = L.geoJson([],{
  43. pointToLayer: returnFeatureMarker,
  44. onEachFeature: addFeaturePopup,
  45. filter: function(feature, layer) {
  46. return (feature.properties.type == "diploma");
  47. }
  48. });
  49. var diploma_aspiring = L.geoJson([],{
  50. pointToLayer: returnFeatureMarker,
  51. onEachFeature: addFeaturePopup,
  52. filter: function(feature, layer) {
  53. return (feature.properties.type == "diploma-aspiring");
  54. }
  55. });
  56. var unknown = L.geoJson([],{
  57. pointToLayer: returnFeatureMarker,
  58. onEachFeature: addFeaturePopup,
  59. filter: function(feature, layer) {
  60. return (feature.properties.type == null);
  61. }
  62. });
  63. var overlayMaps = {
  64. "LAND Centre": center,
  65. "LAND startere": center_begin,
  66. "Medlemmer": member,
  67. "Diplomholdere": diploma,
  68. "Diplomaspiranter": diploma_aspiring,
  69. "Øvrige": unknown
  70. };
  71. function overlayCallback(data) {
  72. center.addData(data).addTo(map);
  73. center_begin.addData(data).addTo(map);
  74. member.addData(data).addTo(map);
  75. diploma.addData(data).addTo(map);
  76. diploma_aspiring.addData(data).addTo(map);
  77. unknown.addData(data);
  78. };
  79. // position popup
  80. function round(n,d) {
  81. return Math.round(Math.pow(10,d)*n)/Math.pow(10,d)
  82. };
  83. function lngLatString(latLng) {
  84. return round(latLng.lng,5) + ", " + round(latLng.lat,5)
  85. };
  86. var popup = L.popup();
  87. function positionPopup(e) {
  88. popup
  89. .setLatLng(e.latlng)
  90. .setContent("Position (long, lat):<br>" + lngLatString(e.latlng))
  91. .openOn(map);
  92. }
  93. // http://mathiasbynens.be/notes/xhr-responsetype-json
  94. var getJSON = function(url, successHandler, errorHandler) {
  95. var xhr = typeof XMLHttpRequest != 'undefined'
  96. ? new XMLHttpRequest()
  97. : new ActiveXObject('Microsoft.XMLHTTP');
  98. var supportsJSON = (function() {
  99. if (typeof XMLHttpRequest == 'undefined') {
  100. return false;
  101. }
  102. xhr.open('get', '/', true);
  103. try {
  104. // some browsers throw when setting `responseType` to an unsupported value
  105. xhr.responseType = 'json';
  106. } catch(error) {
  107. return false;
  108. }
  109. return 'response' in xhr && xhr.responseType == 'json';
  110. }());
  111. xhr.open('get', url, true);
  112. if (supportsJSON) {
  113. xhr.responseType = 'json';
  114. }
  115. xhr.onreadystatechange = function() {
  116. var status;
  117. var data;
  118. // http://xhr.spec.whatwg.org/#dom-xmlhttprequest-readystate
  119. if (xhr.readyState == 4) { // `DONE`
  120. status = xhr.status;
  121. if (status == 200) {
  122. successHandler && successHandler(
  123. supportsJSON
  124. ? xhr.response
  125. : JSON.parse(xhr.responseText)
  126. );
  127. } else {
  128. errorHandler && errorHandler(status);
  129. }
  130. }
  131. };
  132. xhr.send();
  133. };
  134. // create base map when DOM is ready, and then add features and controls
  135. function initMap() {
  136. map = L.map('content', { layers: [OSMLayer] });
  137. map.attributionControl.setPrefix(false);
  138. map.fitBounds(Box);
  139. // micro-polyfill - http://mathiasbynens.be/notes/document-head
  140. var head = document.head || document.getElementsByTagName('head')[0];
  141. // load all rel=points links in html header as GeoJSON
  142. var links = head.getElementsByTagName("link")
  143. for (i=0;i< links.length;i++) {
  144. if (links[i].rel == "points") {
  145. getJSON(links[i].href, function (data) {
  146. overlayCallback(data);
  147. });
  148. }
  149. };
  150. L.control.layers([],overlayMaps).addTo(map);
  151. L.control.scale({ imperial: false }).addTo(map);
  152. map.on('contextmenu', positionPopup);
  153. };
  154. yepnope([
  155. {
  156. test : window.JSON,
  157. // https://code.google.com/p/json-sans-eval/
  158. // (json2: less secure; json3: larger - unneeded features)
  159. nope : 'json-minified.js',
  160. }, {
  161. test: document.addEventListener,
  162. nope: 'EventListener.js',
  163. complete: function() {
  164. document.addEventListener("DOMContentLoaded", initMap, false)
  165. }
  166. }
  167. ]);