Try Menu

Scatter Plot with Menu

A scatter plot displays global export values, with the United States on the x-axis and Japan on the y-axis, colored by indicator type. A dropdown menu offers options A, B, and C, though its selection does not alter the visualization. The D3 v5 code uses `scaleLinear`, `axisBottom`, `axisLeft`, and `scaleOrdinal` with `schemeCategory10` to render SVG circles from CSV data. The chart includes gridlines, a legend, and axis labels, with data parsed numerically for seven countries.

84% match

Scatter Plot with Menu

84% match

Imports with Menus

Two dropdown menus let the viewer select which countries to compare on the x- and y-axes of a scatter plot, while a color legend filters the points by export category. The visualization uses d3.scaleLinear for axes, d3.scaleOrdinal with schemeCategory10 for coloring, and d3.select to update the menus and plot dynamically. Data covers exports to China and the United States from 2000 to 2016, sourced from the World Trade Organization. Circles animate into position with transitions, and filtering fades non-selected points.

82% match

Imports with Menus

This interactive scatterplot displays the value of exports from various countries to China and the United States between 2000 and 2016, sourced from the World Trade Organization. Users select which two countries to compare via the dropdown menus built with the `dropDownMenu` helper, while a color legend toggles data points by indicator. The visualization updates with animated transitions using `transition().duration()` and `delay()`, and implements axes with `d3.axisLeft` and `d3.axisBottom`, with color encoding via `d3.scaleOrdinal` and `schemeCategory10`.

Imports with Menus

This interactive scatterplot visualizes worldwide export data from 2000 to 2016, comparing trade values between China, the United States, and other nations. Users select which two variables to plot on the x- and y-axes via dropdown menus, with each point colored by commodity type. The visualization uses d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.scaleOrdinal, with animated transitions for the circles. Data originates from the World Trade Organization’s network of merchandise trade statistics. SVG rendering and dropDownMenu and colorLegend custom modules handle the interface.

Scatter Plot with Menu

This scatter plot visualizes worldwide export values to the United States and China from 2000–2016, with each circle’s color encoding the export indicator category. A legend identifies the categories, and axis labels clarify the compared countries. Built with d3.csv, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.scaleOrdinal, the SVG renders points with a categorical color scheme. Data is loaded from a hosted CSV file, and circles use fixed opacity for overlapping points.

Imports with Menus

This interactive scatter plot explores worldwide export data from 2000 to 2016, sourced from the World Trade Organization. Two dropdown menus allow users to select which export destination country (e.g., China, United States, Brazil) to plot on the x- and y-axes. The visualization is built with D3 v5, using `scaleLinear` for axes, `scaleOrdinal` for color encoding by country, and `transition().duration(2000).delay()` to animate the circles to their new positions when menu selections change. An SVG rendering includes axis labels and a color legend.

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.