Skip to main content
SimilarExport ZIP
100%

Shark Tank Chloropleth Deals

✓ Published0🌍 Public
Bblanchestora@gmail.com
Last edited May 13, 2024
Created on May 13, 2024

This example visualizes the number of Shark Tank deals per U.S. state using a chloropleth map. Each state is colored on a white-to-green scale based on deal count, with a legend showing the mapping up to 100 deals. The map uses d3.geoMercator and d3.geoPath to render state boundaries from GeoJSON data, while a tooltip displays the state name and entrepreneur count on hover. The code employs d3.scaleLinear for color encoding and transitions to animate fill changes on mouseleave.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Shark Tank Chloropleth

This choropleth map visualizes the number of entrepreneurs per U.S. state, with color intensity ranging from white (zero) to blue (high values). The map uses d3.geoMercator projection and d3.geoPath to render state boundaries from GeoJSON data, while a d3.scaleLinear maps state counts to fill colors. Interactive tooltips display the state name and entrepreneur count on mouseover, with highlighted states transitioning to red. The visualization includes a legend quantifying the color scale, and data is loaded from a CSV file via d3.csv.

Bblanchestora@gmail.com
92% match
Loading thumbnail…

Fork of Shark Tank Chloropleth

This fork of a Shark Tank choropleth visualizes the ratio of “Num” to population for each U.S. state, using a linear color scale from white to blue. It renders an SVG map via `d3.geoMercator` and `d3.geoPath`, loading GeoJSON map data and CSV statistics through `d3.json` and `d3.csv`. The code uses `d3.scaleLinear` for color mapping and joins paths with `selectAll` and `join` for drawing.

HHOURPRIMERA@GMAIL.COM
81% match
Loading thumbnail…

Untitled

This example presents a choropleth map of U.S. states, with each state filled using a color scale from light yellow to dark red based on randomly generated low, average, and high values. Hovering over a state triggers a tooltip that displays these three metrics in a table. The visualization uses D3 v3 and SVG, with the `uStates` library providing the map outlines and `d3.interpolate` for color encoding. State boundaries are drawn as paths, and the tooltip appears dynamically near the cursor.

Tthanhtrant219
70% match
Loading thumbnail…

US State Map

This example displays a choropleth map of US states, with each state colored by a data value. The map shows a tooltip upon hovering, detailing low, average, and high values for each state, and animates state opacity on hover. It uses the `d3.v3` library and the `uStates.js` script, which provides SVG paths for each state. The tooltip is built with HTML, and a color scale interpolates from light yellow to dark purple based on the data.

NNPashaP
69% match
Loading thumbnail…

Test Chloropleth

This visualization displays the number of data points across U.S. states in a hexagon tile grid choropleth. The color scale uses a threshold encoding with d3.scaleThreshold and d3.schemeBlues to represent counts from the StateFile.csv dataset. The map is rendered using d3.geoPath and TopoJSON, loading US state hexgrid geometry from a GitHub-hosted GeoJSON file. A legend with an axis provides reference for interpreting the color values.

Bblanchestora@gmail.com
69% match
Loading thumbnail…

Choropleth Map

This example uses a choropleth map to display the unemployment rate (%) for each U.S. state. The color of each state corresponds to its value, with a legend on the right providing the scale. The map is rendered using D3.js (v5) and React, with the `d3.geoPath` projection drawing the state boundaries and a TopoJSON mesh creating the white state separations. A tooltip is appended to each state path to reveal the exact state name and unemployment rate. The data is stored in a Map object and applied to each state's fill color via the `color` scale.

Rrobertmreedy
68% match
Loading thumbnail…

choropleth

This choropleth map uses the Albers USA projection to visualize the number of earthquakes per state in the United States, rendered as Scalable Vector Graphics (SVG) paths. The map employs a threshold color scale with a sequential color scheme (OrRd) to encode the logarithmically transformed earthquake counts for each state. The visualization is built using D3's `geoPath` and `geoAlbersUsa` for projection and map generation, with `topojson` for feature extraction. Data is loaded from external CSV and TopoJSON files. Hovering over a state turns it light green, revealing tooltips with the region, state name, and earthquake count.

MMehika Patel
68% match
Loading thumbnail…

Country Map

This visualization displays the 50 U.S. states as an interactive choropleth map, rendered in SVG within a React framework. It uses d3.geoPath with the geoAlbersUsaTerritories projection to draw state boundaries, with state fills in steelblue that turn white on hover. Geographic data comes from a TopoJSON file loaded via d3.json, and borders are derived using TopoJSON’s feature() and mesh() functions.

MmNamratha25
68% match