Skip to content

Commit

Permalink
Add map element & update landing page
Browse files Browse the repository at this point in the history
  • Loading branch information
KoalaGeo committed May 2, 2023
1 parent 8872120 commit 2dbe58e
Show file tree
Hide file tree
Showing 3 changed files with 83 additions and 44 deletions.
51 changes: 51 additions & 0 deletions app/static/js/map.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
mapLink =
'<a href="http://www.esri.com/">Esri</a>';

wholink =
'i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community';

var esri = L.tileLayer(
'http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
attribution: '&copy; '+mapLink+', '+wholink,
maxZoom: 18,
});

var positron = L.tileLayer(
"https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png", {
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>',
});

var wmsLayer = L.tileLayer.wms('https://map.bgs.ac.uk/arcgis/services/AGS/AGS_Export/MapServer/WMSServer?', {
layers: 'Boreholes',
format: 'image/png',
transparent: true,
attribution: "AGS Data from British Geological Survey",
});

var agsboreholes = L.featureGroup
.ogcApi("https://ogcapi.bgs.ac.uk/", {
collection: "agsboreholeindex",
onEachFeature: function (feat, layer) {
var properties = feat.properties;
var popupContent = "<b>AGS Borehole Information</b><br><hr>" +
"<b>BGS LOCA ID: </b>" + properties.bgs_loca_id + "<br>" +
"<b>Depth (m): </b>" + properties.loca_fdep + "<br>" +
"<b>Project Name: </b>" + properties.proj_name + "<br>" +
"<b>Project Engineer: </b>" + properties.proj_eng + "<br>" +
"<b>Project Contractor: </b>" + properties.proj_cont + "<br>" +
"<b>Original LOCA ID: </b>" + properties.loca_id + "<br>" +
"<b>AGS Graphical Log: </b>" + "<a href=" + "https://agsapi.bgs.ac.uk/ags_log/?bgs_loca_id=" + properties.bgs_loca_id + " target=" + "_blank" + ">View</a>" + "<br>" +
"<b>AGS Submission Record (raw data): </b>" + "<a href=" + properties.dad_item_url + " target=" + "_blank" + ">View</a>" + "<br>";
layer.bindPopup(popupContent);
},
});

var map = L.map("map", {
center: [54.093409, -2.89479],
zoom: 6,
layers: [esri, positron, wmsLayer, agsboreholes]
});

agsboreholes.once("ready", function (ev) {
map.fitBounds(agsboreholes.getBounds());
});
42 changes: 5 additions & 37 deletions app/templates/_base.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,24 +19,14 @@
<link rel="stylesheet" href="/static/css/htmlView.css">
<link rel="stylesheet" href="https://npmcdn.com/[email protected]/dist/leaflet.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" crossorigin=""/>

<script type="text/javascript" src="//resources.bgs.ac.uk/webapps/resources/js/jquery.min.js"></script>
<script type="text/javascript" src="//resources.bgs.ac.uk/webapps/resources/js/main.js"></script>
<script type="text/javascript" src="/static/js/htmlView.js"></script>
<script type="text/javascript" src="https://unpkg.com/leaflet/dist/leaflet-src.js" crossorigin=""></script>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js" integrity="sha256-WBkoXOwTeyKclOHuWtc+i2uENFpDZ9YPdf5Hf+D7ewM=" crossorigin=""></script>

<link
rel="stylesheet"
href="https://unpkg.com/leaflet/dist/leaflet.css"
crossorigin=""
/>
<script
src="https://unpkg.com/leaflet/dist/leaflet-src.js"
crossorigin=""
></script>

<script src="/static/js/Leaflet.FeatureGroup.OGCAPI.js"></script>


<!-- Google Tag Manager -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-J768KTXMCP"></script>
Expand Down Expand Up @@ -478,30 +468,8 @@ <h3>Policies &amp; legal</h3>
});
}
</script>
<script>
var map = L.map("map", {});

var positron = L.tileLayer(
"https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png",
{
attribution:
'&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>',
}
).addTo(map);

var trees = L.featureGroup
.ogcApi("https://ogcapi.bgs.ac.uk/", {
collection: "agsboreholeindex",
onEachFeature: function (feat, layer) {
layer.bindPopup(Object.entries(feat.properties).join("<br>"));
},
})
.addTo(map);

trees.once("ready", function (ev) {
map.fitBounds(trees.getBounds());
});
</script>
<script src="/static/js/Leaflet.FeatureGroup.OGCAPI.js"></script>
<script src="/static/js/map.js"></script>

</body>
</html>
34 changes: 27 additions & 7 deletions app/templates/landing_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,13 @@
<section id="identification">
<h1>AGS4 File Utilities Tool and API</h1>
<br>
<p>This tool and associated <a href="/docs/">API</a> allow schema validation, data validation and conversion of your <a href="https://www.ags.org.uk/data-format/">AGS files</a>. Files are not saved or stored by this tool.</p>
<h2>Tools</h2>
<ul>
<p>This tool and associated <a href="/docs/">API</a> allow schema validation, data validation and conversion of your <a href="https://www.ags.org.uk/data-format/">AGS files</a>. Files are not saved or stored by this tool. Also included here are links to other AGS data related BGS services and applications</p>
<h2>Tools and Utilities</h2>
<ul>
<li><a href="#validator">AGS Schema & Data Validator</a></li>
<li><a href="#deposit">AGS Data Submission</a></li>
<li><a href="#converter">File Conversion .ags &#8596; .xlsx</a></li>
<li><a href="#ags_log">AGS Log Viewer</a></li>
<li><a href="#ags_data">AGS Data Discovery</a></li>
<li><a href="#openapi">API Documentation</a></li>
</ul>
</section>
Expand Down Expand Up @@ -131,6 +132,18 @@ <h4>Future data validation rules: (Coming Soon)</h4>
<br>
<br>
<br>
<section id="deposit">
<br>
<h2>AGS Data Submission</h2>
<br>
<p>Deposit your AGS data with the National Geoscience Data Centre (NGDC). Please validate your files prior to submission. For further details please see <a href="https://www.bgs.ac.uk/technologies/geotechnical-data-services/">here</a></p>
<div class="btn-wrap">
<a href="http://transfer.bgs.ac.uk/ingestion" class="button primary-background button btn-icon-arrow-right-white before " style="width: 165.226px;">Deposit data</a></div>
<br>
</section>
<br>
<br>
<br>
<section id="converter">
<h2>AGS Converter</h2>
<div class="tooltip"><p>Convert .ags file(s) to/from .xlsx.</p>
Expand All @@ -156,11 +169,18 @@ <h2>AGS Converter</h2>
</section>
<br>
<br>
<div id="map" style="width: 800px; height: 600px"></div>
<section>

</section>
<br>
<br>
<section id="ags_log">
<h2>AGS Log Viewer</h2>
<section id="ags_data">
<h2>AGS Data Discovery</h2>
<br>
<p>Use the map below to find AGS data, click on the markers to find borehole information and links to graphical logs and the original submitted data.</p>
<br>
<div id="map" style="width: 800px; height: 600px"></div>
<br>
<p>Submit BGS LOCA ID to view log from NGDC held AGS data. Find BGS LOCA ID on <a href="https://mapapps2.bgs.ac.uk/geoindex/home.html?layer=AGSBoreholes">GeoIndex Web Viewer</a> or by querying the <a href="https://ogcapi.bgs.ac.uk/collections/onshoreboreholeindex/items">BGS OGCAPI-Features Server</a></p>
<br>
<br>
Expand Down

0 comments on commit 2dbe58e

Please sign in to comment.