{"id":2123,"date":"2010-12-08T20:34:08","date_gmt":"2010-12-08T18:34:08","guid":{"rendered":"http:\/\/alpoma.net\/carto\/?p=2123"},"modified":"2010-12-08T20:34:08","modified_gmt":"2010-12-08T18:34:08","slug":"mobilymap-mapas-con-jquery","status":"publish","type":"post","link":"https:\/\/alpoma.net\/carto\/?p=2123","title":{"rendered":"MobilyMap, mapas con jQuery"},"content":{"rendered":"<p><a href=\"http:\/\/www.flickr.com\/photos\/alpoma\/5244017175\/\" title=\"img5 by alpoma, on Flickr\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/farm6.static.flickr.com\/5081\/5244017175_1e0aa94288_m.jpg\" width=\"240\" height=\"157\" alt=\"img5\" class=\"dch\"\/><\/a>Me encanta, es tan sencillo pero a la vez tan imaginativo que no puedo mejos que aconsejar, al menos, explorarlo con calma. Se trata de <strong><a href=\"http:\/\/playground.mobily.pl\/jquery\/mobily-map.html\">MobilyMap<\/a><\/strong>, un plugin basado en <em>jQuery<\/em> que<strong> permite crear sencillos mapas interactivos<\/strong>. La idea es realmente simple, y toda ella se puede llevar a cabo con una rapidez pasmosa con s\u00f3lo teclear algo de c\u00f3digo que, por otra parte, es muy sencillo tambi\u00e9n. Se toma una imagen a modo de tapiz, que ser\u00e1 nuestro mapa base. Luego insertamos con HTML la imagen con su tama\u00f1o adecuado para ser visualizado en web y llamamos a un al script del para que \u00abdibuje\u00bb sobre el mapa <strong><a href=\"http:\/\/playground.mobily.pl\/jquery\/mobily-map\/demo.html\">burbujas interactivas<\/a><\/strong> en los puntos deseados del mapa. Ya est\u00e1, as\u00ed tendremos un mapa interactivo preparado para cualquier web, sin depender de un servicio externo. Vale, es muy simple y no permite grandes cosas pero, cuando se busca algo que no vaya m\u00e1s all\u00e1 de un mapa con pocos puntos y sus descripciones, \u00bfqui\u00e9n necesita m\u00e1s? \ud83d\ude09<\/p>\n","protected":false},"excerpt":{"rendered":"<div class=\"mh-excerpt\"><p>Me encanta, es tan sencillo pero a la vez tan imaginativo que no puedo mejos que aconsejar, al menos, explorarlo con calma. Se trata de <a class=\"mh-excerpt-more\" href=\"https:\/\/alpoma.net\/carto\/?p=2123\" title=\"MobilyMap, mapas con jQuery\">[&#8230;]<\/a><\/p>\n<\/div>","protected":false},"author":1,"featured_media":4485,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[10],"tags":[],"class_list":["post-2123","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-experimentos"],"jetpack_featured_media_url":"https:\/\/alpoma.net\/carto\/wp-content\/uploads\/2010\/12\/5244017175_1e0aa94288_m.jpg","jetpack_shortlink":"https:\/\/wp.me\/p93Co9-yf","jetpack-related-posts":[{"id":4081,"url":"https:\/\/alpoma.net\/carto\/?p=4081","url_meta":{"origin":2123,"position":0},"title":"Mapas vectoriales interactivos con jQuery Mapael","author":"alpoma","date":"octubre 7, 2013","format":false,"excerpt":"jQuery Mapael es un proyecto de Vincent Brout\u00e9, @VincentBroute, que se ofrece bajo licencia MIT y cuyo c\u00f3digo fuente puede encontrarse, c\u00f3mo no, en GitHub. Se trata de un sencillo plugin para jQuery basado en raphael.js que permite mostrar de forma din\u00e1mica mapas vectoriales en pantalla. Es una forma m\u00e1s\u2026","rel":"","context":"En \u00abEn l\u00ednea\u00bb","block_context":{"text":"En l\u00ednea","link":"https:\/\/alpoma.net\/carto\/?cat=5"},"img":{"alt_text":"ejemplo","src":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2013\/10\/ejemplo.png?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":917,"url":"https:\/\/alpoma.net\/carto\/?p=917","url_meta":{"origin":2123,"position":1},"title":"C\u00f3mo convertir una imagen en mapa interactivo con uMapper","author":"alpoma","date":"octubre 11, 2009","format":false,"excerpt":"El t\u00edtulo es largo, pero lo dice todo y poco m\u00e1s hay que a\u00f1adir. Recientemente uMapper ha a\u00f1adido una nueva funcionalidad a su sistema de creaci\u00f3n de mapas interactivos. Ahora ya no s\u00f3lo se podr\u00e1 contar con mapas procedentes de Google Maps, OpenStreetMap y similares, sino que se ha habilitado\u2026","rel":"","context":"En \u00abExperimentos\u00bb","block_context":{"text":"Experimentos","link":"https:\/\/alpoma.net\/carto\/?cat=10"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3813,"url":"https:\/\/alpoma.net\/carto\/?p=3813","url_meta":{"origin":2123,"position":2},"title":"Toner, el mundo en blanco y negro","author":"alpoma","date":"febrero 16, 2013","format":false,"excerpt":"He recibido algunos comentarios sobre la nota en que mencionaba OpenStreetPosters. S\u00ed, esos mapas en blanco y negro son muy atractivos pero, \u00bfde d\u00f3nde salen? Aunque ya lo coment\u00e9 en otra ocasi\u00f3n, no est\u00e1 de m\u00e1s recordar que es uno de los \"estilos\" para OpenStreetMap creados por Stamen Maps. Otro\u2026","rel":"","context":"En \u00abCartograf\u00eda\u00bb","block_context":{"text":"Cartograf\u00eda","link":"https:\/\/alpoma.net\/carto\/?cat=9"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2013\/02\/8478629549_72c1bb9006_o.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2013\/02\/8478629549_72c1bb9006_o.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2013\/02\/8478629549_72c1bb9006_o.png?resize=525%2C300&ssl=1 1.5x"},"classes":[]},{"id":6195,"url":"https:\/\/alpoma.net\/carto\/?p=6195","url_meta":{"origin":2123,"position":3},"title":"Las m\u00e1s antiguas representaciones cartogr\u00e1ficas de las corrientes marinas","author":"alpoma","date":"julio 30, 2015","format":false,"excerpt":"Los mapas que representan las corrientes oce\u00e1nicas superficiales son comunes hoy d\u00eda, cuando contamos con mapas que van desde lo sencillo a lo m\u00e1s abigarrado. Pero no hace tanto tiempo, tanto la propia concepci\u00f3n de lo que son las corrientes marinas como su representaci\u00f3n m\u00e1s o menos certera, constitu\u00edan grandes\u2026","rel":"","context":"En \u00abViejos mapas\u00bb","block_context":{"text":"Viejos mapas","link":"https:\/\/alpoma.net\/carto\/?cat=4"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2015\/07\/corrientes_marinas_1685.jpg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2015\/07\/corrientes_marinas_1685.jpg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2015\/07\/corrientes_marinas_1685.jpg?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2015\/07\/corrientes_marinas_1685.jpg?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2015\/07\/corrientes_marinas_1685.jpg?resize=1050%2C600&ssl=1 3x, https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2015\/07\/corrientes_marinas_1685.jpg?resize=1400%2C800&ssl=1 4x"},"classes":[]},{"id":1242,"url":"https:\/\/alpoma.net\/carto\/?p=1242","url_meta":{"origin":2123,"position":4},"title":"Wapenmap: mapas met\u00e1licos","author":"alpoma","date":"enero 15, 2010","format":false,"excerpt":"La sorpresa del d\u00eda, sin duda. Se trata de los Wapenmap, cuyo planteamiento es muy sencillo, pero original. Partiendo de finas l\u00e1minas de acero, se perfila sobre ellas el conjunto de curvas de nivel a modo de mapa topogr\u00e1fico, pero claro, no se `dibuja\u00b4 con tinta, sino que se hace\u2026","rel":"","context":"En \u00abExperimentos\u00bb","block_context":{"text":"Experimentos","link":"https:\/\/alpoma.net\/carto\/?cat=10"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2010\/01\/4277246172_9c66a64acf_o.jpg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2010\/01\/4277246172_9c66a64acf_o.jpg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2010\/01\/4277246172_9c66a64acf_o.jpg?resize=525%2C300&ssl=1 1.5x"},"classes":[]},{"id":4238,"url":"https:\/\/alpoma.net\/carto\/?p=4238","url_meta":{"origin":2123,"position":5},"title":"El mapa-traductor europeo","author":"alpoma","date":"abril 15, 2014","format":false,"excerpt":"Este curioso mapa interactivo, creado por UK Data Explorer, es un sencillo experimento inspirado por los tan de moda \"mapas etimol\u00f3gicos\". Construido empleando la librer\u00eda de javascript D3 sobre una base cartogr\u00e1fica de Natural Earth, junto con la API del traductor de Google, nos presenta una idea sencilla: se introduce\u2026","rel":"","context":"En \u00abExperimentos\u00bb","block_context":{"text":"Experimentos","link":"https:\/\/alpoma.net\/carto\/?cat=10"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/alpoma.net\/carto\/wp-content\/uploads\/2014\/04\/mapa_traductor-300x2931.jpg?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]}],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=\/wp\/v2\/posts\/2123","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2123"}],"version-history":[{"count":0,"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=\/wp\/v2\/posts\/2123\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=\/wp\/v2\/media\/4485"}],"wp:attachment":[{"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2123"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2123"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/alpoma.net\/carto\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2123"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}