Skip to main content

๐Ÿ‡น๐Ÿ‡ฟ Tanzania Interactive Map

Tanzania is an East African country famous for its vast wilderness areas, including the Serengeti National Park, the Ngorongoro Crater, and the iconic Mount Kilimanjaro.

๐ŸŒ Overviewโ€‹

Tanzania is an East African country famous for its vast wilderness areas, including the Serengeti National Park, the Ngorongoro Crater, and the iconic Mount Kilimanjaro.

๐ŸŽจ Design & Flag Inspirationโ€‹

The visual identity of this map pack is inspired by the National Flag of Tanzania.

  • Hover State: We utilize a vibrant translucent color (rgba(23, 139, 50, 0.35)) to represent the national identity and heritage.
  • Borders: Rendered in Deep Navy (#1e293b) to ensure maximum contrast and a modern, premium aesthetic.

๐Ÿ—บ๏ธ Interactive Demoโ€‹

Hover over the Regions to see the highlight and tooltips. Click any region to see how easily you can capture the region's data code.

svg-world-maps / tanzania.svg
ArushaDar-es-salaamDodomaGeitaIringaKageraKaskazini PembaKaskazini UngujaKataviKigomaKilimanjaroKusini PembaKusini UngujaLindiManyaraMaraMbeyaMjini MagharibiMorogoroMtwaraMwanzaNjombePwaniRukwaRuvumaShinyangaSimiyuSingidaSongweTaboraTanga
How it works

Every <path> element in the generated SVG automatically receives data-code and data-name. You can listen for clicks on the parent container to instantly build drill-down experiences, filtering, or regional detail views.


๐Ÿ’ป How to Render Itโ€‹

Implementing the Tanzania map in your project takes just a few lines of code. Since every map is generated as a plain SVG string, the exact same approach works in React, Vue, Angular, Svelte, and vanilla JavaScript.

One pattern, every framework

Generate the SVG with createMap(), inject it into a container, and listen for clicks using the automatic data-code and data-name attributes.

๐Ÿ‘‰ See the full rendering guide for your framework โ†’