Skip to content

GeoJSON na SVG Konvertor

Převeďte GeoJSON na SVG (Scalable Vector Graphics) pro rozlišení nezávislé, editovatelné mapy. Ideální pro loga, tiskové materiály, prezentace a použití na webu.

Proč SVG?

Nezávislost na rozlišení

  • Perfektní škálování na jakoukoli velikost bez ztráty kvality
  • Připravené pro tisk v jakémkoli rozlišení
  • Perfektní vzhled na Retina/4K displejích
  • Nekonečné přiblížení bez pixelace

Editovatelnost

  • Otevřete v Illustratoru, Inkscape nebo Figma pro pokročilé úpravy
  • Změňte barvy, obrysy, výplně po exportu
  • Přidejte text, poznámky, loga pomocí designového softwaru
  • Snadno kombinujte s jinou grafikou

Přátelské pro web

  • Malé velikosti souborů pro jednoduché mapy
  • Styling pomocí CSS — stylování přímo na webových stránkách
  • Animace pomocí JavaScriptu — animace cest a vlastností
  • Vkládání inline — vložte přímo do HTML
  • Přístupné — čtečky obrazovky mohou číst obsah SVG

Použití

Loga a branding — Mapy umístění společnosti
Tiskové materiály — Brožury, plakáty, knihy
Webová grafika — Ikony, odznaky, prvky uživatelského rozhraní
Vizualizace dat — Infografiky, dashboardy
Merchandise — Trička, samolepky, hrnky
Prezentace — Snímky, které se krásně škálují

Jak převést

  1. Nahrajte svůj GeoJSON soubor (přetáhněte nebo vyberte)
  2. Náhled vykreslení mapy
  3. Formát je automaticky nastaven na SVG
  4. Stáhněte svou vektorovou mapu

Nástroj generuje čistý, optimalizovaný SVG kód, který funguje všude.

Funkce SVG

Co získáte

  • Čistý kód — Čitelný SVG markup
  • Standardní formát — Kompatibilní se všemi designovými nástroji
  • Optimalizované cesty — Zjednodušené pro menší velikosti souborů
  • Správný viewBox — Správně škálované
  • Geografická projekce — Otočeno pro orientaci na sever

Úpravy po exportu

Otevřete svůj SVG v:

  • Adobe Illustrator — Profesionální úpravy vektorů
  • Inkscape — Bezplatná, open-source alternativa
  • Figma — Designový nástroj v prohlížeči
  • Sketch — Designový software pro Mac
  • Jakýkoli textový editor — SVG je pouze XML

Možnosti stylování

  • Barva obrysu — Barva čar pro hranice
  • Šířka obrysu — Tloušťka čar
  • Barva výplně — Barva vnitřních polygonů
  • Průhlednost — Úroveň transparentnosti
  • Pozadí — Transparentní nebo barevné

Běžné případy použití

Design & Branding

  • Mapy umístění společnosti pro webové stránky
  • Mapy regionálního pokrytí pro marketing
  • Mapy oblastí služeb pro prezentace
  • Sady ikon z jednoduchých geometrických tvarů

Tiskové publikace

  • Ilustrace do knih — Cestovní průvodce, učebnice
  • Grafika do časopisů — Redakční mapy
  • Plakáty — Mapy událostí, materiály na konference
  • Vizitky — Mapy umístění na kartách

Webový vývoj

  • Interaktivní mapy pomocí CSS/JS
  • Animované cesty — Animace kreslení
  • Responzivní grafika — Škálování s viewportem
  • Knihovny ikon — Znovupoužitelné mapové ikony

Merchandise

  • Designy triček — Obrysy států/zemí
  • Samolepky — Geografické tvary
  • Hrnky a šálky — Produkty založené na lokalitě
  • Plakáty — Minimalistické mapové umění

Tipy pro nejlepší výsledky

Optimalizace velikosti souboru

  • Zjednodušte geometrie před exportem (použijte GeoJSON Minifier)
  • Odstraňte nepotřebné atributy z vlastností GeoJSON
  • Spojte sousední polygony, pokud je to možné
  • Použijte méně desetinných míst v souřadnicích

Designové tipy

  • Udržujte to jednoduché — SVG funguje nejlépe pro čisté, přehledné mapy
  • Používejte plné barvy — Vyhněte se složitým přechodům
  • Testujte na různých velikostech — Zajistěte čitelnost při škálování
  • Zvažte poměr obrysu k výplni — Silné obrysy mohou převládnout nad malými mapami

Výkon na webu

  • Vkládejte malé SVG inline — Vložte přímo do HTML
  • Externí soubory pro velké mapy — Odkaz na .svg soubor
  • Lazy load — Načítejte SVG, když je viditelné
  • Komprimujte — Použijte SVGO nebo podobné nástroje pro optimalizaci

Technické detaily

Projekce

  • Web Mercator ve výchozím nastavení (standard pro webové mapy)
  • Osa Y je otočená tak, aby sever byl nahoře (SVG má Y dolů ve výchozím nastavení)
  • Souřadnice zachovány pro přesné geografické zobrazení

Struktura SVG

xml
<svg viewBox="minX minY width height">
  <path d="M x,y L x,y..." />
  <!-- Jedna cesta na prvek -->
</svg>

Kompatibilita prohlížečů

  • ✅ Všechny moderní prohlížeče (Chrome, Firefox, Safari, Edge)
  • ✅ IE 9+ (základní podpora)
  • ✅ Mobilní prohlížeče (iOS Safari, Chrome)

Často kladené otázky

Mohu SVG upravit po exportu?
Ano! Otevřete jej v jakémkoli editoru vektorů (Illustrator, Inkscape, Figma atd.) a změňte barvy, přidejte text nebo upravte tvary.

Podporuje SVG transparentnost?
Ano, SVG nativně podporuje transparentní pozadí a úrovně průhlednosti.

Jaká je velikost souboru?
SVG soubory jsou obvykle malé (několik KB) pro jednoduché mapy. Komplexní mapy s mnoha prvky budou větší.

Mohu použít SVG pro tisk?
Rozhodně! SVG je nezávislé na rozlišení a ideální pro tisk v jakékoli velikosti.

Jak mohu změnit barvy?
V textovém editoru najděte atributy stroke a fill a změňte hodnoty barev. Nebo použijte designový software pro vizuální úpravy.

Mohu animovat SVG mapy?
Ano! SVG lze animovat pomocí CSS nebo JavaScriptu. Každou cestu lze individuálně stylovat a animovat.

Je konverze bezztrátová?
Ano, geografická data jsou přesně zachována. Některé vizuální zjednodušení může nastat u velmi složitých tvarů.

Viz také