SedDataExp - Sediment Data Explorer

Sediment Data Explorer - reads and displays physical/chemical sediment analysis data primarily from UK MMO marine license applications and also from data mined by CEFAS from the MMO licenses (currently between 1998 and 2019).

Instructions for Using the Sediment Data Explorer

These instructions were generated by Google Notebook based on the source code, which describe some of the functionality of the Sediment Data Explorer. This was a quick way to produce helpful instructions, fuller instructions are planned.

To use the Sediment Data Explorer, follow these steps:

1. Open the Sediment Data Explorer: Open the following URL in a web browser: https://steps39.github.io/SedDataExp/SedimentDataExplorer.html.
2. Import Data:

• Import Sediment Chemistry Data:
  • Option 1: Using Files: Click the "Choose Files" button next to the "Select sediment data files" label and select the Excel (.xlsx) files containing your sediment chemistry data.
  • Option 2: Using URLs: Enter the URLs of the Excel (.xlsx) files separated by commas in the text box next to the "Or enter URLs" label and click the "Import Data" button. The source code assumes that the URLs link directly to Excel files.
• Import Location Data (Optional):
  • Option 1: Using Files: Click the "Choose Files" button next to the "Select location data file" label and select the Excel (.xlsx) file containing your sampling location data. This file should have a specific format: column 1 should contain the sample name, column 2 should have the latitude in decimal degrees, and column 3 should have the longitude in decimal degrees.
  • Option 2: Using URLs: Enter the URLs of the location files separated by commas in the text box next to the "Or enter URLs" label and click the "Import Locations" button.
• Import Chemical Information Data (Optional):
  • Option 1: Using Files: Click the "Choose Files" button next to the "Select chemInfo data files" label and select the Excel (.xlsx) files containing your chemical information data.
  • Option 2: Using URLs: Enter the URLs of the chemical information files separated by commas in the text box next to the "Or enter URLs" label and click the "Import chemInfo" button.

3. Select Data to Display:

• Chart Types: Use the checkboxes to select which types of charts to display (e.g., Physical Data, Trace metal data, PAH data).
• Subcharts: Choose specific subchart types for chemical data, such as sample group, chemical group, or position.
• Radar Plots: Select the type of data to display on the radar plot (e.g., None, PAH data, PCB data).
• Chemical Selection: Click the "Select Chemicals" button to open a modal window where you can choose specific chemicals to include or exclude from the charts. You can filter chemicals using the "Contains text" input field and apply your selection by clicking the "Apply Chemical Filter" button.
• Dataset Selection: Click the "Select Datasets" button to open a modal window with checkboxes for each dataset (date and application number). Selecting datasets here will limit the displayed data to only the chosen datasets.
• Sample Selection: Click the "Select Samples" button to open a modal window where you can choose specific samples to include or exclude from the charts. You can filter samples by:
  • Text: Enter text in the "Contains text" field to show only samples whose names include that text.
  • Sampling Depth: Enter minimum and maximum sampling depths to filter samples based on their depth range.
  • Centre Coordinates and Distance: Provide latitude, longitude, and distance to display samples within that distance from the specified coordinates.

4. View Charts and Map:

• Charts: The selected charts will be displayed in the "Chart Area." You can interact with the charts by zooming, panning, and hovering over data points to see more information.
• Map: The map will display markers for each sample, colour-coded by the data file. Hovering over a marker will highlight all samples within a 10m radius on the map and in the charts. Click on a marker to open a popup window with a radar chart showing the concentrations of different chemicals for that sample.

5. Export Data:

• Snapshot of Current View:
  • Save: Enter a file name in the "Snapshot filename" field and click the "Save Snapshot" button to download a file containing the currently selected data and display settings. This snapshot can be used to reload the same data and view later.
  • Load from File: Click the "Choose File" button next to the "Select snapshot file" label, choose the snapshot file, and click the "Load Snapshot" button.
  • Load from URL: Enter the URL of the snapshot file in the "Snapshot file URL" field and click the "Load Snapshot URL" button.
• Charts as Images: Click the "Export Charts" button to download each chart as a PNG image. The file names will include the date and time of export, the chart type, and the sheet name.
• Map as Image: While not explicitly described in the source code, there is a comment indicating that functionality to export the map as an image may be present or planned. Look for an "Export Map" button or similar functionality in the interface.

6. Clear Data: Click the "Clear Data" button to remove all imported data and reset the display.

Please note that these instructions are based on a limited understanding of the Sediment Data Explorer derived from the provided source code. You may discover additional features and functionality while using the tool.

Sediment Data Explorer - Table of Contents - Generated by Google Notebook App

This table of contents outlines the functionality of a web application, "Sediment Data Explorer," built using JavaScript and various libraries, designed to visualize and analyze sediment sample data.

Functionality:

The application provides an interface for users to upload sediment sample data files, visualize this data on maps and charts, and perform basic statistical analysis. It includes features to select and filter data, as well as highlight specific data points across various visualizations.

Source Code Structure:

