Binod Sapkota

@Binod-Sapkota·2 public vizzes

HTML and D3 test

This example displays a line chart of time-series data, plotting ground motion against time from a local text file. The visualization uses D3.js v6 to load and parse the data, then creates linear scales and SVG axes to map the values. A D3 line generator defines the path, which is rendered as a black stroke on an SVG element within a React-based HTML page. The chart’s dimensions and margins are set explicitly, with the x-axis representing time and the y-axis representing ground motion values.

Jan 22, 2023

Loading thumbnail…

D3 tryout

This example demonstrates a basic time-series line chart using D3 version 6. It plots a single series of date-value pairs from a remote CSV dataset, with a time-scaled x-axis and a linear y-axis. The code uses `d3.csv` to load and parse the data, `d3.timeParse` for date formatting, `d3.scaleTime` and `d3.scaleLinear` for axes, and `d3.line` to generate the SVG path. The visualization renders as a simple steelblue line with axes, using an SVG container created with `d3.select`.

Jan 22, 2023