Group Project Bioinformatics FINAL!!

100%

Group Project Bioinformatics FINAL!!

✓ Published0🌍 Public

Last edited Apr 26, 2018

Created on Apr 26, 2018

This visualization presents a choropleth map of the United States where darker colors indicate higher UFO sighting counts per state, using a logarithmic color scale. Users can click on any state to view its specific signature count. The map is rendered with D3 v3, utilizing `d3.geoPath` and `d3.csv` to load the state geometries and data, with an animated transition on selection. The project also includes parallel coordinates charts for exploring multi-dimensional data like income and mental health metrics.

AI-generated description

https://gist.github.com/4544529 (demo) was my first d3 adventure, where I scraped signatures from a White House petition and showed them as a pie chart.

Here, I show them as a US heat map (based on one of Mike Bostock's map demos). You can click on a state, and see how many signatures came from it.

Darker color means more signatures, but since the numbers range from a few dozens to >4500, the scale is logarithmic. I don't know yet how to use log() interpolators (I promise to learn), so I just did it quick and dirty with linear() and masking tape.

forked from <a href='http://bl.ocks.org/thedod/'>thedod</a>'s block: <a href='http://bl.ocks.org/thedod/4548858'>Clickable US heat-map of petition signature count</a>

forked from <a href='http://bl.ocks.org/Craftbd/'>Craftbd</a>'s block: <a href='http://bl.ocks.org/Craftbd/7af9830ee360cf7103e0f71571d8cfb8'>Group Project Bioinformatics</a>

forked from <a href='http://bl.ocks.org/rubin2ma/'>rubin2ma</a>'s block: <a href='http://bl.ocks.org/rubin2ma/eca7ad72e037a2b879582c3c509350e8'>Group Project Bioinformatics</a>

forked from <a href='http://bl.ocks.org/Craftbd/'>Craftbd</a>'s block: <a href='http://bl.ocks.org/Craftbd/e31ca1eede63f6e51ccaaa3a098d7717'>Group Project Bioinformaticsnew</a>

forked from <a href='http://bl.ocks.org/rubin2ma/'>rubin2ma</a>'s block: <a href='http://bl.ocks.org/rubin2ma/54cad4b4040d20f090212869453e6212'>Group Project Bioinformaticsnew3</a>

forked from <a href='http://bl.ocks.org/scresawn/'>scresawn</a>'s block: <a href='http://bl.ocks.org/scresawn/4ac516e538991f7461ccd5ef90d0f6bd'>Group Project Bioinformatics Final Copy!</a>

forked from <a href='http://bl.ocks.org/rubin2ma/'>rubin2ma</a>'s block: <a href='http://bl.ocks.org/rubin2ma/f0db7c8f92e648135bb7d760ca29880a'>Group Project Bioinformatics Final Copy!</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Group Project Bioinformatics Final Copy!1

An interactive United States choropleth map and parallel coordinates plot explore state-level relationships between UFO sightings, median income, poverty, mental health, and substance use indicators from 2013–2014. Users can click a state to highlight its multi-dimensional data path, with map color intensity logarithmically scaled to sighting counts. The visualization is built with D3 v3, using `d3.geoPath` for the map, `d3.csv` for data loading, and SVG rendering with drag-and-drop axes for exploring the parallel coordinates.

CCraftbd

93% match

Loading thumbnail…

Group Project Bioinformatics1

This visualization combines a choropleth map of UFO sightings with select demographic data. The map, rendered using D3's geo projection and path generators, colors states based on the logarithmic count of reported sightings from the loaded dataset. Clicking a state triggers a zoom-in animation and displays the state's name and sighting count. The page also includes scaffolding for a parallel coordinates plot using D3 scales and axes, though it remains non-functional.

CCraftbd

91% match

Loading thumbnail…

Group Project Bioinformaticsnew1

This visualization combines a choropleth map of the United States with a parallel coordinates plot. The map colors each state according to a logarithmic scale of petition signature counts, with darker shades indicating higher numbers, and clicking a state updates the display. The parallel coordinates chart plots car dataset attributes, using D3’s drag behavior, brushes, and SVG paths for interactive exploration. Both views use D3 v3, with the map relying on `d3.geoPath` and state boundary data from a GeoJSON file.

CCraftbd

86% match

Loading thumbnail…

Group Project Bioinformaticsnew

This example visualizes the geographic distribution of White House petition signatures as a choropleth heat map of the United States. Built with D3 v3 and rendered as SVG with animation, the map lets users click any state to view its signature count. Color intensity encodes the number of signatures, using a logarithmic scale to handle values that range from a few dozen to over 4,500; the scale is implemented with a linear interpolator as a stand-in, as noted by the author. The data is loaded from UFO_color.csv and joined to state shapes, with the visualization drawing on Mike Bostock's map demo and forked from thedod's clickable US heat-map. The project demonstrates a quick-and-dirty approach to choropleth mapping in d3, with interactivity and animation for a compelling presentation of petition signature distributions across the United States.

CCraftbd

81% match

Loading thumbnail…

Group Project Bioinformatics

This interactive parallel coordinates chart visualizes UFO sighting data from a CSV file. The visualization employs gray background lines for context and blue foreground lines for focus, with draggable axes that users can rearrange by sorting dimensions. Brush controls on each axis filter the displayed UFO records, dynamically hiding non-matching foreground lines. The code uses d3.svg.line() for path generation, d3.behavior.drag() for axis manipulation, and d3.svg.brush() for interactive filtering, all rendered as SVG elements with smooth transitions during drag operations.

CCraftbd

80% match

Loading thumbnail…

Group Project Bioinformatics

This interactive D3.js map visualizes the geographic distribution of White House petition signatures across US states. Users click a state to zoom in and display its exact signature count next to the state abbreviation. A linear color scale applies a logarithmic transformation to the signature data, mapping darker green shades to higher counts. The visualization uses D3’s `d3.geo.albersUsa` projection, `d3.geo.path` for rendering SVG state boundaries, and animated transitions to scale and translate the map on click.

CCraftbd

78% match

Loading thumbnail…

Project 1 Bioinfomatics

This block displays a choropleth map of the United States, visualizing Zika virus case counts by state. The data is loaded from a CSV file and joined with geographic state paths. A logarithmic color scale, using d3.scaleLog and d3.scaleSequential with the "Oranges" interpolator, maps case counts to fill colors, enabling differentiation across a wide range of values. States are rendered as SVG paths and include an interactive tooltip that appears on hover, displaying the state name and its total number of cases. The map is drawn using D3 v4 with SVG and animated transitions.

CCraftbd

78% match

Loading thumbnail…

Final Project

This interactive choropleth map shows cumulative COVID-19 cases per U.S. state as of September 2021, with darker fills representing higher case counts. Clicking a state displays a tooltip with its name, total cases, and total deaths. The visualization loads county-level data from a CSV via `d3.csv`, aggregates it by state using `d3.rollup`, and renders SVG paths from TopoJSON using `d3.geoPath`. Color opacity is scaled proportionally to each state’s case total, with a bivariate legend circle appended on click.

MManh Pham

75% match