The table of contents is organized according to source code files, offering an overview of the application's functionality through the lens of its code.

1. SedimentDataExplorer.js

This file contains the main JavaScript file that orchestrates the application.

Global Variables and Initialization: Declares global variables like map for Leaflet map, sampleMeasurements for storing measurement data, and actionLevels for holding environmental safety thresholds. Initializes libraries such as Chart.js for visualizations and os-transform.js for coordinate conversions. Data Import Functions: Defines functions like importChemInfo, importLocations, and importData to handle the upload and parsing of data from Excel files or URLs. These functions use the XLSX library to process spreadsheets and store the extracted data in appropriate JavaScript objects. Data Processing Functions: Includes functions such as extractDataFromSheet to process the data extracted from individual sheets within uploaded spreadsheets. This function identifies key information like sampling dates, measurement units, and analytical data. Additional functions like cleanChemicalString and pahPostProcess handle data cleaning and specific calculations for PAH data. Data Visualization Initialization: Sets up the initial display of the application, including creating canvases for charts (createCanvas), clearing existing visualizations (clearCanvasAndChart), and managing the display of uploaded file information (toggleFileDisplay).

2. sdeCharts.js

This file handles the creation and manipulation of charts within the application.

Chart Data Preparation Functions: Contains functions like ringFractionsForPAHs, organochlorineDataForChart, and metalDataForChart that transform and structure the raw sample data into formats suitable for Chart.js. This involves calculations like ring size fractions, data normalization, and grouping by chemical types. Color Gradient Generation: Defines a colorGradient function to generate color gradients for use in charts, allowing for visual representation of data ranges. Chart Creation and Display Functions: Includes functions like displayPSDHighlight, displayAnyChart, displayMetals, and displayGorhamTest to create specific chart types using the Chart.js library. These functions configure various aspects of the charts, such as axes, titles, legends, and annotations, including environmental safety thresholds. Chart Interaction Functions: Defines functions for handling user interaction with the charts. For example, clickableScales facilitates highlighting data points across multiple charts, getRandomColor provides random colors for visual distinctions, and functions like chartLine and chartLabel add annotations and visual cues to charts.

3. sdeDataUtilities.js

This file contains utility functions for data processing and calculations.

Data Summarization Function: Defines calculateSums function for calculating sums of specific chemical concentrations within sample data. This function groups and summarizes data by sample and chemical type, facilitating the generation of summary statistics. PAH Data Processing Function: Includes pahPostProcess for performing post-processing calculations specific to PAH data. Calculates various PAH ratios, such as "IP/(IP+B(ghi)P)" and "BaA/(BaA+Chr)", and determines sums based on ring structures and environmental standards like Dash and EPS sums.

4. sdeDredgeData.js

This file focuses on handling data specific to dredging activities.

Dredge Data Structures and Variables: Defines variables and data structures like CEFASdata and ddLookup to store and access data related to dredging, including chemical names, corresponding sheet names, and measured concentrations. Dredge Data Import and Processing: Includes functions such as importDredgeData to import dredging data from uploaded files or URLs. Functions like loadDredgeData and processDDExcelData handle the loading and parsing of this data, filtering it based on user-defined criteria like date ranges, geographical locations, and license numbers.

5. sdeMaps.js

This file manages the map functionalities of the application.

Map Initialization and Configuration: Defines functions for initializing the Leaflet map (sampleMap), setting the view to specific coordinates and zoom levels, and adding tile layers like OpenStreetMap. Marker Creation and Management: Includes functions for generating markers representing individual samples on the map. Utilizes custom marker icons based on data attributes, sets up popups to display sample information, and implements highlighting functionality for selected samples. Coordinate Parsing and Geospatial Calculations: Defines functions for parsing coordinates from various formats, including latitude/longitude, Degrees Minutes Seconds (DMS), and British National Grid references. Incorporates functions like haversineDistance to calculate distances between geographical coordinates, facilitating spatial analysis and filtering.

6. sdeSelections.js

This file handles user selections and data filtering.

Geospatial Utility Functions: Defines functions like haversineDistance to calculate distances between geographical coordinates, enabling features like filtering data within a specific radius from a central point. Includes a toRadians function for converting degrees to radians. Sample Selection and Filtering: Includes functions to manage user selections of samples. The selectSamples function identifies selected samples from checkboxes and creates a subset of the data (selectedMeas) based on the selected samples, preparing the data for further analysis and visualization.

7. sdeTables.js

This file focuses on generating HTML tables for displaying sample information.

HTML Table Generation Function: Defines a function generateSampleInfoTable to dynamically create an HTML table from the sampleInfo data object. The function iterates through the object and builds rows and cells for the table, allowing for structured display of sample details such as location, depth, and area.

Conclusion:

The Sediment Data Explorer is a comprehensive web application designed for visualizing and analyzing sediment data. It leverages several JavaScript libraries to provide a user-friendly interface for importing data, creating interactive maps and charts, and performing basic statistical analysis. This table of contents provides an overview of the application's functionality based on the code.