Olá comunidade da Alura, estou desenvolvendo um Website com base no Mapa do Brasil dividido nos 26 estados e Distrito federal, cada estado do país poderá receber dinamicamente marcadores a critério de um "click" pelo usuário, no caso o usuario vai adicionar essa marcação. A marcação depois de adicionada também terá que no ato do "click" mostrar uma janela de interação com textos e imagens . Eu mapeei no Html utilizando a Tag " map " e " area " todos os estados do brasil, mas agora estou com uma dificuldade em pensar como fazer para armazenar em cada estado essa marcação sou novo em linguagens web, acolho qualquer sugestão, desde biblioteca ou conteúdos que possam de alguma forma de solucionar esse problema, ou ao menos guiar-me.
<!DOCTYPE html>
<html>
<head>
<title>Mapa do Brasil</title>
<img src="3068.png" alt="tst" usemap="#Map" />
<link rel="stylesheet" type="text/css" href="teste.css" />
</head>
<body>
<map name="Map" id="Map">
<area alt="RS" title="Rio grande do Sul" href="#" shape="poly" coords="451,713,448,702,452,697,446,685,425,673,409,653,390,656,414,622,443,606,463,602,480,611,493,622,508,635"/>
<area alt="SC" title="Santa Catarina" href="#" shape="poly" coords="515,631,505,628,503,621,490,613,480,604,468,600,448,597,447,582,477,589,503,581,515,585,528,581,524,620" />
</map>
</body>
</html>