Creación de áreas en imágenes

Para poder crear áreas, seleccionar un fichero de imagen (gif/jpg), y a continuación pulse sobre el botón "Crear Mapa"... Se abrirá una página con la imagen que ha seleccionado, pudiendo de esta manera, crear las areas, seleccionando con el ratón los extremos de los polígonos de cada área... si se tratase de rectángulos la selección sería de los ángulos opuestos, y con los círculos la selección primera sería del centro y luego algún punto del perímetro.

El mapa que se aprecia a continuación es un ejemplo del uso de esta aplicación. Debido al incremento de tamaño de las páginas con este sistema, solo se han creado 3 áreas ubicadas en: Europa (rectángulo), Oceanía (círculo) y Madagascar (polígono).

Loa atributos que se generan son: href (enlace), shape (tipo de área), title (título), alt (mensaje alternativo) y coords (lista de coordenadas del polígono)... Después de generar las áreas, es conveniente copiar el contenido de las etiquetas obtenidas al portapapeles, y ubicarlo en la página donde quiera insertar el mapa.

Las imágenes son subidas a una base de datos, y serán accesibles para cualquier otro usuario, así que quién utilice una imagen con derechos, le ruego que se pongan en contacto conmigo a este correo: webmaster@caricatos.net para eliminarla de la citada base de datos.


Mapa de ejemplo

mapa transparencia
Oceanía Europa Madagascar

Nota:Provisionalmente hemos desactivado la opción para subir las imágenes al servidor porque se incrementaba mucho nuestra base de datos, disculpen las molestias.

Pueden obtenerse mapas desde imágenes con colores planos desde esta otra página: Capturar áreas en imágenes .




Comentarios

Nombre: Caricatos
Procedencia: España
URL: http://www.caricatos.net
Fecha de envío: 10 de febrero de 2016, a las 09:43.
Valoración:
comentario:

Hola:

Respondiendo a yoandris: Hemos puesto el código en un mensaje de los foros del web: gd-tecnica-grafica.
La respuesta a Max Gonzalez sería algo más compleja, aunque nos ahorraremos de html5 ya que en el momento de crear la página no existía... pero como pista, un control image de un formulario hace de control submit añadiendo las coordenadas de donde se ha pinchado. Con dos coordenadas podemos saber el radio del círculo que encierra con el cálculo de la hipotenusa.

Saludos emoticón


Nombre: Max Gonzalez
Procedencia: Chile
E-Mail: maxgonpe@gmail.com
Fecha de envío: 9 de febrero de 2016, a las 22:40.
Valoración:
comentario:

Envien por favor las pistas por donde llegar a re-construir el ejemplo que presentan, al menos los elementos que se deben considerar, por ejemplo librerias, sentencias, php con html5? etc. Gracias. espero me contesten


Nombre: yoandris
Procedencia: venezuela
Fecha de envío: 26 de octubre de 2011, a las 19:37.
Valoración:
comentario:

Hola necesito mapear una imagen para que me quede parecido a como esta el ejemplo en el sitio.
Estuve mirando el codigo html de la pagina y no se de donde sale el:
<img id='area1' alt="oceanía" src='gifshapeurl.php?url=WORLD3.gif&amp;shape=circle&amp;borde=000000&amp;coors=619,281,65' style='position: absolute; top: 0; left: 0; margin: 0; visibility: hidden;' />

Mi pregunta es la siguiente donde puedo obtener el gifshapeurl.php y cual es su funcion principal.
Les agradeceria cualquier ayuda.


Nombre: vito
Procedencia: forosdelweb
URL: http://www.vitovi.com
Fecha de envío: 4 de octubre de 2010, a las 11:15.
Valoración:
comentario:

Hola, quisiera saber si es posible cambiar el color a las zonas mapeadas, de modo dinamico, para poder distinguirlas de las q no estan mapeadas.

Mi proyecto es un mapa de España donde poder señalar las provincias donde conozco a alguien, como esto no se cuando cambiara, necesitaria poder cambiar el color de las zonas de un modo dinamico en funcion de los datos de la BBDD.

Un saludo.


Nombre: SunYo
Procedencia: VGA
URL: http://www.myspace.com/sunyo
Fecha de envío: 13 de enero de 2009, a las 12:13.
comentario:

No me deja subir una imagen de 1,16MB, me pone que no se puede guardar la imagen o algo así.


Colabore enviando su comentario

Nombre
Procedencia
Página web
E-mail *
Evaluación evaluarevaluarevaluarevaluarevaluarevaluarevaluarevaluarevaluarevaluar
Código de envío

Rellene este campo con la clave de la imagen: codigo de envío

Nota Importante

El campo E-Mail es obligatorio para activar por correo electrónico el comentario (si no desea que se haga público, marque la casilla "anonimato"). También es obligatorio el código "captcha" (el número que se ve en la imagen adjunta); y por supuesto, debe existir un comentario.

Puede encontrar información sobre este sistema de comentarios en este enlace: Ponga comentarios en su web.

Edición negrita cursiva subrayado   alineación izquierda alineación derecha alineación centrada alineación justificada   Insertar enlace insertar imagen   Emoticones: [:)] [:(] [:x] [BIEN] [MAL] [SI] [NO] [APLAUSOS] [MEJORABLE] [¡A VER!] [¡DÉJAME PENSAR!] [FLIPE] [¡SIN PALABRAS!]
Copyright © 2006-2018 www.caricatos.net
Visitas: 8936