Cat Data draft 1

Fork of Cat Data draft 2 get the map to work

This visualization combines a choropleth map with a scatter plot to explore cat breed data, showing both geographic distribution and trait comparisons. The map uses a `d3.geoEqualEarth` projection and `d3.geoPath` to render country boundaries, with a `d3.scaleThreshold` color scale encoding breed counts, while the scatter plot displays life expectancy against weight. The implementation uses D3 v6 within a React application, rendering to SVG with interactive tooltips. Data on cat breeds comes from a Kaggle dataset, processed into country-level aggregates for the map.

Cat Data draft 4.5 dropdown experiments, embedding

This visualization displays the origins of cat breeds by combining a zoomable and pannable choropleth map on the left with a scatter plot on the right. The map colors countries based on the number of cat breeds, while the scatter plot graphs each breed by maximum life expectancy and weight. The map is rendered using `d3.geoPath` and `d3.geoEqualEarth`, while the scatter plot uses D3 v6 with interactive axis selectors. Both views are intended to support exploration of breed origins and comparisons, though tooltip functionality is currently incomplete. Data comes from the Kaggle cat breeds dataset.

Cchris.shimotake@gmail.com

Cat Data draft 4 legend, zoom/pan, popuptooltip

This visualization combines a choropleth map with a scatter plot to explore cat breed data. The map uses a threshold color scale to show the number of breeds per country, while the scatter plot displays maximum life expectancy against weight, with points colored by country of origin. The d3.geoEqualEarth projection renders the map, and d3.scaleThreshold maps data counts to a color palette. Interactive tooltips appear on hover, and the chart supports zoom and pan controls. The d3.v6 library handles SVG rendering and chart animations, with data sourced from a Kaggle cat breeds dataset.

Cchris.shimotake@gmail.com

Fork of Cat Data draft 1 Scatterplot

This visualization combines a choropleth map and scatterplot to explore cat breed characteristics across countries. The map colors countries by origin, while the scatterplot plots maximum life expectancy against minimum weight for each breed. Built with D3.js v6, the code uses `d3.geoEqualEarth` and `d3.geoPath` for map rendering, `d3.scaleLog` for the y-axis, and SVG elements with tooltips. Data comes from CSV files containing breed attributes and geographic mappings.

Fork of Cat Data draft 4 legend, zoom/pan, popuptooltip

This visualization combines a choropleth map and scatter plot to explore cat breed data from Kaggle. The map uses a `d3.geoEqualEarth` projection with a threshold color scale to show the number of breeds per country, while the scatter plot displays life expectancy against weight. Interactive features include zoom/pan on the map and a tooltip that appears on hover via D3 event listeners. Both SVG panels are rendered with D3 v6 in a React setup, with data loaded from CSV files. The visualization also includes a legend and animated transitions.

92% match

Cchris.shimotake@gmail.com

Fork of Cat Data draft 1 Scatterplot

This example combines a choropleth map and an animated scatterplot to explore cat breed data, linking geographic origin to life expectancy and weight. The map colors countries by average maximum lifespan using a linear scale, while the scatterplot plots each breed’s max life expectancy against minimum weight, with point size representing population. Built with React and D3 v6, it uses `d3.geoEqualEarth()` projections, `d3.geoPath`, linear and log scales, and SVG rendering. A tooltip provides additional detail on hover.

91% match

Fork of Fork of Cat Data draft 3 linking the graphs

This visualization links a choropleth map of cat breed origins with a scatter plot of their physical traits. It displays the geographic distribution of cat breeds by country, alongside a plot of their maximum life expectancy against minimum weight. The code uses `d3.geoEqualEarth` and `d3.geoPath` to render the map, while `d3.scaleThreshold` maps the count of breeds to a color scale. The scatter plot uses `d3.extent` to determine axis domains, with the data sourced from the Kaggle cat breeds dataset.

91% match

Cat Data Final Demo

This visualization presents two linked views of cat breed data. A left-hand world map uses a threshold color scale to show the number of cat breeds per country, while a right-hand scatterplot plots breeds by their maximum life expectancy and weight. The map is rendered using `d3.geoPath` with an equal-earth projection, and both views support interactive selection of attributes via dropdown menus. The scatterplot uses `d3.scaleThreshold` for coloring points by origin country. The dataset originates from a Kaggle cat breeds collection.