ZijunXu

@ZijunXu·11 public vizzes

Basic Scatter Plot

A basic scatter plot visualizes the relationship between income and health across countries, with each country represented by a circle positioned by its income (x-axis) and health (y-axis) values. Circles are colored by region and sized by population. A legend on the right highlights continent dots; hovering over a continent filters and blurs the country circles, with a slow reclear effect for most regions. However, the animation has a bug: Asian countries lack the gradual unblurring effect, and their images only appear after highlighting the continent dot. The visualization uses SVG rendering with animated transitions.

Oct 28, 2017

Loading thumbnail…

Basic Scatter Plot

This scatter plot visualizes the relationship between GDP per capita and health expectancy across countries, with each point sized by population and colored by region. The chart uses SVG and includes an animated highlight function that emphasizes individual data points on hover. Data on income and health expectancy come from the World Wealth & Income Database and the Global Health Observatory data repository, respectively, and the visualization is built with D3 v4, following a template referenced from Curran.

Oct 28, 2017

Loading thumbnail…

Basic Scatter Plot

This scatter plot visualizes the relationship between income and health expectancy across countries, with each point representing a nation and colored by region. The x-axis shows GDP per capita (from the World Wealth & Income Database), the y-axis shows health expectancy (from the Global Health Observatory), and point size encodes population. The visualization is built with D3 v4 and rendered as SVG, and it responds to window resize events. The data is loaded from a CSV file and mapped to circle positions, with a log scale for income to handle the wide range of GDP values. Countries are colored according to their region, and the chart includes axes with labels for income and health expectancy. The example demonstrates a straightforward scatter plot for exploring the relationship between economic prosperity and public health across nations, with population encoded in point size and regional distinctions shown by color.

Oct 9, 2017

Loading thumbnail…

Data Summary

This pie chart visualizes the percentage of nuclear explosions detonated by each country between 1945 and 1998, using data from the IAEA’s “Nuclear Explosions, 1945–1998” report and structured data from GitHub. The visualization is built with D3 v4 and renders an animated, interactive donut chart in SVG. Hovering over a slice highlights it in magenta and displays a tooltip with the detonating nation and the total count. A color legend identifies each country, and the chart is based on Curran's donut chart, adapted for this dataset.

Sep 28, 2017

Loading thumbnail…

Top Internet Countries Visualization

This visualization shows the 2016 recreation visit rankings for U.S. National Park Service sites as a horizontal bar chart, highlighting the top 100 parks by visitor count. Each bar is color-coded by park type, with Golden Gate NRA leading at over 15.6 million visits, followed by Blue Ridge Parkway and Great Smoky Mountains NP. The chart uses CSV data loaded with d3.v4, rendering as SVG, with bars sized proportionally to each park's total visitors and the percentage of total visits displayed. The visualization is sorted by rank, making it easy to compare visit volumes across different parks and park types.

Sep 28, 2017

Loading thumbnail…

create the image

A bar chart displays three blue bars of varying heights on a Cartesian coordinate system, with axes drawn as thin black lines. The chart uses D3 v4 to append SVG rectangles for the bars, positioning them at fixed x-coordinates with heights proportional to their y-offsets from the baseline. The visualization is generated entirely with static SVG elements via `d3.select` and `attr` methods, without any scales or data binding, illustrating a simple hand-coded bar chart.

Sep 28, 2017

Loading thumbnail…

Basic Scatter Plot

This basic scatter plot visualizes the relationship between GDP per capita and life expectancy across countries, with each circle sized by population and colored by region. The data come from the World Wealth & Income Database and the Global Health Observatory. Implemented with D3 v4 and SVG rendering, the chart uses a linear x-axis for income and a linear y-axis for health expectancy. Circles are scaled by population using a square-root scale, and colors encode geographic region. The visualization is based on Curran's Stylized Scatter Plot with Color Legend.

Sep 19, 2017

Loading thumbnail…

Data Summary

This example loads a CSV dataset of nuclear explosions from 1945 to 1998 and presents a textual data summary using D3 v4 and datalib. It reports the number of rows, columns, and file size, followed by per-column summaries generated by `dl.format.summary`, displayed in a `<pre>` block and logged to the console.

Sep 19, 2017

Loading thumbnail…

Data Summary

This visualization provides a summary of life expectancy data for countries worldwide over a 15-year period, sourced from the Global Health Observatory data repository. Using D3 v4, the chart displays trends in life expectancy at birth for both sexes, as well as breakdowns by male and female populations. The data spans from 2000 to 2015, and the visualization likely includes interactive elements to explore country-specific trends over time. The design is inspired by a blockbuilder example, with a clean, concise summary layout that highlights changes and distributions in life expectancy across countries and years.

Sep 19, 2017

Loading thumbnail…

Data Summary

This visualization displays the annual visitor rankings of U.S. National Park Service sites as a horizontal bar chart, with each park’s name, rank, visitor count, and percentage of total visitors shown. The bars are ordered by rank from highest to lowest, with the top-ranked Golden Gate NRA at over 15.6 million visitors and the list descending to Theodore Roosevelt NP at rank 100 with roughly 754 thousand visitors. The chart uses the provided CSV data and is implemented with D3 v4, encoding the visitor counts along the horizontal axis and park names along the vertical axis.

Sep 19, 2017

Loading thumbnail…

Number of violent crimes in USA in 2015

This visualization displays the number of violent crimes reported in the United States in 2015, using horizontal bars to compare five crime categories: total violent crimes, aggravated assault, robbery, rape, and murder. Each bar is labeled with its exact count and percentage of the total. The chart is rendered as an SVG using D3 v4, with `d3.scaleLinear` for the x-axis, `d3.scaleBand` for the y-axis, and appended text elements for labels and values. Data comes from FBI crime statistics, and the layout includes a title and margins defined in the code.

Sep 13, 2017