O que é uma boa biblioteca para exibir muitos mapas pequenos em uma página da web

Gostaria de criar uma visualização na Web semelhante à seguinte: http://namemapper.babynamewizard.com/namemapper/

Existem boas bibliotecas para fazer isso? O OpenLayers é leve o suficiente para lidar com muitos mapas de uma só vez?

Na verdade, você não precisa do OpenLayers - ou de qualquer outra biblioteca - para os pequenos mapas (como os que estão no topo do seu exemplo). Eles são puramente estáticos (sem panorâmica / zoom / etc) e, portanto, podem ser imagens simples, exibindo a resposta de um servidor de mapas de sua escolha.

OpenLayers podem ser usados ​​para muitos mapas estáticos; No passado, criei até 200 mapas em uma única página sem uma enorme penalidade de desempenho, desde que sejam mapas simples. Muitos sites usaram pequenos mapas estáticos do OpenLayers para criar mapas simples, porque então eles podem usar o mesmo conjunto de blocos de imagem que usam para muitos outros mapas em seus sites.

Ao usar OpenLayers como esse, recomendo usar um número limitado de camadas e controles, além de opções como "buffer: 0" para limitar o número de blocos carregados. Seu objetivo deve ser o de minimizar o número de elementos DOM criados pelo OpenLayers, pois esse será o principal gargalo de desempenho para o carregamento da sua página ou aplicativo.

Para aplicativos em que você não está pré-armazenando em cache todos os dados do bloco ou não está trabalhando com dados vetoriais, usar uma única solicitação de imagem para um servidor de mapa de algum tipo pode ser uma escolha melhor. Se você estiver trabalhando com dados lado a lado ou quiser usar dados vetoriais renderizados pelo cliente, o OpenLayers é uma opção razoável para resolver o caso de uso.

O HTML pode ser usado para criar mapas estáticos simples, sem nenhum material do lado do servidor, como um WMS, ou bibliotecas do lado do cliente, como o OpenLayers. Use uma imagem rasterizada da área do mapa em combinação com o mapa e a área de tags do HMTL , o último com a forma do atributo configurada como 'poly'. Você teria que fornecer as cordas do mapa da borda em relação ao canto superior esquerdo do objeto do mapa. Além disso, eventos como onmouseover ou onclick são suportados.

• Mapa HTML (w3schools.com)
• Mapas de imagem do lado do cliente: os elementos MAP e AREA (Recomendação W3C)

EDITADO EM 26-09-2010 01:25 CET: Um exemplo de mapa de imagem HTML pode ser encontrado em ' iCITA: Exemplo de mapa de imagem '