AlexTapiaM

@AlexTapiaM·5 public vizzes

Fork of Worldwide Missionary Movement - Gerardo Alexander Tapia Mayhuire, Coordinator of GO Arequipa English Service. Visual Analytics Project to analyze the countries and population (Recomendation System, Computer Cience, UNSA)

This visualization displays worldwide populations and countries on an interactive map using a natural Earth projection. Hovering over a country reveals its name and estimated population in millions, sourced from world-atlas TSV data. The map is rendered using D3 v6's geoPath and geoNaturalEarth1 projections, with zoom functionality enabled via d3.zoom. TopoJSON features are loaded to create country boundaries, and the choropleth-like styling uses CSS hover effects to highlight selected regions.

Mar 9, 2021

Loading thumbnail…

Worldwide Missionary Movement - Gerardo Alexander Tapia Mayhuire, Coordinator of GO Arequipa English Service. Visual Analytics Project to analyze the countries and population (Recomendation System, Computer Cience, UNSA)

This visualization displays a world map highlighting estimated population figures for each country, with hover interactions that reveal the country name and population in a formatted label. The map uses a natural Earth projection rendered as SVG paths, and supports zooming and panning through d3.zoom. Population data comes from the world-atlas TopoJSON and TSV files, which are loaded via Promise.all. Country polygons are generated with d3.geoPath, and tooltips are implemented using SVG title elements.

Mar 9, 2021

Loading thumbnail…

Fork of Agregando interacción en la Vizualización del Mapa

This example displays an interactive world map using a natural Earth projection, with each country rendered in light green and highlighted red on hover. The visualization leverages D3 v6’s `geoPath` and `geoNaturalEarth1` projection to draw SVG paths from TopoJSON world-atlas data, while country names are joined from a TSV file. Users can pan and zoom via D3’s `zoom` behavior, which applies a transform to the map group. The map also includes a blue sphere outline, and tooltips with country names appear on hover.

Mar 8, 2021

Loading thumbnail…

Fork of Let's make a map with D3.js!

This fork of a D3.js mapping tutorial displays a world map, rendering countries in light green with black borders on a blue sphere. The visualization uses the Natural Earth 110m dataset loaded via the `world-atlas` package, and projects the geometry with `d3.geoNaturalEarth1` and `d3.geoPath`. A topojson `feature` extracts country boundaries from the data. The SVG output is styled with a CSS class for both the sphere background and individual country paths.

Mar 7, 2021

Loading thumbnail…

index1.js

This interactive map visualizes the world's countries as colored regions on a blue sphere, using a geographic projection to create a global view. The visualization relies on D3.js version 5 and the topojson library to fetch and process GeoJSON data from the world-atlas package, which provides country boundaries. The SVG rendering applies a light green fill to each country with a semi-transparent black stroke, while the sphere itself is filled with dark blue, achieved through the `d3.geoPath` projection generator and the `feature` API.

Mar 7, 2021