Skip to main content
SimilarExport ZIP
100%

Refactored Transplant Bar

✓ Published1🌍 Public
GGary Ditsch
Last edited Mar 1, 2021
Created on Mar 1, 2021
Forked from Transplant Bar

A horizontal bar chart ranks the first five hospitals by total kidney transplants performed, combining counts of deceased and living donors. The visualization uses React to render SVG elements, with D3 v6 handling scales and axes: `scaleBand` positions hospital names on the y-axis while `scaleLinear` maps total counts to bar widths. Data loads from a CSV file via D3’s `csv` parser, and custom Axis components generate tick labels.

AI-generated description

##Transplant Data

MIT Licensed

Similar vizzes

Loading thumbnail…

Style Refactored Transplant Bar

This bar chart displays kidney transplant totals by hospital, using horizontal bars to compare values across institutions. The visualization is built with React and D3 v6, leveraging `scaleBand` and `scaleLinear` for axes, while data is loaded from a CSV via `useData` hook. The chart filters to hospitals with at least 250 total transplants, with bars colored teal and including hover tooltips. SVG rendering handles marks and axis ticks, with styled gridlines and labels for readability.

GGary Ditsch
94% match
Loading thumbnail…

Transplant Bar

This visualization displays the total number of kidney transplants (combining deceased and living donors) for the top 20 hospitals from a CSV dataset. It uses a horizontal bar chart built with React and D3 v6, employing `scaleBand` for the categorical hospital names on the y-axis and `scaleLinear` for the numeric count on the x-axis. The SVG rendering includes axis ticks and gridlines, with bar widths proportional to transplant totals. Data is loaded asynchronously via `d3.csv` and parsed in a row function before being rendered.

GGary Ditsch
93% match
Loading thumbnail…

Scatterplot Transplant Data

A scatterplot displays the relationship between the number of deceased and living organ donors across US hospitals, with each circle representing a hospital and hovering reveals its name. The visualization uses React with D3 v6 for data loading and scales, specifically `d3.csv` to fetch the kidney transplant dataset and `scaleLinear` for both axes. SVG rendering handles the marks and axes, with gridlines drawn from `d3.ticks()` through custom `AxisBottom` and `AxisLeft` components. The chart encodes the two donor categories on separate linear scales, with axes labeled accordingly.

GGary Ditsch
79% match
Loading thumbnail…

Refactored Bar Chart

A horizontal bar chart displays the number of cancer patients for ten Indian states and union territories in 2016, using the `csv` loader from D3 v6 to fetch the dataset. The React app renders SVG bars with `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis, while custom `AxisBottom` and `AxisLeft` components generate tick marks and labels. The bar widths encode patient counts, and the chart is static with no interactivity.

Yyastika
77% match
Loading thumbnail…

Fork of Bar_Plot

This visualization is a horizontal bar chart showing the number of patients received by the top 10 hospitals in 2024. The bars, rendered as steelblue rectangles, display the patient count for each hospital, with hospital names listed along the y-axis and a scaled x-axis showing patient numbers with tick marks. The code uses React for component structure and state management, with d3.csv to load data from a remote CSV file, d3.scaleBand for the y-axis categories, and d3.scaleLinear for the x-axis values, alongside d3.axisBottom and d3.axisLeft helpers. The visualization is built as a single SVG within a React app, with margins and dimensions hardcoded.

Llathabemanadham@my.unt.edu
76% match
Loading thumbnail…

Refactored Bar Chart

This horizontal bar chart displays the population of five countries using D3’s `scaleBand` and `scaleLinear` utilities within a React component. The SVG rendering separates axes and marks into reusable modules (`AxisBottom`, `AxisLeft`, `Marks`), while `useData` fetches a CSV via D3’s `csv` and formats values with `format(".2s")`. The visualization retrieves data from a GitHub gist, applying a Poppins font and a teal fill to the bars.

LLewis Ward
75% match
Loading thumbnail…

Fork of Reusable J.I. Bar chart (with menu) - TEST2

A stacked horizontal bar chart visualizes donation activities and amounts across categories, allowing interactive switching between total, COVID-19, and other-purpose views via a menu. The chart presents paired bars for actions and monetary sums, with color-coded segments for COVID-19 and other causes. It uses React with D3.v6 functions like scaleBand and scaleLinear for axes and scales, rendering SVG elements. Data is loaded from a CSV file, and user clicks trigger state updates to change displayed attributes and zoom scales.

Kkragovic
74% match
Loading thumbnail…

Refactored Bar Chart

A horizontal bar chart displays population data for ten countries in 2020, loaded from a CSV file hosted on GitHub. The React app uses a custom hook with `d3.csv` to fetch and parse the data, storing it in state. SVG rendering builds the visualization from reusable components: `AxisBottom` creates the linear population scale, `AxisLeft` labels the categorical country bands, and `Marks` draws rectangles using `scaleBand` and `scaleLinear`. The chart updates upon data loading.

Bbakstorage00001
74% match