{"id":3094,"date":"2016-01-06T14:36:29","date_gmt":"2016-01-06T12:36:29","guid":{"rendered":"http:\/\/reddescartes.org\/documentacion\/?p=3094"},"modified":"2021-08-06T11:44:52","modified_gmt":"2021-08-06T10:44:52","slug":"comunicacion-descartes-google-maps","status":"publish","type":"post","link":"https:\/\/reddescartes.org\/documentacion\/comunicacion-descartes-google-maps\/","title":{"rendered":"Comunicaci\u00f3n Descartes-Google Maps"},"content":{"rendered":"<hr \/>\n<p>En este art\u00edculo se describe el proceso de comunicaci\u00f3n entre una escena Descartes y una p\u00e1gina web que integra un mapa de Google Maps.\u00a0Google Maps es un servidor de aplicaciones de mapas en la web que pertenece a Google. Ofrece im\u00e1genes de mapas desplazables, as\u00ed como fotograf\u00edas por sat\u00e9lite del mundo e incluso la ruta entre diferentes ubicaciones o im\u00e1genes a pie de calle con Google Street View.<\/p>\n<p>La interacci\u00f3n entre la escena de Descartes y la p\u00e1gina web aprovecha el manejador de eventos propuesto en el art\u00edculo \u00ab<a href=\"https:\/\/reddescartes.org\/documentacion\/?p=2729\">Comunicaci\u00f3n escena-html usando DescartesJS<\/a>\u00bb y la API de\u00a0<a href=\"https:\/\/developers.google.com\/maps\/documentation\/javascript\/?hl=es\">Google Maps Javascript<\/a>\u00a0para controlar las acciones del usuario.<\/p>\n<p>En el siguiente objeto interactivo usado para afianzar el conocimiento de las capitales del continente americano, se propone localizar en un mapa de Google Maps la capital de un determinado pa\u00eds.\u00a0Dicho objeto est\u00e1 formado por una p\u00e1gina html que sostiene dos grandes contenedores: el primer bloque soporta una escena de Descartes embebida mediante un iframe (ubicado a la izquierda) y el segundo, un mapa de Google Maps (ubicado a la derecha).<\/p>\n<div><iframe class=\"iframe-class\" src=\"https:\/\/reddescartes.org\/repositorio\/testCapital\/index.html\" width=\"960\" height=\"530\" frameborder=\"0\" scrolling=\"no\"><\/iframe><\/div>\n<p style=\"text-align: center;\">(Puedes descargar esta escena desde este <a href=\"https:\/\/reddescartes.org\/repositorio\/testCapital.zip\">enlace<\/a>)<\/p>\n<p>La comunicaci\u00f3n entre la escena de Descartes y la p\u00e1gina html tiene lugar en 3 momentos:<\/p>\n<ol>\n<li>\u00a0Env\u00edo de la pregunta desde la escena de Descartes<\/li>\n<li>Gesti\u00f3n de la pregunta y env\u00edo de las respuesta desde el archivo html hasta la escena de Descartes.<\/li>\n<li>Administraci\u00f3n de respuestas desde la escena de Descartes.<\/li>\n<\/ol>\n<p>En la primera fase, internamente la escena de Descartes (incluida en el archivo comunicacion_Descartes.html) carga\u00a0las capitales, configura las variables que controlan las respuestas del usuario y ordena los pa\u00edses de manera aleatoria, y despu\u00e9s env\u00eda una pregunta a la p\u00e1gina html en la que est\u00e1 embebida como iframe y que se denomina indexb.html. Este proceso es controlado por el c\u00f3digo javascript incluido en comunica.js.<\/p>\n<p>En la segunda etapa, la p\u00e1gina indexb.html administra la interacci\u00f3n del usuario con el mapa y env\u00eda la respuesta a la escena de Descartes a trav\u00e9s de el c\u00f3digo javascript externo incluido en mapa.js. Este documento tambi\u00e9n es responsable de la construcci\u00f3n y configuraci\u00f3n del mapa.<\/p>\n<p>Finalmente, en la fase tercera, la escena de Descartes valida los resultados, controla los aciertos y desaciertos, y a continuaci\u00f3n reinicia el ciclo con una nueva pregunta.<\/p>\n<hr \/>\n<pre>Nota: \u00a0La escena y el procedimiento han sido desarrollados por Diego Luis Feria G\u00f3mez de Barranquilla (Colombia), socio de <a href=\"https:\/\/coldescartes.org\/\" target=\"_blank\" rel=\"license noopener noreferrer\">Red Educativa Digital Descartes Colombia<\/a><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>En este art\u00edculo se describe el proceso de comunicaci\u00f3n entre una escena Descartes y una p\u00e1gina web que integra un mapa de Google Maps.\u00a0Google Maps es un servidor de aplicaciones de mapas en la web que pertenece a Google. Ofrece im\u00e1genes de mapas desplazables, as\u00ed como fotograf\u00edas por sat\u00e9lite del mundo e incluso la ruta entre diferentes ubicaciones o im\u00e1genes a pie de calle con Google Street View. La interacci\u00f3n entre la escena de Descartes y la p\u00e1gina web aprovecha el manejador de eventos propuesto en el art\u00edculo \u00abComunicaci\u00f3n escena-html usando DescartesJS\u00bb y la API de\u00a0Google Maps Javascript\u00a0para controlar las<\/p>\n<a class=\"more-link\" rel=\"nofollow\" href=\"https:\/\/reddescartes.org\/documentacion\/comunicacion-descartes-google-maps\/\">[Leer m\u00e1s...]<\/a>","protected":false},"author":9,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[103,32],"tags":[],"_links":{"self":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts\/3094"}],"collection":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/comments?post=3094"}],"version-history":[{"count":50,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts\/3094\/revisions"}],"predecessor-version":[{"id":3250,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts\/3094\/revisions\/3250"}],"wp:attachment":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/media?parent=3094"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/categories?post=3094"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/tags?post=3094"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}