Percentages of four different Products imported in each country

Final Project

This visualization presents worldwide export data from 2000–2016 as an animated scatterplot, with each circle representing a country and colored by indicator category. Users can dynamically switch the x- and y-axis metrics via dropdown menus, and clicking the color legend highlights or dims categories. The plot uses d3.scaleLinear for axes, d3.scaleOrdinal with schemeCategory10 for colors, and transitions each circle’s radius from 0 to 10 over two seconds with staggered delays. A hover tooltip displays the reporter country name, while SVG rendering updates axes and legend selections.

75% match

Scatter Plot

This scatter plot displays the number of occurrences for each nation, with country names on the y-axis and values on the x-axis. The visualization uses D3 v6 with SVG rendering, importing `select`, `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, `axisBottom`, and `format` from D3. Data is loaded from a local CSV file, with values multiplied by 1000. Rectangles represent each country, scaled proportionally to their numeric values, with formatted tick labels using `format('~s')` to abbreviate large numbers.

Mmarcob896

75% match

Imports with Menus

This interactive scatter plot visualizes worldwide export data from 2000 to 2016, sourced from the World Trade Organization, comparing trade values between various countries. Two dropdown menus let users select which countries to plot on the x- and y-axes, while a color-coded legend filters the data by product indicator. Built with D3 v5, the visualization uses `scaleLinear`, `axisBottom`, and `axisLeft` to construct the axes, with circles animated via `transition().duration()`. A `scaleOrdinal` with `schemeCategory10` maps indicators to colors, and click events on the legend toggle data highlighting.

74% match

Project

This scatter plot visualizes annual export values from 2000 to 2016, comparing shipments to the United States against those to China, with each point representing a country-year observation. The chart uses D3 v5's `scaleLinear`, `axisLeft`, and `axisBottom` to construct axes with abbreviated number formatting, while circles are rendered via SVG. Data comes from a CSV file loaded with `d3.csv`, and the code explicitly converts six country columns to numeric values before plotting. Red, semi-transparent circles reveal overlapping data density, with labeled axes and a title indicating the export comparison.

74% match

Cars Scatter Plot

This interactive scatter plot compares the value of car exports to the United States and China, with each point representing a country. The visualization uses circles sized by export value and colored by a categorical indicator, with a legend that filters points by clicking. Animated transitions and tooltips reveal detailed information on hover. Built with D3 v5, it imports the data from a CSV file and utilizes `scaleOrdinal`, `schemeCategory10`, `extent`, `axisBottom`, and `scaleLinear` APIs, rendering the SVG with interactive opacity changes and a custom color legend component.

scatterplot

This scatterplot displays the population of four countries using horizontal bars, with country names on the y-axis and population counts on the x-axis. The visualization loads data from a CSV file using `d3.csv`, then applies `scaleLinear` and `scaleBand` to map values to screen coordinates. Axis ticks are generated with `axisLeft` and `axisBottom`, with tick labels formatted using `d3.format` to abbreviate large numbers. The chart is rendered as an SVG, with bars styled via `rect` elements and a title added as SVG text.

Eevsjg

Scatter Plot with Menu

This scatter plot visualizes worldwide export values to the United States and China, with each circle colored by its indicator category. A legend identifies the categories. The visualization uses d3.csv to load the dataset and d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.scaleOrdinal with schemeCategory10 for encoding. The SVG rendering includes axis labels, a title, and grid lines via tickSize, with legends positioned using SVG groups and rectangles.

Scatter Plot with Menu

This scatter plot visualizes worldwide export data from 2000 to 2016, with each circle representing a country-year observation. Users select the x and y axes from dropdown menus to compare different economic indicators across countries, while a color legend toggles which country category is highlighted in the plot, dimming non-selected points. Built with D3 v5, the visualization uses an animated transition to grow circles over 2 seconds, scales axes with `d3-scaleLinear`, and renders SVG elements. A hover tooltip displays the reporter description for each point, while the legend and dropdowns filter and control the displayed data.