Sankey‑диаграмма движения денег: от двух дней в Illustrator до интерактива за час

Как понять, куда на самом деле уходят деньги, если смотреть на них как на поток, а не как на набор категорий. На реальном примере показываю, как из банковской выписки собрать Sankey-диаграмму, где помогает AI, где ошибается и какие решения приходится принимать. В итоге получается не статичная картинка, а интерактивная модель, с которой можно работать: разбирать структуру расходов, видеть взаимосвязи и находить узкие места. Подход применим не только к личным финансам, но и к бизнесу — для анализа движения денег, затрат и сложных процессов. Будет полезно дизайнерам, аналитикам и всем, кто работает со сложными системами

https://habr.com/ru/articles/1016620/

#Sankey #визуализация_данных #финансы #анализ_данных #UX_дизайн #интерфейсы #бизнесаналитика #D3js #React #AI

Day 49. Polygon city tiles 🏙️

This project visualizes the Timișoara historical center as a dense field of building polygons, using D3.js with Nextzen context tiles and detailed footprints from OSM Buildings.

Instead of simplifying the scene, it keeps full building coverage visible. As tiles stream in, streets/water/terrain establish context first, then buildings appear layer by layer.

#100DayMapChallenge Day 49/100

#D3js #VectorTiles #Geospatial #DataVisualization #OpenStreetMap

Day 46. Interactive virtual land map 🗺️

Client project: a two-level map for blockchain-based virtual land, from global view to interactive plot grids.

Challenge: defining a coherent spatial system for a fictional world with no real coordinates. Built with QGIS (custom coordinates) and D3.js (SVG + zoom).

Result: a flexible map that brings real spatial logic into virtual land.

Delivered in under three weeks, with a 5-star review.

#100DayMapChallenge Day 46/100
#D3js #QGIS #Cartography

Week 6 reflection. Different registers each day.

From experimental data viz to scientific depth and client work, ending on a more playful note.

Day 36 explored Voronoi logic, Day 37 mapped 50k+ cities, Day 38 visualized Antarctica’s gravity in 3D, and Day 39 marked a high point with UNESCO work.

The final days shifted tone: Corgi Routes, an Africa-centered globe, and river hierarchies shaped by Strahler order.

#100DayMapChallenge #DataVisualization #ThreeJS #D3js #Geospatial

Day 40. Corgi routes 🐶

What if GPS routes could be visualized with animation and terrain like Relive?

Interactive route visualizer built with MapLibre GL and D3.js. Drag-and-drop GPX → animated playback over terrain, with an elevation chart synced to the map.

Click the chart to jump anywhere along the route. Both views stay aligned.

Still experimental, but shows what’s possible when flexible route data meets modern mapping tools.

#100DayMapChallenge Day 40/100

#MapLibreGL #D3js #GPX #OSM

Day 39. Education inequality at global scale 🌍

How do you compare gender disparities across education worldwide?

Interactive animated choropleth showing the Gender Parity Index across five levels (primary to tertiary), built with Leaflet.js and D3.js. Client project.

Key challenge: consistent color scale across all levels, solved with Jenks Natural Breaks on the combined dataset.

Insight: as girls progress through education, the gender gap often widens.

#100DayMapChallenge #Leaflet #D3js

Day 37. Populated places by size and rank 🌐

How visualize global settlement patterns without political boundaries dictating story?

Circle size = population, brightness = rank. Removes borders. Settlement structure visible on own terms.

D3.js canvas rendering handles thousands of points. City selection uses quadtree spatial index.

Data: Natural Earth. Quadtree inspired by Alain Roan (Observable).

https://maptheclouds.com/playground/30-day-map-challenge/points/

#100DayMapChallenge #D3js

Day 36. When data visualization meets music history 🎶

This project maps 50 of the most valuable vinyl records using a Voronoi-style visualization where each region represents a record.

The Beatles dominate the list, including Yesterday and Today ($234k) and the famous White Album ($790k).

Built with D3.js, the visualization turns record prices and cultural impact into a spatial landscape of music history.

https://maptheclouds.com/playground/30-day-chart-challenge/comparisons/experimental/

#100DayMapChallenge #D3js #DataViz

Week 5

Five weeks into the challenge, and the rhythm is starting to feel more like exploration than discipline.

Seven projects this week: networks, terrain, seasonal patterns, and timelines.

Highlight: Day 32, a D3.js force-directed chart for the San Francisco District Attorney’s Office, built with Anna Tong, mapping 350+ people using physics-based positioning.

35 days down, 65 remaining.

#100DayMapChallenge #DataVisualization #D3js

Day 34. Historical timelines as a comparison tool 📊

When events unfold at different speeds, how do you compare them without distorting their duration?

This visualization shows the global race for COVID-19 vaccination (April 25, 2021). Each bar represents the share of the population with at least one dose, with colors indicating world regions. Data from ourworldindata and naturalearthdata.

Inspired by Mike Bostock’s Bar Chart Race.

https://maptheclouds.com/playground/30-day-chart-challenge/comparisons/historical/

#100DayMapChallenge #D3js #DataViz