Skip to content
Snippets Groups Projects
Commit 545affa7 authored by Jakob Severin Steffensen Hjelseth's avatar Jakob Severin Steffensen Hjelseth
Browse files

Merge branch 'dev' into 'main' 

Dev

See merge request !75
parents 8a4f17b4 1de266ed
No related branches found
No related tags found
2 merge requests!76Resolve "Fix og sjekk",!75Dev
Pipeline #251206 passed with stage
Stage:
    in 6 seconds
    Hide whitespace changes
    Inline Side-by-side
    css/style.css
    + 5
    − 0
    View file @ 545affa7
    ......@@ -46,6 +46,11 @@ p {
    flex-grow: 2;
    flex-direction: row;
    }
    .box4 {
    display: flex;
    flex-grow: 4;
    flex-direction: row;
    }
    .button {
    font-family: monospace;
    ......
    index.html
    + 61
    − 1
    View file @ 545affa7
    ......@@ -38,9 +38,10 @@
    <button class="button" onclick="openBox('unionBox')">Union</button>
    </div>
    <div id="buttons2" class="box2" style="display: none;">
    <p style="width: 32vw;"></p>
    <p style="width: 25vw;"></p>
    <button class="button" onclick="TIN()">TIN</button>
    <button class="button" onclick="voronoi()">Voronoi</button>
    <button class="button" onclick="heatmap()">Heatmap</button>
    </div>
    </div>
    ......@@ -270,6 +271,47 @@
    <p id="tutorial" class="tutorial"></p>
    </div>
    <div id="loadPointsBox" class="box">
    <div class="box3">
    <h1 style="font-size: 4vh; text-align: center; width: 36vw;">Load points</h1>
    <svg style="cursor: pointer; padding-top: 15px;" onclick="closeBox('loadPointsBox')"
    xmlns="http://www.w3.org/2000/svg" width="3vw" height="3vw" fill="currentColor" class="bi bi-x-circle-fill" viewBox="0 0 16 16">
    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"/>
    </svg>
    </div>
    <button id="examplePoints" class="onClick" style="line-height: 10vh;" onclick="handleDefaultPoints()">Load example points</button>
    <input id="fileInput2" type="file" accept=".geojson" style="display: none;">
    <button id="loadPoints" class="onClick" style="margin-top: 2vh; line-height: 10vh;" onclick="loadPoints()">Load points from file</button>
    <p id="savePoints" style="display: none; margin-top: 2vh;">Save points to file</p><br>
    <input id="fileName" style="display: none;"><br>
    <button id="save" class="onClick" style="display: none; margin-top: 2vh;" onclick="saveToFile()">Save</button>
    <button id="removePoints" class="onClick" style="margin-top: 2vh; line-height: 10vh; display: none;" onclick="handleDefaultPoints()">Remove current points</button>
    </div>
    <div id="makeNewPointBox" class="box">
    <div class="box3">
    <h1 style="font-size: 4vh; text-align: center; width: 36vw;">Make new point</h1>
    <svg style="cursor: pointer; padding-top: 15px;" onclick="closeBox('makeNewPointBox')"
    xmlns="http://www.w3.org/2000/svg" width="3vw" height="3vw" fill="currentColor" class="bi bi-x-circle-fill" viewBox="0 0 16 16">
    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"/>
    </svg>
    </div>
    <p>Lengdegrader: <input id="lengdegrader" readonly></p> <!-- 10.xxx -->
    <p>Breddegrader: <input id="breddegrader" readonly></p> <!-- 6x.xxx -->
    <p>Set category: <input id="pointCategory"></p>
    <p>Set name: <input id="pointName"></p>
    <button id="savePoint" class="onClick" style="margin-top: 2vh;" onclick="savePoint()">Save point</button>
    </div>
    </div>
    <div class="box2">
    ......@@ -279,11 +321,21 @@
    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8.5 4.5a.5.5 0 0 0-1 0v3h-3a.5.5 0 0 0 0 1h3v3a.5.5 0 0 0 1 0v-3h3a.5.5 0 0 0 0-1h-3v-3z"/>
    </svg>
    <svg id="pointOpener" style="cursor: pointer; border: none; position: absolute; color: orangered; z-index: 999; display: none;" onclick="openBox('loadPointsBox');"
    xmlns="http://www.w3.org/2000/svg" width="6vh" height="6vh" fill="currentColor" class="bi bi-plus-circle-fill" viewBox="0 0 16 16">
    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8.5 4.5a.5.5 0 0 0-1 0v3h-3a.5.5 0 0 0 0 1h3v3a.5.5 0 0 0 1 0v-3h3a.5.5 0 0 0 0-1h-3v-3z"/>
    </svg>
    <svg id="mapChanger" style="margin-left: 8vh; cursor: pointer; border: none; position: absolute; color: orangered; z-index: 999;" onclick="changeMap()"
    xmlns="http://www.w3.org/2000/svg" width="6vh" height="6vh" fill="currentColor" class="bi bi-pin-map-fill" viewBox="0 0 16 16">
    <path fill-rule="evenodd" d="M3.1 11.2a.5.5 0 0 1 .4-.2H6a.5.5 0 0 1 0 1H3.75L1.5 15h13l-2.25-3H10a.5.5 0 0 1 0-1h2.5a.5.5 0 0 1 .4.2l3 4a.5.5 0 0 1-.4.8H.5a.5.5 0 0 1-.4-.8l3-4z"/>
    <path fill-rule="evenodd" d="M4 4a4 4 0 1 1 4.5 3.969V13.5a.5.5 0 0 1-1 0V7.97A4 4 0 0 1 4 3.999z"/>
    </svg>
    <svg id="addPointButton" style="margin-left: 16vh; cursor: pointer; border: none; position: absolute; color: orangered; z-index: 999; display: none;" onclick="addPoint(), event.stopPropagation()"
    xmlns="http://www.w3.org/2000/svg" width="6vh" height="6vh" fill="currentColor" class="bi bi-geo" viewBox="0 0 16 16">
    <path fill-rule="evenodd" d="M8 1a3 3 0 1 0 0 6 3 3 0 0 0 0-6M4 4a4 4 0 1 1 4.5 3.969V13.5a.5.5 0 0 1-1 0V7.97A4 4 0 0 1 4 3.999zm2.493 8.574a.5.5 0 0 1-.411.575c-.712.118-1.28.295-1.655.493a1.319 1.319 0 0 0-.37.265.301.301 0 0 0-.057.09V14l.002.008a.147.147 0 0 0 .016.033.617.617 0 0 0 .145.15c.165.13.435.27.813.395.751.25 1.82.414 3.024.414s2.273-.163 3.024-.414c.378-.126.648-.265.813-.395a.619.619 0 0 0 .146-.15.148.148 0 0 0 .015-.033L12 14v-.004a.301.301 0 0 0-.057-.09 1.318 1.318 0 0 0-.37-.264c-.376-.198-.943-.375-1.655-.493a.5.5 0 1 1 .164-.986c.77.127 1.452.328 1.957.594C12.5 13 13 13.4 13 14c0 .426-.26.752-.544.977-.29.228-.68.413-1.116.558-.878.293-2.059.465-3.34.465-1.281 0-2.462-.172-3.34-.465-.436-.145-.826-.33-1.116-.558C3.26 14.752 3 14.426 3 14c0-.599.5-1 .961-1.243.505-.266 1.187-.467 1.957-.594a.5.5 0 0 1 .575.411"/>
    </svg>
    </div>
    <div style="width: 95vw;"></div>
    ......@@ -301,6 +353,12 @@
    <!-- Leaflet js -->
    <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
    <!-- Saving files -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.0/FileSaver.min.js"></script>
    <!-- Heatmap -->
    <script src="javascript/leaflet-heat.js"></script>
    <!-- My js -->
    <!-- General -->
    ......@@ -327,8 +385,10 @@
    <!-- Map change -->
    <script src="javascript/mapChange.js"></script>
    <script src="javascript/pointMap.js"></script>
    <script src="javascript/voronoi.js"></script>
    <script src="javascript/tin.js"></script>
    <script src="javascript/heatmap.js"></script>
    </body>
    </html>
    javascript/exampleData/points.geojson 0 → 100644
    + 35
    − 0
    View file @ 545affa7
    {
    "type": "FeatureCollection",
    "features": [
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4044907, 63.4173049]}, "properties": {"category": "Universitet", "name": "NTNU Gløshaugen"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4696324, 63.4079572]}, "properties": {"category": "Universitet", "name": "NTNU Dragvoll"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.388918, 63.4203714]}, "properties": {"category": "Universitet", "name": "NTNU Øya"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4347967, 63.4235678]}, "properties": {"category": "Universitet", "name": "NTNU Tyholt"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4143153, 63.433756]}, "properties": {"category": "Universitet", "name": "NTNU Solsiden"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4336351, 63.4138729]}, "properties": {"category": "Universitet", "name": "NTNU Moholt"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4032871, 63.4340888]}, "properties": {"category": "Universitet", "name": "NTNU Olavskvartalet"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4071882, 63.4107064]}, "properties": {"category": "Universitet", "name": "NTNU Lerkendal og Valgrinda"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3861107, 63.4288662]}, "properties": {"category": "Universitet", "name": "NTNU Kalvskinnet"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4540302, 63.4473022]}, "properties": {"category": "Universitet", "name": "NTNU Ringve"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3483128, 63.4415347]}, "properties": {"category": "Universitet", "name": "NTNU Heggdalen"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4492127, 63.4521411]}, "properties": {"category": "Universitet", "name": "NTNU Østmarka"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3981586, 63.4373727]}, "properties": {"category": "Universitet", "name": "NTNU Brattørkaia"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3992594, 63.4152944]}, "properties": {"category": "Universitet", "name": "NTNU Elgeseter"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4837531, 63.4393659]}, "properties": {"category": "Universitet", "name": "NTNU Rotvoll"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4660445, 63.42338]}, "properties": {"category": "Universitet", "name": "NTNU Tunga"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4176387, 63.4141732]}, "properties": {"category": "Studentby", "name": "Berg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4301549, 63.4110984]}, "properties": {"category": "Studentby", "name": "Moholt Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4372857, 63.3989126]}, "properties": {"category": "Studentby", "name": "Steinan Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3918823, 63.420511]}, "properties": {"category": "Studentby", "name": "Bloksberg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4382451, 63.4116778]}, "properties": {"category": "Studentby", "name": "Karinelund Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4945864, 63.4211031]}, "properties": {"category": "Studentby", "name": "Jakobsliveien 55"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.396918, 63.4226982]}, "properties": {"category": "Studentby", "name": "Klostergata 18"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3963873, 63.4227505]}, "properties": {"category": "Studentby", "name": "Klostergata 20"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3891634, 63.4232409]}, "properties": {"category": "Studentby", "name": "Klostergata 56"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4126211, 63.4147073]}, "properties": {"category": "Studentby", "name": "Nedre Berg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3973319, 63.418334]}, "properties": {"category": "Studentby", "name": "Magnus den godes gate 2"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4037983, 63.4215247]}, "properties": {"category": "Studentby", "name": "Nedre Singsakerslette"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3890993, 63.4276236]}, "properties": {"category": "Studentby", "name": "Sverresgate 8"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4122453, 63.4337663]}, "properties": {"category": "Studentby", "name": "Nedre elvehavn Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3982518, 63.4163341]}, "properties": {"category": "Studentby", "name": "Teknobyen Studentboliger"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4003657, 63.4117822]}, "properties": {"category": "Studentby", "name": "Lerkendal Studentby"}}]}
    \ No newline at end of file
    javascript/heatmap.js 0 → 100644
    + 28
    − 0
    View file @ 545affa7
    var isHeat = false;
    var intensity = 100;
    var heat = null;
    function heatmap() {
    if (points != null) {
    if (isHeat && heat != null) {
    map.removeLayer(heat);
    isHeat = false;
    } else {
    var data = getPoints();
    heat = L.heatLayer(data);
    isHeat = true;
    heat.addTo(map);
    }
    }
    }
    function getPoints() {
    var data = points.toGeoJSON().features;
    var heatData = [];
    for (point in data) {
    heatData.push([data[point].geometry.coordinates[1], data[point].geometry.coordinates[0], intensity]);
    }
    return heatData;
    }
    javascript/leaflet-heat.js 0 → 100644
    + 11
    − 0
    View file @ 545affa7
    /*
    (c) 2014, Vladimir Agafonkin
    simpleheat, a tiny JavaScript library for drawing heatmaps with Canvas
    https://github.com/mourner/simpleheat
    */
    !function(){"use strict";function t(i){return this instanceof t?(this._canvas=i="string"==typeof i?document.getElementById(i):i,this._ctx=i.getContext("2d"),this._width=i.width,this._height=i.height,this._max=1,void this.clear()):new t(i)}t.prototype={defaultRadius:25,defaultGradient:{.4:"blue",.6:"cyan",.7:"lime",.8:"yellow",1:"red"},data:function(t,i){return this._data=t,this},max:function(t){return this._max=t,this},add:function(t){return this._data.push(t),this},clear:function(){return this._data=[],this},radius:function(t,i){i=i||15;var a=this._circle=document.createElement("canvas"),s=a.getContext("2d"),e=this._r=t+i;return a.width=a.height=2*e,s.shadowOffsetX=s.shadowOffsetY=200,s.shadowBlur=i,s.shadowColor="black",s.beginPath(),s.arc(e-200,e-200,t,0,2*Math.PI,!0),s.closePath(),s.fill(),this},gradient:function(t){var i=document.createElement("canvas"),a=i.getContext("2d"),s=a.createLinearGradient(0,0,0,256);i.width=1,i.height=256;for(var e in t)s.addColorStop(e,t[e]);return a.fillStyle=s,a.fillRect(0,0,1,256),this._grad=a.getImageData(0,0,1,256).data,this},draw:function(t){this._circle||this.radius(this.defaultRadius),this._grad||this.gradient(this.defaultGradient);var i=this._ctx;i.clearRect(0,0,this._width,this._height);for(var a,s=0,e=this._data.length;e>s;s++)a=this._data[s],i.globalAlpha=Math.max(a[2]/this._max,t||.05),i.drawImage(this._circle,a[0]-this._r,a[1]-this._r);var n=i.getImageData(0,0,this._width,this._height);return this._colorize(n.data,this._grad),i.putImageData(n,0,0),this},_colorize:function(t,i){for(var a,s=3,e=t.length;e>s;s+=4)a=4*t[s],a&&(t[s-3]=i[a],t[s-2]=i[a+1],t[s-1]=i[a+2])}},window.simpleheat=t}(),/*
    (c) 2014, Vladimir Agafonkin
    Leaflet.heat, a tiny and fast heatmap plugin for Leaflet.
    https://github.com/Leaflet/Leaflet.heat
    */
    L.HeatLayer=(L.Layer?L.Layer:L.Class).extend({initialize:function(t,i){this._latlngs=t,L.setOptions(this,i)},setLatLngs:function(t){return this._latlngs=t,this.redraw()},addLatLng:function(t){return this._latlngs.push(t),this.redraw()},setOptions:function(t){return L.setOptions(this,t),this._heat&&this._updateOptions(),this.redraw()},redraw:function(){return!this._heat||this._frame||this._map._animating||(this._frame=L.Util.requestAnimFrame(this._redraw,this)),this},onAdd:function(t){this._map=t,this._canvas||this._initCanvas(),t._panes.overlayPane.appendChild(this._canvas),t.on("moveend",this._reset,this),t.options.zoomAnimation&&L.Browser.any3d&&t.on("zoomanim",this._animateZoom,this),this._reset()},onRemove:function(t){t.getPanes().overlayPane.removeChild(this._canvas),t.off("moveend",this._reset,this),t.options.zoomAnimation&&t.off("zoomanim",this._animateZoom,this)},addTo:function(t){return t.addLayer(this),this},_initCanvas:function(){var t=this._canvas=L.DomUtil.create("canvas","leaflet-heatmap-layer leaflet-layer"),i=L.DomUtil.testProp(["transformOrigin","WebkitTransformOrigin","msTransformOrigin"]);t.style[i]="50% 50%";var a=this._map.getSize();t.width=a.x,t.height=a.y;var s=this._map.options.zoomAnimation&&L.Browser.any3d;L.DomUtil.addClass(t,"leaflet-zoom-"+(s?"animated":"hide")),this._heat=simpleheat(t),this._updateOptions()},_updateOptions:function(){this._heat.radius(this.options.radius||this._heat.defaultRadius,this.options.blur),this.options.gradient&&this._heat.gradient(this.options.gradient),this.options.max&&this._heat.max(this.options.max)},_reset:function(){var t=this._map.containerPointToLayerPoint([0,0]);L.DomUtil.setPosition(this._canvas,t);var i=this._map.getSize();this._heat._width!==i.x&&(this._canvas.width=this._heat._width=i.x),this._heat._height!==i.y&&(this._canvas.height=this._heat._height=i.y),this._redraw()},_redraw:function(){var t,i,a,s,e,n,h,o,r,d=[],_=this._heat._r,l=this._map.getSize(),m=new L.Bounds(L.point([-_,-_]),l.add([_,_])),c=void 0===this.options.max?1:this.options.max,u=void 0===this.options.maxZoom?this._map.getMaxZoom():this.options.maxZoom,f=1/Math.pow(2,Math.max(0,Math.min(u-this._map.getZoom(),12))),g=_/2,p=[],v=this._map._getMapPanePos(),w=v.x%g,y=v.y%g;for(t=0,i=this._latlngs.length;i>t;t++)if(a=this._map.latLngToContainerPoint(this._latlngs[t]),m.contains(a)){e=Math.floor((a.x-w)/g)+2,n=Math.floor((a.y-y)/g)+2;var x=void 0!==this._latlngs[t].alt?this._latlngs[t].alt:void 0!==this._latlngs[t][2]?+this._latlngs[t][2]:1;r=x*f,p[n]=p[n]||[],s=p[n][e],s?(s[0]=(s[0]*s[2]+a.x*r)/(s[2]+r),s[1]=(s[1]*s[2]+a.y*r)/(s[2]+r),s[2]+=r):p[n][e]=[a.x,a.y,r]}for(t=0,i=p.length;i>t;t++)if(p[t])for(h=0,o=p[t].length;o>h;h++)s=p[t][h],s&&d.push([Math.round(s[0]),Math.round(s[1]),Math.min(s[2],c)]);this._heat.data(d).draw(this.options.minOpacity),this._frame=null},_animateZoom:function(t){var i=this._map.getZoomScale(t.zoom),a=this._map._getCenterOffset(t.center)._multiplyBy(-i).subtract(this._map._getMapPanePos());L.DomUtil.setTransform?L.DomUtil.setTransform(this._canvas,a,i):this._canvas.style[L.DomUtil.TRANSFORM]=L.DomUtil.getTranslateString(a)+" scale("+i+")"}}),L.heatLayer=function(t,i){return new L.HeatLayer(t,i)};
    \ No newline at end of file
    javascript/mapChange.js
    + 15
    − 52
    View file @ 545affa7
    // Variabler:
    // Punktene brukt i visningen av "kart 2":
    var points = {
    "type": "FeatureCollection",
    "features": [
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4044907, 63.4173049]}, "properties": {"category": "Universitet", "name": "NTNU Gløshaugen"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4696324, 63.4079572]}, "properties": {"category": "Universitet", "name": "NTNU Dragvoll"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.388918, 63.4203714]}, "properties": {"category": "Universitet", "name": "NTNU Øya"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4347967, 63.4235678]}, "properties": {"category": "Universitet", "name": "NTNU Tyholt"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4143153, 63.433756]}, "properties": {"category": "Universitet", "name": "NTNU Solsiden"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4336351, 63.4138729]}, "properties": {"category": "Universitet", "name": "NTNU Moholt"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4032871, 63.4340888]}, "properties": {"category": "Universitet", "name": "NTNU Olavskvartalet"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4071882, 63.4107064]}, "properties": {"category": "Universitet", "name": "NTNU Lerkendal og Valgrinda"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3861107, 63.4288662]}, "properties": {"category": "Universitet", "name": "NTNU Kalvskinnet"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4540302, 63.4473022]}, "properties": {"category": "Universitet", "name": "NTNU Ringve"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3483128, 63.4415347]}, "properties": {"category": "Universitet", "name": "NTNU Heggdalen"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4492127, 63.4521411]}, "properties": {"category": "Universitet", "name": "NTNU Østmarka"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3981586, 63.4373727]}, "properties": {"category": "Universitet", "name": "NTNU Brattørkaia"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3992594, 63.4152944]}, "properties": {"category": "Universitet", "name": "NTNU Elgeseter"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4837531, 63.4393659]}, "properties": {"category": "Universitet", "name": "NTNU Rotvoll"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4660445, 63.42338]}, "properties": {"category": "Universitet", "name": "NTNU Tunga"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4176387, 63.4141732]}, "properties": {"category": "Studentby", "name": "Berg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4301549, 63.4110984]}, "properties": {"category": "Studentby", "name": "Moholt Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4372857, 63.3989126]}, "properties": {"category": "Studentby", "name": "Steinan Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3918823, 63.420511]}, "properties": {"category": "Studentby", "name": "Bloksberg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4382451, 63.4116778]}, "properties": {"category": "Studentby", "name": "Karinelund Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4945864, 63.4211031]}, "properties": {"category": "Studentby", "name": "Jakobsliveien 55"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.396918, 63.4226982]}, "properties": {"category": "Studentby", "name": "Klostergata 18"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3963873, 63.4227505]}, "properties": {"category": "Studentby", "name": "Klostergata 20"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3891634, 63.4232409]}, "properties": {"category": "Studentby", "name": "Klostergata 56"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4126211, 63.4147073]}, "properties": {"category": "Studentby", "name": "Nedre Berg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3973319, 63.418334]}, "properties": {"category": "Studentby", "name": "Magnus den godes gate 2"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4037983, 63.4215247]}, "properties": {"category": "Studentby", "name": "Nedre Singsakerslette"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3890993, 63.4276236]}, "properties": {"category": "Studentby", "name": "Sverresgate 8"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4122453, 63.4337663]}, "properties": {"category": "Studentby", "name": "Nedre elvehavn Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3982518, 63.4163341]}, "properties": {"category": "Studentby", "name": "Teknobyen Studentboliger"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4003657, 63.4117822]}, "properties": {"category": "Studentby", "name": "Lerkendal Studentby"}}
    ]
    };
    var m = "m1"; // Hvilket kart en bruker
    var layersOnMap = []; // Hvilke kartlag som var på i "m1" før en byttet til "m2"
    // Legger til alle punktene over og setter på en popup med info-tekst:
    var NTNU_points = L.geoJSON(points).bindPopup(function(point) {return "<b>" + point.feature.properties.category + "</b>" + "<br>" + point.feature.properties.name;})
    // Bytter layout på nettsiden ved kartbytte
    function changeMap() {
    ......@@ -66,8 +24,9 @@ function changeMap() {
    // Endrer knappene nedrest til høyre i kartet:
    document.getElementById("sidebarOpener").style.display = "none";
    document.getElementById("mapChanger").style.marginLeft = "0";
    document.getElementById("pointOpener").style.display = "block";
    document.getElementById("addPointButton").style.display = "block";
    // Skjuler synlige kartlag i kartet:
    for (key in overlayMaps) {
    var layer = overlayMaps[key];
    ......@@ -76,9 +35,6 @@ function changeMap() {
    layersOnMap.push(key);
    }
    }
    // Legger til nye punkt-markører i kartet:
    NTNU_points.addTo(map);
    } else if (m == "m2") {
    m = "m1";
    ......@@ -88,18 +44,25 @@ function changeMap() {
    // Endrer knappene nedrest til høyre i kartet:
    document.getElementById("sidebarOpener").style.display = "block";
    document.getElementById("mapChanger").style.marginLeft = "8vh";
    document.getElementById("pointOpener").style.display = "none";
    document.getElementById("addPointButton").style.display = "none";
    // Fjerner punkt-markørene og eventuelle voronoi- og TIN-diagram fra kartet:
    if (map.hasLayer(NTNU_points)) {
    map.removeLayer(NTNU_points);
    }
    if (isVoronoi) {
    voronoi();
    voronoi();
    }
    if (isTIN) {
    TIN();
    }
    if (isHeat) {
    heatmap();
    }
    if (points != null) {
    if (map.hasLayer(points)) {
    handleDefaultPoints();
    }
    }
    // Legger til kartlagene som lå i kartet før en byttet kartmodus:
    while (layersOnMap.length > 0) {
    ......
    javascript/pointMap.js 0 → 100644
    + 218
    − 0
    View file @ 545affa7
    // Punktene brukt i visningen av "kart 2":
    /*
    var NTNU_points = {
    "type": "FeatureCollection",
    "features": [
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4044907, 63.4173049]}, "properties": {"category": "Universitet", "name": "NTNU Gløshaugen"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4696324, 63.4079572]}, "properties": {"category": "Universitet", "name": "NTNU Dragvoll"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.388918, 63.4203714]}, "properties": {"category": "Universitet", "name": "NTNU Øya"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4347967, 63.4235678]}, "properties": {"category": "Universitet", "name": "NTNU Tyholt"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4143153, 63.433756]}, "properties": {"category": "Universitet", "name": "NTNU Solsiden"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4336351, 63.4138729]}, "properties": {"category": "Universitet", "name": "NTNU Moholt"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4032871, 63.4340888]}, "properties": {"category": "Universitet", "name": "NTNU Olavskvartalet"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4071882, 63.4107064]}, "properties": {"category": "Universitet", "name": "NTNU Lerkendal og Valgrinda"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3861107, 63.4288662]}, "properties": {"category": "Universitet", "name": "NTNU Kalvskinnet"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4540302, 63.4473022]}, "properties": {"category": "Universitet", "name": "NTNU Ringve"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3483128, 63.4415347]}, "properties": {"category": "Universitet", "name": "NTNU Heggdalen"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4492127, 63.4521411]}, "properties": {"category": "Universitet", "name": "NTNU Østmarka"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3981586, 63.4373727]}, "properties": {"category": "Universitet", "name": "NTNU Brattørkaia"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3992594, 63.4152944]}, "properties": {"category": "Universitet", "name": "NTNU Elgeseter"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4837531, 63.4393659]}, "properties": {"category": "Universitet", "name": "NTNU Rotvoll"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4660445, 63.42338]}, "properties": {"category": "Universitet", "name": "NTNU Tunga"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4176387, 63.4141732]}, "properties": {"category": "Studentby", "name": "Berg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4301549, 63.4110984]}, "properties": {"category": "Studentby", "name": "Moholt Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4372857, 63.3989126]}, "properties": {"category": "Studentby", "name": "Steinan Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3918823, 63.420511]}, "properties": {"category": "Studentby", "name": "Bloksberg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4382451, 63.4116778]}, "properties": {"category": "Studentby", "name": "Karinelund Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4945864, 63.4211031]}, "properties": {"category": "Studentby", "name": "Jakobsliveien 55"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.396918, 63.4226982]}, "properties": {"category": "Studentby", "name": "Klostergata 18"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3963873, 63.4227505]}, "properties": {"category": "Studentby", "name": "Klostergata 20"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3891634, 63.4232409]}, "properties": {"category": "Studentby", "name": "Klostergata 56"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4126211, 63.4147073]}, "properties": {"category": "Studentby", "name": "Nedre Berg Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3973319, 63.418334]}, "properties": {"category": "Studentby", "name": "Magnus den godes gate 2"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4037983, 63.4215247]}, "properties": {"category": "Studentby", "name": "Nedre Singsakerslette"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3890993, 63.4276236]}, "properties": {"category": "Studentby", "name": "Sverresgate 8"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4122453, 63.4337663]}, "properties": {"category": "Studentby", "name": "Nedre elvehavn Studentby"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.3982518, 63.4163341]}, "properties": {"category": "Studentby", "name": "Teknobyen Studentboliger"}},
    {"type": "Feature", "geometry": {"type": "Point", "coordinates": [10.4003657, 63.4117822]}, "properties": {"category": "Studentby", "name": "Lerkendal Studentby"}}
    ]
    };
    */
    // Initialiserer punkt-laget:
    var points = null;
    var newPoint = false;
    map.addEventListener('click', (event) => {
    if (newPoint) {
    onMapClick(event);
    }
    })
    function addPoint() {
    document.getElementById("addPointButton").style.color = "green";
    newPoint = true;
    if (isTIN) {
    TIN();
    }
    if (isVoronoi) {
    voronoi();
    }
    }
    function onMapClick(e) {
    openBox("makeNewPointBox");
    document.getElementById("lengdegrader").value = e.latlng.lng;
    document.getElementById("breddegrader").value = e.latlng.lat;
    document.getElementById("addPointButton").style.color = "orangered";
    newPoint = false;
    }
    function savePoint() {
    var regex = /^[a-zA-Z_0-9]+$/;
    if (document.getElementById("pointCategory").value == "") {
    return alert("You need to choose a category!");
    } else if (!document.getElementById("pointCategory").value.match(regex)) {
    return alert("The category must consist of normal letters!");
    } else if (document.getElementById("pointName").value == "") {
    return alert("You need to choose a name!");
    } else if (!document.getElementById("pointName").value.match(regex)) {
    return alert("The name must consist of normal letters!");
    }
    var lon = document.getElementById("lengdegrader").value;
    var lat = document.getElementById("breddegrader").value;
    var category = document.getElementById("pointCategory").value;
    var name = document.getElementById("pointName").value;
    if (points == null) {
    var content = {"type": "FeatureCollection", "features": []}
    var newPoint = {"type": "Feature", "geometry": {"type": "Point", "coordinates": [lon, lat]}, "properties": {"category": category, "name": name}};
    content.features.push(newPoint);
    points = L.geoJSON(content).bindPopup(function(point) {return "<b>" + point.feature.properties.category + "</b>" + "<br>" + point.feature.properties.name});
    points.addTo(map);
    pointsExists();
    } else {
    var newPoint = {"type": "Feature", "geometry": {"type": "Point", "coordinates": [lon, lat]}, "properties": {"category": category, "name": name}};
    var content = points.toGeoJSON();
    content.features.push(newPoint);
    map.removeLayer(points);
    points = L.geoJSON(content).bindPopup(function(point) {return "<b>" + point.feature.properties.category + "</b>" + "<br>" + point.feature.properties.name});
    points.addTo(map);
    }
    document.getElementById("pointCategory").value = "";
    document.getElementById("pointName").value = "";
    closeBox("makeNewPointBox");
    }
    function handleDefaultPoints() {
    if (points != null) {
    if (map.hasLayer(points)){
    document.getElementById("examplePoints").style.display = "inline-block";
    document.getElementById("loadPoints").style. display = "inline-block";
    document.getElementById("savePoints").style.display = "none";
    document.getElementById("fileName").style.display = "none";
    document.getElementById("save").style.display = "none";
    document.getElementById("removePoints").style.display = "none";
    if (isVoronoi) {
    voronoi();
    }
    if (isTIN) {
    TIN();
    }
    if (isHeat) {
    heatmap();
    }
    // Fjerner punktene:
    map.removeLayer(points);
    points = null;
    closeBox('loadPointsBox')
    }
    } else {
    pointsExists();
    // Legger til alle punktene fra default-fila og setter på en popup med info-tekst:
    fetch("javascript/exampleData/points.geojson").then(function(response) {
    return response.json();
    }).then(function(data) {
    points.addData(data).bindPopup(function(point) {return "<b>" + point.feature.properties.category + "</b>" + "<br>" + point.feature.properties.name});
    })
    //points = L.geoJSON(NTNU_points).bindPopup(function(point) {return `<b>${point.feature.properties.category}</b><br>${point.feature.properties.name}`});
    // Legger til nye punkt-markører i kartet:
    points.addTo(map);
    closeBox('loadPointsBox')
    }
    }
    function loadPoints() {
    document.getElementById("fileInput2").click();
    }
    document.getElementById("fileInput2").addEventListener("change", () => {
    var selectedFile = document.getElementById("fileInput2").files[0];
    if (selectedFile != null) {
    document.getElementById("fileInput2").value = "";
    var read = new FileReader();
    read.readAsDataURL(selectedFile);
    var newLayer = L.geoJSON();
    read.onloadend = function() {
    fetch(read.result).then(function(response) {
    return response.json();
    }).then(function(data) {
    newLayer.addData(data).bindPopup(function(point) {return "<b>" + point.feature.properties.category + "</b>" + "<br>" + point.feature.properties.name});
    })
    }
    }
    points = newLayer;
    points.addTo(map);
    pointsExists();
    closeBox('loadPointsBox');
    })
    function pointsExists() {
    document.getElementById("examplePoints").style.display = "none";
    document.getElementById("loadPoints").style. display = "none";
    document.getElementById("savePoints").style.display = "inline-block";
    document.getElementById("fileName").style.display = "inline-block";
    document.getElementById("save").style.display = "inline-block";
    document.getElementById("removePoints").style.display = "inline-block";
    }
    function saveToFile() {
    var regex = /^[a-zA-Z_0-9]+$/;
    if (document.getElementById("fileName").value == "") {
    return alert("You need to choose a name!");
    } else if (!document.getElementById("fileName").value.match(regex)) {
    return alert("The category must consist of normal letters!");
    }
    var geoJSON = points.toGeoJSON();
    var fileName = document.getElementById("fileName").value;
    var file = fileName + ".geojson";
    saveAs(new File([JSON.stringify(geoJSON)], file, {
    type: "text/plain;charset=utf-8"
    }), file);
    document.getElementById("fileName").value = "";
    }
    javascript/tin.js
    + 14
    − 9
    View file @ 545affa7
    ......@@ -2,17 +2,22 @@
    var isTIN = false // Vises TIN'et i kartet?
    // Selve TIN'et:
    var TINPolygons = turf.tin(NTNU_points.toGeoJSON());
    var TINGeoJSON = L.geoJSON(TINPolygons, {style: {"color": "orangered"}});
    var TINPolygons = null;
    var TINGeoJSON = null;
    // Funksjon for å slå av og på TIN'et:
    function TIN() {
    if (isTIN) {
    map.removeLayer(TINGeoJSON);
    isTIN = false;
    } else {
    TINGeoJSON.addTo(map);
    isTIN = true;
    if (points != null) {
    if (isTIN && TINGeoJSON != null) {
    map.removeLayer(TINGeoJSON);
    isTIN = false;
    } else {
    // Selve TIN'et:
    TINPolygons = turf.tin(points.toGeoJSON());
    TINGeoJSON = L.geoJSON(TINPolygons, {style: {"color": "orangered"}});
    TINGeoJSON.addTo(map);
    isTIN = true;
    }
    }
    }
    javascript/voronoi.js
    + 43
    − 14
    View file @ 545affa7
    ......@@ -2,21 +2,50 @@
    var isVoronoi = false; // Vises voronoi-diagrammet i kartet?
    // Avgrensning for voronoi-diagrammet
    var options = {
    bbox: [10.3175248, 63.3911153, 10.5242766, 63.4570029]
    };
    // Selve voronoi-diagrammet:
    var voronoiPolygons = turf.voronoi(NTNU_points.toGeoJSON(), options);
    var voronoiGeoJSON = L.geoJSON(voronoiPolygons, {style: {"color": "orange"}});
    var voronoiPolygons = null;
    var voronoiGeoJSON = null;
    function voronoi() { // Skrur av og på voronoi-diagrammet i kartet
    if (isVoronoi) {
    map.removeLayer(voronoiGeoJSON)
    isVoronoi = false;
    } else {
    voronoiGeoJSON.addTo(map);
    isVoronoi = true;
    if (points != null) {
    if (isVoronoi && voronoiGeoJSON != null) {
    map.removeLayer(voronoiGeoJSON)
    isVoronoi = false;
    } else {
    // Avgrensning for voronoi-diagrammet
    var [minlon, minlat, maxlon, maxlat] = findMinMax();
    var options = {
    bbox: [minlon, minlat, maxlon, maxlat]
    };
    // Selve voronoi-diagrammet:
    voronoiPolygons = turf.voronoi(points.toGeoJSON(), options);
    voronoiGeoJSON = L.geoJSON(voronoiPolygons, {style: {"color": "orange"}});
    voronoiGeoJSON.addTo(map);
    isVoronoi = true;
    }
    }
    }
    function findMinMax() {
    var [minlon, minlat, maxlon, maxlat] = [99, 99, -99, -99];
    for (feature in points.toGeoJSON().features) {
    if (points.toGeoJSON().features[feature].geometry.coordinates[0] < minlon) {
    minlon = points.toGeoJSON().features[feature].geometry.coordinates[0];
    }
    if (points.toGeoJSON().features[feature].geometry.coordinates[0] > maxlon) {
    maxlon = points.toGeoJSON().features[feature].geometry.coordinates[0];
    }
    if (points.toGeoJSON().features[feature].geometry.coordinates[1] < minlat) {
    minlat = points.toGeoJSON().features[feature].geometry.coordinates[1];
    }
    if (points.toGeoJSON().features[feature].geometry.coordinates[1] > maxlat) {
    maxlat = points.toGeoJSON().features[feature].geometry.coordinates[1];
    }
    }
    return [minlon - 0.5, minlat - 0.5, maxlon + 0.5, maxlat + 0.5];
    }
    0% or .
    You are about to add 0 people to the discussion. Proceed with caution.
    Finish editing this message first!
    Please register or to comment