Skip to main content
Log in
R

Ritik Raj

@ritikraj018·5 public vizzes

Loading thumbnail…

Missing Migrants

This visualization combines a bubble map with a time-series histogram to show migrant deaths and disappearances worldwide. The map uses d3.geoNaturalEarth1 and d3.geoPath to render country boundaries, with circle size scaled by d3.scaleSqrt representing the total dead and missing. The histogram below aggregates reported dates into monthly bins using d3.bin and d3.timeMonths, with bar heights summing casualties. Both views use React components, with data loaded from a CSV of the Missing Migrants Project and country outlines from TopoJSON world-atlas data.

Apr 16, 2023
Loading thumbnail…

Migrant Deaths

This interactive visualization maps global migrant deaths and missing persons over time. It combines a natural Earth projection world map with proportional circles, sized by the total dead and missing, and a linked time-series histogram that filters the map via a brush. The D3 libraries `geoNaturalEarth1`, `geoPath`, and `geoGraticule` render the map, while `scaleSqrt` and `scaleTime` manage the encodings. Built with React, it uses `useMemo` for performance and loads data from a CSV of migration incidents and a World Atlas TopoJSON.

Apr 16, 2023
Loading thumbnail…

Fork of Scatter Plot with Color Legend

This example visualizes the Iris dataset as a scatter plot, encoding petal length on the x-axis, sepal width on the y-axis, and species as color through a categorical legend. It uses D3 scales (scaleLinear, scaleOrdinal) to map data to positions and colors, while React components—AxisBottom, AxisLeft, ColorLegend, and Marks—render the SVG axes, circles, and legend. The data loads asynchronously via d3.csv, and the chart includes native SVG tooltips via the title element.

Mar 29, 2023
Loading thumbnail…

Fork of Scatter Plot with Color Legend

This example visualizes the Iris dataset as a scatter plot, encoding petal length on the x-axis, sepal width on the y-axis, and species as color through a categorical legend. It uses D3 scales (scaleLinear, scaleOrdinal) to map data to positions and colors, while React components—AxisBottom, AxisLeft, ColorLegend, and Marks—render the SVG axes, circles, and legend. The data loads asynchronously via d3.csv, and the chart includes native SVG tooltips via the title element.

Mar 29, 2023
Loading thumbnail…

Fork of Polished World Map

This interactive world map presents a stylized view of global landmasses and country boundaries, sourced from the World Atlas TopoJSON dataset. The visualization renders a natural Earth projection with graticules, using red for land, a light gray sphere, and teal borders for interior country boundaries. Built with React and D3 v5, it demonstrates a polished geographical display, leveraging D3's `geoNaturalEarth1` projection, `geoPath`, and `geoGraticule` APIs. The data is processed via TopoJSON's `feature` and `mesh` functions to create the land polygons and interior boundaries.

Mar 29, 2023