TracyWangYQ

@TracyWangYQ·5 public vizzes

BarChart Interative

This stacked bar chart displays the estimated 2010 religious breakdown of the world’s 20 most populous countries, using data from the Pew Research Center’s Global Religious Landscape. Built with D3.js (v3), it renders an SVG with ordinal y-axes and linear x-axes, layering stacked bars per country. Hovering over bars triggers tooltips via d3-tip, while hovering over the color legend highlights individual religious groups by fading non-selected bars through an overlay rect and foreground layer.

Dec 16, 2022

Loading thumbnail…

Fork of NYC Crime

This interactive dashboard presents New York City crime data through a synchronized map, pie chart, and bar plots. A choropleth map visualizes precinct-level data, while a donut chart breaks down crime types and bar charts show age and race demographics. Users can filter the visualization by clicking on map precincts or the reset button. The code uses D3.js v6 with `d3.geoMercator` projection, `d3.geoPath` for map rendering, and SVG for all graphics.

Dec 14, 2022

Loading thumbnail…

Fork of Total Number of Rockets Throughout The Years

This stacked bar chart shows the total number of rocket launches per year, with each segment colored by the launching company. The visualization uses Vega-Lite’s API to aggregate the CSV data from Kaggle’s global space launches dataset, counting records grouped by year and company. The tooltip displays both the launch count and company name, while the custom config adjusts font sizes and axis styling for readability.

Dec 14, 2022

Loading thumbnail…

Fork of Stacked Bar Chart

This stacked bar chart visualizes the global distribution of Nike manufacturing factories by country and product type. The visualization aggregates data from the Nike Global Manufacturing Data Export, filtering to show only countries with more than ten factories. Built with D3.js, the chart uses `d3.layout.stack` for the stacked bars, `d3.scale.ordinal` for the vertical axis, and `d3.legend.color` for the interactive legend. Hovering over bars displays tooltips via `d3-tip`, while hovering over legend entries highlights the corresponding product category through a semi-transparent overlay layer.

Dec 14, 2022

Loading thumbnail…

Fork of Suicide Trend over Years and Gender in United States

This animated stacked bar chart visualizes suicide trends over time, with bars segmented by gender to show the distribution of suicide numbers across years in the United States. The visualization uses D3.js version 3.5.5 with the d3-legend and d3-tip libraries for interactive features, allowing users to hover over bars for detailed tooltips and filter the chart by clicking on gender categories in the legend. Data comes from the Suicide_in_USA_by_Sex.csv file, and the chart employs SVG rendering with smooth transitions between states.

Dec 14, 2022