Ukraine Events

100%

Ukraine Events

✓ Published0🌍 Public

Last edited Feb 25, 2022

Created on Feb 25, 2022

This visualization maps Ukraine conflict events on a dark, stylized basemap using OpenLayers with a Stamen toner-lite layer, inverted for a moody aesthetic. React manages the map lifecycle and data loading, fetching GeoJSON coordinates via D3's `json`. Each event is rendered as a glowing, soft-edged sprite on a Canvas, generated by a radial gradient in `generateSprite.js` with a Cubehelix color scale, creating a firefly-like cartographic effect. The map automatically removes layers on component unmount.

AI-generated description

Visualization of data from Russia-Ukraine Monitor Map by Cen4infoRes

Data extract: https://gist.github.com/curran/5b0638a47ca0bbd7ef9b61d76f7ab613#file-data-json

MIT Licensed

Similar vizzes

Loading thumbnail…

возобновление ато

This visualization maps attacks on Ukrainian forces during the "ceasefire" period of June 20-30, 2014, using a Mercator projection of eastern Ukraine. Circles on the map encode the date, location, and casualties (killed, wounded) of each incident from the CSV dataset. A draggable timeline slider filters events by day, and hovering over a circle displays its attack description in a tooltip. The map is drawn with `d3.geo.path` from a TopoJSON file of Ukrainian oblasts, with animations and transitions handled by the D3 v3 library.

MMraleksa

74% match

Loading thumbnail…

ATO

This map visualizes attacks on Ukrainian forces during a unilateral ceasefire from June 20–30, 2014, using a slider to animate events by day and location. A static SVG map of Ukrainian oblasts, rendered via `d3.geo.path()` with a Mercator projection, is layered with circles and text annotations; hovering over a point triggers a tooltip with attack details. The visualization uses `d3.csv()` to load the dataset and `d3.forceSimulation` for the interactive slider, with colors encoding the date range. The map is built using TopoJSON and SVG animation, while the background annotation provides narrative context.

MMraleksa

74% match

Loading thumbnail…

map_ATO3

This map visualizes the territorial situation in eastern Ukraine during the 2014 anti-terrorist operation (ATO), marking cities controlled by separatists, liberated towns, and recent attack locations. It also plots major regional cities and leader lines for reference. The visualization uses D3 v3 with a Mercator projection and `d3.geo.path` to render Ukraine’s oblast boundaries from a TopoJSON file, while custom SVG circles and labels represent place data. Hovering over map elements triggers a tooltip displaying the corresponding city or village name. The map also includes hexbin overlays and contextual annotations in Russian.

MMraleksa

74% match

Loading thumbnail…

ATO2

This interactive map visualizes attacks on Ukrainian forces during a unilateral ceasefire from June 20-30, 2014, with each incident plotted as a circle on a Mercator projection of Ukraine. The map uses a draggable slider to filter events by day, while hovering over a circle reveals the attack description via an HTML tooltip. It renders with D3.v3, using `d3.geo.path` for the TopoJSON boundaries and `d3.csv` to load the incident data, which includes coordinates, casualties, and text descriptions. The color of each circle encodes the day of the attack, and circles are sized by the number of killed and wounded.

MMraleksa

73% match

Loading thumbnail…

Map

This example displays a static map image of Ukraine with a title overlay, sourced from the Institute for the Study of War’s analysis of the conflict. The page uses plain HTML and CSS to center the content and size the image, with no interactive JavaScript or data visualization libraries. It demonstrates a minimal React-compatible structure, relying on a simple `<img>` tag and inline styles rather than any framework-specific rendering or mapping APIs.

Jjustvizzin

72% match

Loading thumbnail…

slav

This visualization maps the territorial control of Ukrainian forces and separatists around Slavyansk in July 2014, using a chronological series of annotated narrative text blocks. It displays a static SVG map of Ukrainian oblasts, with the Donetsk region highlighted, overlaid with dated, descriptive event updates that incorporate images and tooltips. The application loads GeoJSON-like topology data to render maps via the `d3.geo` API, while text annotations are positioned absolutely within the HTML. Animation and interactivity are absent, instead relying on fixed spatial storytelling with the `d3` library and its `topojson` module for geographic projection.

MMraleksa

71% match

Loading thumbnail…

ATO3

A geographic visualization of territory in Ukraine maps the progress of the "ATO" (Anti-Terrorist Operation). The map displays the location of settlements controlled by separatists, recent liberated cities, and the sites of the latest attacks, with the user able to hover over marked cities or hexagons to reveal names in tooltips. The project uses d3.v3 with a Mercator projection and d3.geo.path to draw the map, while d3.hexbin renders a hexagonal overlay, and d3.select appends SVG elements for rendering.

MMraleksa

71% match

Loading thumbnail…

ATO2

A map of eastern Ukraine during the July 2014 ATO displays a hexbin overlay of armed confrontations and locations from a CSV dataset. The visualization uses a Mercator projection with d3.geo.path to render the region’s topojson boundaries. A d3.hexbin layout groups incident coordinates, with each hexagon’s size reflecting the count of events. Hovering over the hexagons reveals the name of the corresponding town or village via a tooltip.

MMraleksa

71% match