Borehole Dummy Data

100%

Borehole Dummy Data - Areachart

✓ Published1🌍 Public

Last edited Sep 17, 2019

Created on Sep 12, 2018

Forked from Borehole Dummy Data - Linechart

This visualization displays weekly GSI borehole water levels as a filled area chart, with date on the x-axis and depth in meters below ground level on the y-axis. The chart uses d3.area with curveBasis to create a smooth line and fills the area beneath it in steelblue, while translucent red circles mark individual data points. Mouseover interactions trigger a tooltip showing the date and depth value. The data is loaded from a CSV file using d3.csv, with dates parsed via d3.timeParse and scales created using d3.scaleTime and d3.scaleLinear. Both axes are rendered with d3.axisLeft and d3.axisBottom.

AI-generated description

This is dummy data and will be used as a template to represent GSI Borehole data in the future.

MIT Licensed

Similar vizzes

Loading thumbnail…

Borehole Dummy Data - Areachart

This visualization uses D3 v5 to plot borehole depth measurements over time as an interactive scatter plot. It displays dummy data approximating future GSI borehole data, with depth on the y-axis and formatted dates on the x-axis. The chart applies `d3.scaleLinear` for both axes, `d3.axisLeft` and `d3.axisBottom` for tick marks, and renders semi-transparent red circles via SVG. The data is loaded from an external CSV file using `d3.csv` and parsed with `d3.timeParse`.

Zzren2

93% match

Loading thumbnail…

Borehole Dummy Data - Areachart

This visualization plots borehole depth over time using a scatter plot with red, semi-transparent circles. The chart displays date on the x-axis and depth on the y-axis, with rotated date labels and a title. Built with D3 v5, it uses `scaleLinear`, `axisBottom`, `axisLeft`, and `extent` to compute scales and axes. Data is loaded from a CSV file via `d3.csv`, and dates are parsed using `timeParse` with the format "%d/%m/%Y".

SShane Carey

91% match

Loading thumbnail…

This visualization displays weekly water level measurements from a GSI borehole, plotting depth against date as red scatter points on an SVG canvas. The data is loaded from a CSV file via d3.csv, with dates parsed using timeParse and scales built with scaleTime and scaleLinear. Axes are rendered through axisLeft and axisBottom, including rotated date labels and gridlines, while the title and axis labels are explicitly positioned. The chart uses D3 v5 and demonstrates a template for future borehole data visualization.

SShane Carey

91% match

Loading thumbnail…

Borehole Dummy Data - Linechart

A line chart visualizes weekly water-level measurements in a borehole, plotting depth against date and including a red semi-transparent dot for each data point. Hovering over a dot reveals a tooltip with the exact date and depth value. The chart is built with D3 v5, using `scaleTime`, `scaleLinear`, `line`, `axisLeft`, and `axisBottom` to render the SVG. Data is loaded from a CSV file via `d3.csv`, with dates parsed using `timeParse` and formatted with `timeFormat`.

SShane Carey

87% match

Loading thumbnail…

Borehole

This visualization displays borehole data as a stacked bar chart, mapping geological layers along the x-axis and their depth on the y-axis. The chart uses a single band scale for the categorical layer, with a linear scale for depth, rendering black rectangular bars via SVG. Built with D3 v5, it loads the dataset from a CSV file, computes scales and axes dynamically, and binds data to rect elements. The example demonstrates basic data loading, scaling, and SVG bar rendering without interactions or responsive updates.

Ggsigroundwater

82% match

Loading thumbnail…

Borehole Dummy Data with menue

This interactive scatter plot displays dummy borehole data, showing water depth over time with a dropdown menu to change the x-axis variable. The visualization uses d3.csv to load data, d3.scaleTime and d3.scaleLinear for axes, and d3.axisLeft/axisBottom for rendering ticks. A custom dropdownMenu component, built with D3 selections, lets users switch between date, temperature, and other columns. The scatterPlot module renders red circles with SVG, including formatted date ticks and axis labels, supporting future GSI borehole data visualization needs.

SShane Carey

81% match

Loading thumbnail…

Borehole Dummy Data with menue

This interactive scatter plot displays borehole dummy data, allowing users to compare two variables selected from dropdown menus. The visualization uses D3 v5 with an animated scatter plot that transitions circles from the center to their positions over two seconds. The code implements a reusable dropdownMenu component and scatterPlot module, utilizing d3.scaleLinear, d3.extent, d3.axisLeft, and d3.axisBottom. Data is loaded from an external CSV file, with Depth, Date, and Temp columns parsed from strings to proper data types.

SShane Carey

76% match

Loading thumbnail…

Stacked Borehole

This example visualizes a geological borehole as a vertical stacked bar chart, showing distinct subsurface layers including Topsoil, Peat, Till, and Sandstone, along with a blue line indicating the water table. Depth ranges appear dynamically in a tooltip on mouseover, providing context for each layer. The visualization uses D3 v5’s `select` API to append SVG shapes and text, and implements custom tooltip behavior via D3 transitions. Layer rectangles are colored to represent different materials, and the water level is marked with two blue lines, creating a simple cross-section of the earth.

SShane Carey

75% match