|
|
Line 1: |
Line 1: |
- | <html>
| |
- | <head>
| |
- | <meta charset="UTF-8"/>
| |
- |
| |
- | <meta name="viewport" content="width=device-width, initial-scale=1" />
| |
- | <title>
| |
- | AlborEx Mission (25-31 May 2014)
| |
- | </title>
| |
- | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.css"/>
| |
- | <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.js"></script>
| |
- | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.fullscreen/1.4.2/Control.FullScreen.min.css">
| |
- | <link rel="stylesheet" href='http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Leaflet/lib/Leaflet.Coordinates-0.1.5.css'>
| |
- | <script type="text/javascript" src='http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Leaflet/lib/Leaflet.Coordinates-0.1.5.min.js'></script>
| |
- | <style type="text/css">
| |
- | #map { height : 450px; }
| |
- | .legend { background : white; line-height : 2em}
| |
- | .legend i { width : 5em; float : left}
| |
- | </style>
| |
- | </head>
| |
- | <body>
| |
- | This map shows the deployments of the AlborEx mission that took place from May 25 to May 31, 2014.
| |
| | | |
- | <h1> Publications </h1>
| |
- |
| |
- | <div style="max-width:600px; word-wrap:break-word;">
| |
- | Pascual, A.; Ruiz, S.; Olita, A.; Troupin, C.; Claret, M.; Casas, B.; Mourre, B.; Poulain, P.-M.; Tovar-Sanchez, A.; Capet, A.; Mason, E.; Allen, J. T.; Mahadevan, A. & Tintoré, J. (2017). A multiplatform experiment to unravel meso- and submesoscale processes in an intense front (AlborEx) Frontiers in Marine Science, 2017, 4. doi:<a href="https://doi.org/10.1002/2014jc010514">10.1002/2014jc010514</a>
| |
- | </div>
| |
- |
| |
- |
| |
- |
| |
- |
| |
- | <div id="map"></div>
| |
- | <script type="text/javascript" src="http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Missions/AlborEx/data/CTD1.js"></script>
| |
- | <script type="text/javascript" src="http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Missions/AlborEx/data/CTD2.js"></script>
| |
- | <script type="text/javascript" src="http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Missions/AlborEx/data/Glider1.js"></script>
| |
- | <script type="text/javascript" src="http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Missions/AlborEx/data/Glider2.js"></script>
| |
- | <script type="text/javascript" src="http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Missions/AlborEx/data/drifters.js"></script>
| |
- | <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.fullscreen/1.4.2/Control.FullScreen.js"></script>
| |
- | <script>
| |
- |
| |
- |
| |
- | var map = L.map('map', {
| |
- | fullscreenControl: true,
| |
- | }).setView([36.9, -0.5], 7);
| |
- |
| |
- | var positron = L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
| |
- | attribution: '©OpenStreetMap, ©CartoDB',
| |
- |
| |
- | });
| |
- |
| |
- | var Esri_OceanBasemap = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer/tile/{z}/{y}/{x}', {
| |
- | attribution: 'Tiles © Esri — Sources: GEBCO, NOAA, CHS, OSU, UNH, CSUMB, National Geographic, DeLorme, NAVTEQ, and Esri',
| |
- | maxZoom: 13
| |
- | }).addTo(map);
| |
- |
| |
- |
| |
- |
| |
- | var baseMaps = {
| |
- | "Positron": positron,
| |
- | "Ocean Base map": Esri_OceanBasemap,
| |
- | };
| |
- |
| |
- | L.control.coordinates({
| |
- | position:"bottomleft",
| |
- | decimals:3,
| |
- | decimalSeperator:".",
| |
- | labelTemplateLat:"Lat: {y}",
| |
- | labelTemplateLng:"Lon: {x}"
| |
- | }).addTo(map);
| |
- |
| |
- |
| |
- | // define rectangle geographical bounds
| |
- | var bounds = [[36.65, -1.], [37.25, 0.25]];
| |
- | var area = L.rectangle(bounds, {
| |
- | color: "#ff7800",
| |
- | weight: 1,
| |
- | fillColor: "#FFFFB3",
| |
- | fillOpacity: 0.1
| |
- | }
| |
- | ).addTo(map);
| |
- |
| |
- | // CTD positions
| |
- |
| |
- | var nCTD1 = CTD1list.length;
| |
- | CTD1 = []
| |
- | CTD1layer = L.layerGroup();
| |
- | for (var i = 0; i < nCTD1; i++) {
| |
- | CT1circle = L.circleMarker(CTD1list[i], {radius: 3}).addTo(map);
| |
- | CTD1.push(CT1circle);
| |
- | CTD1layer.addLayer(CT1circle);
| |
- | }
| |
- | CTD1layer.addTo(map);
| |
- |
| |
- | var nCTD2 = CTD2list.length;
| |
- | CTD2 = []
| |
- | CTD2layer = L.layerGroup();
| |
- | for (var i = 0; i < nCTD2; i++) {
| |
- | CT2circle = L.circleMarker(CTD2list[i], {radius: 3, color: 'red'});
| |
- | CTD2.push(CT2circle);
| |
- | CTD2layer.addLayer(CT2circle);
| |
- | }
| |
- | //CTD2layer = L.layerGroup(CTD2)
| |
- | CTD2layer.addTo(map);
| |
- |
| |
- | // Glider trajectories
| |
- |
| |
- | var glider1Style = {
| |
- | "color": "#4A4A4A",
| |
- | "weight": 4,
| |
- | "opacity": 1.,
| |
- | "dashArray": '2,4',
| |
- | };
| |
- |
| |
- | var glider2Style = {
| |
- | "color": "black",
| |
- | "weight": 4,
| |
- | "opacity": .9,
| |
- | };
| |
- |
| |
- | var drifterStyle = {
| |
- | "color": "black",
| |
- | "weight": .5,
| |
- | "opacity": .9,
| |
- | };
| |
- |
| |
- | var Glider1 = new L.geoJson(glider1, {
| |
- | style: glider1Style
| |
- | }).addTo(map);
| |
- |
| |
- | var Glider2 = new L.geoJson(glider2, {
| |
- | style: glider2Style
| |
- | }).addTo(map);
| |
- |
| |
- | var Drifter = new L.geoJson(drifters, {
| |
- | style: drifterStyle
| |
- | }).addTo(map);
| |
- |
| |
- | var Layer = L.geoJson(null, {
| |
- | style: function(feature) {
| |
- | return { color: 'blue' , weight: 3};
| |
- | }
| |
- | });
| |
- |
| |
- | var imageUrl = 'http://modb.oce.ulg.ac.be/mediawiki/upload/ctroupin/Missions/AlborEx/images/A2014150020500_L2_LAC_SST.png',
| |
- | imageBounds = [[34.75, -6.75], [40., 3.001]];
| |
- | SST = L.imageOverlay(imageUrl, imageBounds, {opacity: 1., autoZIndex: true}).addTo(map);
| |
- | SST.bringToFront()
| |
- |
| |
- | var overlayers = {
| |
- | "Experiment area" : area,
| |
- | "CTD first leg" : CTD1layer,
| |
- | "CTD second leg" : CTD2layer,
| |
- | "Coastal glider": Glider1,
| |
- | "Deep glider": Glider2,
| |
- | "Drifters": Drifter,
| |
- | "SST": SST,
| |
- | };
| |
- |
| |
- | L.control.layers(baseMaps, overlayers, {collapsed:false}).addTo(map);
| |
- |
| |
- |
| |
- | </script>
| |
- | </body>
| |
- | </html>
| |