Mapka konturowa miasta - Jak i w czym zrobić? Opcje

[Garem2018]

Witam,

[ Jeśli to nie ten dział, proszę moderatorów o przeniesienie ! ]

Potrzebuję zrobić mapkę konturową miasta, z podziałem na dzielnice. Każda dzielnica miała by granice oznaczone linią (grubość kilku pixeli). Mapka otwiera się na pełny ekran (lub wypełnia całe okno przeglądarki), a więc musi być skalowalna od starych monitorów po 4K.

Na środku obszaru dzielnicy miałyby się wyświetlać dwie wartości liczbowe, każda dzielnica klikalna i oczywiście kliknięcie myszką powoduje przekierowanie na stronę odpowiadającą danej dzielnicy.

Chyba wszystko jasne? Pytanie w jakiej technologii to wykonać Grafikę jako SVG? Chciałbym pozostać przy HTML5, CSS3 i JS, bez żadnych frameworków JS, ew. JQuery.

Co polecacie, jakie technologie?

Mapkę będę miał w JPG, jak nanieść granice dzielnic i jak najlepiej to obsłużyć w JS? (kiedyś takie rzeczy robiło się we Flash, SilverLight czy apletach Java, ale to już nie te czasy ).

Może jakiś tutorial, gotowy przykład do wykorzystania ?

Dzięki!

Pozdr. Garem

[Comandeer]

Najłatwiej byłoby w SVG, co załatwia problem skalowania out of box. Co do przykładu, może coś takiego: https://websitebeaver.com/how-to-make-an-in...states-capitals ?