Group Project Bioinformatics

100%

Group Project Bioinformatics

✓ Published0🌍 Public

Last edited Apr 3, 2018

Created on Apr 3, 2018

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.

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>

mit Licensed

Similar vizzes

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

92% 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 Bioinformatics FINAL!!

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.

CCraftbd

78% match

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

75% 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

74% 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

74% match

Loading thumbnail…

Interactive Map

This interactive map displays survey responses about states visited or lived in, with each state colored according to the frequency of mentions using a choropleth. Built with React and D3 v5, it uses `d3.geoPath` with a `geoAlbersUsa` projection to render U.S. state boundaries from a TopoJSON file. Survey counts are aggregated from a CSV, matched to state names via a TSV, and mapped to a quantile color scale. SVG elements are selected and styled via `d3.select` and `join`.

Xxiaoma1002

71% match

Loading thumbnail…

US State Map finished

This example visualizes the geographic distribution of West Nile virus cases across US states using a choropleth map. The map is rendered in SVG with D3 v4, with each state’s fill color encoded on a logarithmic scale using d3.scaleLog and a sequential interpolated color scheme based on the number of reported cases. Hovering over a state triggers a tooltip displaying the state name and total case count. The map also includes an animation component, as state boundaries and fills are drawn dynamically. Data is loaded from a CSV file and joined to GeoJSON state paths via a custom uStates.js module.

CCraftbd

70% match