Deberías colocar mediante css cada uno de esos puntos donde tu quieras, usando un position:absolute, y determinar un top y un left para cada uno. Por ejemplo:
Insertar CODE, HTML o PHP:
#tooltip_1{
position:absolute;
top:100px;
left:250px;
}
Solo con ese código deberías ser capaz de colocar cada uno de los puntos a tu antojo a lo largo de la imagen.
Si colocas la imagen a pantalla completa, como se hace en la página que estás poniendo de ejemplo, te recomiendo que tengas cuidado, ya que si no creas una solución Responsive para la imagen de fondo, la imagen cambiará de tamaño en diferentes pantallas, lo que haría inútil haber colocado los puntos en la posición que tu querías.
Por lo tanto, la imagen que coloques deberá tener siempre el mismo tamaño y deberá estar siempre centrada e independiente del cambio del ancho del navegador. Además, deberás añadir una imagen de fondo que si que sea dinámica a lo largo de los diferentes anchos de pantalla.
Espero haberte ayudado. Un saludo.
7:
