Med Data - LineChart

100%

Med Data - LineChart

✓ Published2🌍 Public

Last edited Jun 15, 2021

Created on Apr 21, 2021

This chart displays calcium concentration levels for a single patient over time. A red vertical line indicates the currently selected date, and hovering over the chart triggers a tooltip that shows the exact date and value. The visualization is built with D3 version 5, using `d3.line`, `d3.scaleTime`, `d3.scaleLinear`, and `d3.axisBottom`/`d3.axisLeft` to render the axes and line within an SVG container. Data is loaded from a CSV file containing multiple medical markers, though only the calcium series is displayed.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

InteractiveYearLineChart

An interactive line chart displays blood calcium values over time for a single patient, with a vertical red line marking a selected year. Users hover over the chart to see a tooltip with the exact date and value, while a brush allows zooming into time ranges. The chart uses d3.scaleTime, d3.line, d3.brush, and d3.bisector on data loaded from a CSV file. SVG rendering and mouse events drive the interactions, with a dashed line and tooltip circle updating dynamically.

Ppplomith

83% match

Loading thumbnail…

MedData - TimeLine

This interactive timeline visualizes a patient’s diastolic pressure over time, rendered as a red area chart with a smoothed line. Users can hover over the chart to update a vertical selection line, with a tooltip displaying the date and value. The visualization is built with D3 v5, using `scaleTime`, `scaleLinear`, `line`, and `area` generators, along with a brush for zooming. Data is loaded from a CSV file and filtered by the selected metric.

Ppplomith

81% match

Loading thumbnail…

ZoomInteractiveLineChart

This interactive line chart visualizes calcium measurement values over time for a single patient, using a smooth curve to connect data points from a CSV file. Users can zoom into the timeline using a brush gesture, which updates the x-axis domain and redisplays the data at the new scale. The chart includes a tooltip that appears on mouseover, showing the date and value at the cursor position, indicated by a red circle on the line. The visualization is built with D3 v5, using SVG rendering, scales for time and linear axes, a line generator with curve basis, and a brush for zoom interactions.

Ppplomith

81% match

Loading thumbnail…

Fork of MedData - TimeLine 222

A line chart displays a single patient's diastolic blood pressure readings over time from 2010 to 2017, using data from a CSV file. The chart features a smoothed red line with a semi-transparent area fill beneath it, along with axes and a tooltip. Built with D3 v5, the visualization uses `scaleTime`, `scaleLinear`, `line`, `area`, and `axisBottom`/`axisLeft` to render SVG elements. An interactive zoom and mouse event handlers are included, though the tooltip functionality is partially commented out.

Ppplomith

81% match

Loading thumbnail…

Fork of MedData - TimeLine

This interactive line chart visualizes a patient's diastolic pressure over time, using a red line and a semi-transparent area to encode the data. The visualization, built with D3 v5, supports zooming and panning through a brush interface. A tooltip displays the exact date, name, and value of a data point upon mouse movement. The chart’s axes and interaction are rendered as SVG, with data loaded from a CSV file, allowing viewers to explore the temporal trends in this single vital sign.

AAndrew Babilonia

80% match

Loading thumbnail…

Fork of MedData - TimeLine

This timeline chart displays patient medical data over time, specifically tracking diastolic pressure values. The line chart, drawn with SVG, includes an area fill and a brush interaction for zooming. The code uses d3.scaleTime and d3.scaleLinear to map data from the patient1.csv file, while d3.line and d3.area generate the visual elements. A tooltip, though its event handlers are incomplete, is positioned to show date, value, and measurement name on mouse events.

KKamilPodsiadlo

78% match

Loading thumbnail…

LineChart+ColorLegend

A multi-line chart displays patient biomarker values over time, with each line representing a different marker and a color legend identifying them. The visualization uses D3 v5 within a React application, employing `scaleTime` and `scaleLinear` for axes, `line` with `curveBasis` for path generation, and `scaleOrdinal` with `schemeSet1` for colors. Data comes from a CSV file loaded via `d3.csv`, and hovering over a line highlights it while dimming others.

Ppplomith

75% match

Loading thumbnail…

medLC3

The visualization displays patient vital-sign measurements over time, focusing on diastolic pressure as the selected metric. It renders an animated SVG line chart with area fills, where data points are highlighted as circles and paths are clipped to the chart region. Using d3.v5, the implementation leverages `d3.line`, `d3.area`, `d3.nest`, and `d3.scaleTime` to organize and draw the series, with a brush-like tooltip interaction. The source data comes from a local CSV file loaded via `d3.csv`, and the visual includes axis ticks, a legend, and a colored line representing the selected pressure readings.

Ppplomith

75% match