Mapa estilo Idealista  

Hola

Una extensión de mapas google podrías ayudarte hasta cierto punto.
Revias por ejemplo : https://wordpress.org/plugins/wp-google-maps/screenshots/

PD. Siempre que consultes envía la url de tu sitio web.

Saludos.

Gracias por la respuesta Jhon,
Fíjate en el ejemplo que te doy, en el mapa no viene marcado ningún punto en concreto.
A medida que haces click en un lugar de mapa se te va acercando, una vez te acercas lo suficiente se te muestran todos los lugares
PD: 2belleza.com, aunque para este caso esta url no te va a ayudar para nada puesto que es una idea que quiero implementar y estoy pensando en como hacerlo

Hola,

Por lo que veo, este mapa de Idealista, está creado utilizando HTML y sus etiquetas area, para mapear por zonas una imagen, de forma que cada trozo de imagen cargue un enlace diferente.

En internet veo que hay algunas herramientas online para generar este código de una forma más automatizada. Algunas opciones serían las siguientes:

http://imagemap-generator.dariodomi.de/

https://www.image-maps.com/

http://www.maschek.hu/imagemap/imgmap

https://www.image-map.net/

Pablo, antes que nada darte las gracias por tu respuesta.
Tengo un problema y es que en la versión móvil las áreas se me descolocan.
¿Hay alguna forma de que las coordenadas se mantengan con el cambio de dimensiones?
Es decir que las medidas se vayan adaptando en función del tamaño del explorador
(en el ejemplo del idealista se puede observar como el código html de las coordenadas va cambiando en función de las dimensiones)
Gracias

PROBLEMA SOLUCIONADO:
Plug In: Responsive Image Maps