{"id":29706,"date":"2020-11-24T13:33:01","date_gmt":"2020-11-24T13:33:01","guid":{"rendered":"https:\/\/www.northafricatrees.org\/buscador-geografico\/"},"modified":"2026-10-28T15:16:02","modified_gmt":"2026-10-28T15:16:02","slug":"geographical-search","status":"publish","type":"page","link":"https:\/\/www.northafricatrees.org\/en\/geographical-search\/","title":{"rendered":"Geographical Search"},"content":{"rendered":"<div class=\"wpb-content-wrapper\" id=\"wpb-content-root\"><section class=\"l-section wpb_row us_custom_887a049b height_medium width_full\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row type_default valign_top\"><div class=\"vc_col-sm-12 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"wpb_text_column\" ><div class=\"wpb_wrapper\">\n<\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/section><section class=\"l-section wpb_row height_medium\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row type_default valign_top\"><div class=\"vc_col-sm-12 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"wpb_text_column\" ><div class=\"wpb_wrapper\"><input type=\"hidden\" id=\"lang\" name=\"lang\" value=\"en\">\n\n<!-- Cargamos la API de Google Maps limpia, sin la librer\u00eda obsoleta \"drawing\" -->\n<script src=\"https:\/\/maps.googleapis.com\/maps\/api\/js?key=AIzaSyBGqmUPyiq0sW6DujX5B8gGjBFXynmkqaU\"><\/script>\n\n<div id=\"searcher-map\" class=\"g-cols vc_row type_default valign_top\">\t\n\t<div class=\"loading\">\n\t\t<div class=\"loader-container\">\n\t\t\t<p>This may take a while, be patient<\/p>\n\t\t\t<img decoding=\"async\" src=\"https:\/\/www.northafricatrees.org\/wp-content\/uploads\/2021\/01\/loading.svg\" alt=\"Loading\"\/>\n\t\t<\/div>\n\t<\/div>\n\t<div class=\"vc_col-sm-5 wpb_column vc_column_container species-container\">\n\t\t<div class=\"vc_column-inner\">\n\t\t\t<div class=\"wpb_wrapper\">\n\t\t\t\t<h1>Species List<\/h1>\n\t\t\t\t<div id=\"species-list-searcher\"><\/div>\n\t\t\t<\/div>\n\t\t\t<div class=\"wpb_wrapper load-more-species-container\" style=\"margin-top: 1rem;align-self: center; opacity: 0;\">\n\t\t\t\t<button class=\"w-btn us-btn-style_1\" id=\"load-more-species\"><i class=\"fal fa-plus\"><\/i> Load more<\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t<div class=\"vc_col-sm-7 wpb_column vc_column_container map-container\">\n\t\t<div class=\"vc_column-inner type_sticky\">\n\t\t\t<div class=\"wpb_wrapper\">\n\t\t\t\t<div class=\"map-block\">\n\t\t\t\t\t<div class=\"buttons-container\">\n\t\t\t\t\t\t<button class=\"w-btn us-btn-style_1\" id=\"drawBtn\"><i class=\"fal fa-rectangle-landscape\"><\/i> Draw search area<\/button>\n\t\t\t\t\t\t<button class=\"w-btn us-btn-style_1\" id=\"moveBtn\" style=\"display: none;\"><i class=\"fal fa-hand-rock\"><\/i> Move around the map<\/button>\n\t\t\t\t\t\t<button class=\"w-btn us-btn-style_1\" id=\"deleteBtn\"><i class=\"fal fa-trash\"><\/i> Reset search<\/button>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class=\"messages-container\">\n\t\t\t\t\t\t<span id=\"drawMessage\" style=\"display: none;\">Search for species by drawing a rectangle on the map<\/span>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div id=\"map\" style=\"width: 100%;\"><\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n<\/div>\n\n<script type=\"text\/javascript\">\n\tconst notFoundMessage = {\n\t\t'es': 'No se han encontrado especies en la zona seleccionada',\n\t\t'en': 'No species found in the selected area',\n\t\t'fr': 'Aucune esp\u00e8ce trouv\u00e9e dans la zone s\u00e9lectionn\u00e9e'\n\t};\n\tlet state = {\n\t\tloadSpecies: true,\n\t\tloadProductsCompleted: true,\n\t\tpage: 1\n\t};\n\tlet myRectangle = null;\n\tlet map = null;\n\tlet bounds = null;\n\t\n\t\/\/ Variables para el dibujo manual nativo\n\tlet isDrawing = false;\n\tlet isDrawMode = false;\n\tlet startLatLng = null;\n\tlet mapListeners = [];\n\n\tconst optionsMap = {\n\t    zoom: 7,\n\t    center: new google.maps.LatLng(34.6711844, -1.5894153),\n\t    mapTypeId: 'terrain',\n\t    fullscreenControl: false,\n\t};\n\n\tconst element = document.getElementById('map');\n\n\tjQuery(document).ready(function($) {\n\t\tinitMap();\n\t    fetchSpecies();\n\n\t    $(document).on('click', '#drawBtn', clickDrawButton);\n\t   \t$(document).on('click', '#moveBtn', clickMoveButton);\n\t   \t$(document).on('click', '#deleteBtn', clickDeleteButton);\n\t});\n\n\tfunction initMap() {\n\t\ttry {\n\t\t\tif (typeof google === 'undefined' || typeof google.maps === 'undefined') {\n\t\t\t\tconsole.error('Google Maps API no disponible.');\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tmap = new google.maps.Map(element, optionsMap);\n\t\t} catch (e) {\n\t\t\tconsole.error('Error al inicializar Google Maps:', e);\n\t\t}\n\t}\n\n\tfunction enableDrawing() {\n\t\tisDrawMode = true;\n\t\tmap.setOptions({ draggable: false, cursor: 'crosshair' });\n\n\t\t\/\/ Listener para pulsar e iniciar el rect\u00e1ngulo\n\t\tlet mouseDown = map.addListener('mousedown', function(e) {\n\t\t\tif (!isDrawMode) return;\n\t\t\tdeleteRectangle();\n\t\t\tisDrawing = true;\n\t\t\tstartLatLng = e.latLng;\n\n\t\t\tmyRectangle = new google.maps.Rectangle({\n\t\t\t\tmap: map,\n\t\t\t\tbounds: new google.maps.LatLngBounds(startLatLng, startLatLng),\n\t\t\t\tfillColor: \"#185c29\",\n\t\t\t\tfillOpacity: 0.6,\n\t\t\t\tstrokeWeight: 0,\n\t\t\t\tclickable: false,\n\t\t\t\teditable: false,\n\t\t\t\tzIndex: 1\n\t\t\t});\n\t\t});\n\n\t\t\/\/ Listener para arrastrar y cambiar el tama\u00f1o del rect\u00e1ngulo\n\t\tlet mouseMove = map.addListener('mousemove', function(e) {\n\t\t\tif (!isDrawing || !myRectangle) return;\n\t\t\tlet bounds = new google.maps.LatLngBounds();\n\t\t\tbounds.extend(startLatLng);\n\t\t\tbounds.extend(e.latLng);\n\t\t\tmyRectangle.setBounds(bounds);\n\t\t});\n\n\t\t\/\/ Listener para soltar el clic y finalizar el \u00e1rea\n\t\tlet mouseUp = map.addListener('mouseup', function(e) {\n\t\t\tif (!isDrawing) return;\n\t\t\tisDrawing = false;\n\t\t\tdisableDrawing();\n\t\t\tif (myRectangle) {\n\t\t\t\tsetBoundsFilter(myRectangle);\n\t\t\t}\n\t\t});\n\n\t\tmapListeners.push(mouseDown, mouseMove, mouseUp);\n\t}\n\n\tfunction disableDrawing() {\n\t\tisDrawMode = false;\n\t\tif (map) {\n\t\t\tmap.setOptions({ draggable: true, cursor: null });\n\t\t}\n\t\tmapListeners.forEach(listener => google.maps.event.removeListener(listener));\n\t\tmapListeners = [];\n\t\tjQuery('#moveBtn').hide();\n\t\tjQuery('#drawBtn').show();\n\t\tjQuery('#drawMessage').hide();\n\t}\n\n\tfunction resetState() {\n\t\tstate = {\n\t\t\tloadSpecies: true,\n\t\t\tloadProductsCompleted: true,\n\t\t\tpage: 1\n\t\t};\n\t}\n\n\tfunction resetBounds() {\n\t\tbounds = null;\n\t}\n\n\tfunction clickDrawButton() {\n\t\tenableDrawing();\n\t    jQuery('#moveBtn').show();\n\t    jQuery('#drawMessage').show();\n\t    jQuery(this).hide();\n\t}\n\n\tfunction clickMoveButton() {\n\t\tdisableDrawing();\n\t}\n\n\tfunction clickDeleteButton() {\n\t\tdeleteRectangle();\n\t\tresetState();\n\t\tresetBounds();\n\t\tfetchSpecies();\n\t}\n\n\tfunction deleteRectangle() {\n\t\tif (myRectangle != null) {\n\t\t\tmyRectangle.setMap(null);\n\t\t\tmyRectangle = null;\n\t\t}\n\t}\n\n\tfunction setBoundsFilter(rectangle) {\n\t    const rectangleBounds = rectangle.getBounds();\n\t    const rectangleBoundsNorthEast = rectangleBounds.getNorthEast();\n\t    const rectangleBoundsSouthWest = rectangleBounds.getSouthWest();\n\t\t\n        var NW = new google.maps.LatLng(rectangleBoundsNorthEast.lat(), rectangleBoundsSouthWest.lng());\n        var SE = new google.maps.LatLng(rectangleBoundsSouthWest.lat(), rectangleBoundsNorthEast.lng());\n\n\t    bounds = {\n\t        NE: { lat: rectangleBoundsNorthEast.lat(), lng: rectangleBoundsNorthEast.lng() },\n\t        SW: { lat: rectangleBoundsSouthWest.lat(), lng: rectangleBoundsSouthWest.lng() },\n\t\t\tNW: { lat: NW.lat(), lng: NW.lng() },\n\t\t\tSE: { lat: SE.lat(), lng: SE.lng() }\n\t    };\n\n\t    resetState();\n\t    fetchSpecies(bounds);\n\t}\n\n\tfunction fetchSpecies(boundsNESW = null) {\n\t\tif(!state.loadSpecies || !state.loadProductsCompleted) return;\n\n\t\tstate.loadProductsCompleted = false;\n\n\t    var data = {\n\t        action: 'get_species',\n\t        pg: state.page\n\t    };\n\n\t    if (boundsNESW) {\n\t        data['bounds'] = boundsNESW;\n\t    }\n\n\t\tconst currentLang = jQuery('#lang').val() || 'es';\n\n\t    jQuery.ajax({\n\t        type: 'GET',\n\t        url: 'https:\/\/www.northafricatrees.org\/wp-admin\/admin-ajax.php',\n\t        data: data,\n\t        dataType: 'json',\n\t        beforeSend: function() {\n\t            jQuery('.loading').fadeIn();\n\t        },\n\t        error: function(xhr, status, error) {\n\t            console.error('AJAX Error:', error);\n\t\t\t\tjQuery('.loading').fadeOut();\n\t\t\t\tstate.loadProductsCompleted = true;\n\t        },\n\t        success: function(response) {\n\t            var html = '';\n\t            if (response && response.view && response.view !== \"\") {\n\t                html = response.view;\n\t            } else {\n\t\t\t\t\tvar msg = notFoundMessage[currentLang] || notFoundMessage['es'];\n\t\t\t\t\thtml = '<div class=\"not-species-zone\">' + msg + '<\/div>';\n\t\t\t\t}\n\n\t            if(state.page > 1) {\n\t     \t\t   \tjQuery('#species-list-searcher').append(html);\n\t     \t\t} else {\n\t     \t\t   \tjQuery('#species-list-searcher').html(html);\n\t     \t\t}\n\n\t            if(!response || response.count_species < 60) {\n\t            \tstate.loadSpecies = false;\n\t            } else {\n\t            \tstate.page = state.page + 1;\n\t            }\n\t        },\n\t        complete: function() {\n\t            jQuery('.loading').fadeOut();\n\t            state.loadProductsCompleted = true;\n\t        }\n\t    });\n\t}\n<\/script>\n<\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/section>\n<\/div>","protected":false},"excerpt":{"rendered":"This may take a while, be patient Species List Load more Draw search area Move around the map Reset search Search for species by drawing a rectangle on the map","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"class_list":["post-29706","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Geographical Search - North Africa Trees<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.northafricatrees.org\/buscador-geografico\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Geographical Search - North Africa Trees\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.northafricatrees.org\/buscador-geografico\/\" \/>\n<meta property=\"og:site_name\" content=\"North Africa Trees\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-28T15:16:02+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/buscador-geografico\\\/\",\"url\":\"https:\\\/\\\/www.northafricatrees.org\\\/buscador-geografico\\\/\",\"name\":\"Geographical Search - North Africa Trees\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/#website\"},\"datePublished\":\"2020-11-24T13:33:01+00:00\",\"dateModified\":\"2026-10-28T15:16:02+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/buscador-geografico\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.northafricatrees.org\\\/buscador-geografico\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/buscador-geografico\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Geographical Search\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/#website\",\"url\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/\",\"name\":\"North Africa Trees\",\"description\":\"\u00c1rboles y arbustos aut\u00f3ctonos del Norte de \u00c1frica\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/#organization\",\"name\":\"North \u00e1frica trees\",\"url\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.northafricatrees.org\\\/wp-content\\\/uploads\\\/2020\\\/10\\\/logo-north-africa-trees.png\",\"contentUrl\":\"https:\\\/\\\/www.northafricatrees.org\\\/wp-content\\\/uploads\\\/2020\\\/10\\\/logo-north-africa-trees.png\",\"width\":80,\"height\":70,\"caption\":\"North \u00e1frica trees\"},\"image\":{\"@id\":\"https:\\\/\\\/www.northafricatrees.org\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Geographical Search - North Africa Trees","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.northafricatrees.org\/buscador-geografico\/","og_locale":"en_US","og_type":"article","og_title":"Geographical Search - North Africa Trees","og_url":"https:\/\/www.northafricatrees.org\/buscador-geografico\/","og_site_name":"North Africa Trees","article_modified_time":"2026-10-28T15:16:02+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.northafricatrees.org\/buscador-geografico\/","url":"https:\/\/www.northafricatrees.org\/buscador-geografico\/","name":"Geographical Search - North Africa Trees","isPartOf":{"@id":"https:\/\/www.northafricatrees.org\/en\/#website"},"datePublished":"2020-11-24T13:33:01+00:00","dateModified":"2026-10-28T15:16:02+00:00","breadcrumb":{"@id":"https:\/\/www.northafricatrees.org\/buscador-geografico\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.northafricatrees.org\/buscador-geografico\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.northafricatrees.org\/buscador-geografico\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.northafricatrees.org\/en\/"},{"@type":"ListItem","position":2,"name":"Geographical Search"}]},{"@type":"WebSite","@id":"https:\/\/www.northafricatrees.org\/en\/#website","url":"https:\/\/www.northafricatrees.org\/en\/","name":"North Africa Trees","description":"\u00c1rboles y arbustos aut\u00f3ctonos del Norte de \u00c1frica","publisher":{"@id":"https:\/\/www.northafricatrees.org\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.northafricatrees.org\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.northafricatrees.org\/en\/#organization","name":"North \u00e1frica trees","url":"https:\/\/www.northafricatrees.org\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.northafricatrees.org\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.northafricatrees.org\/wp-content\/uploads\/2020\/10\/logo-north-africa-trees.png","contentUrl":"https:\/\/www.northafricatrees.org\/wp-content\/uploads\/2020\/10\/logo-north-africa-trees.png","width":80,"height":70,"caption":"North \u00e1frica trees"},"image":{"@id":"https:\/\/www.northafricatrees.org\/en\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/pages\/29706","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/comments?post=29706"}],"version-history":[{"count":1,"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/pages\/29706\/revisions"}],"predecessor-version":[{"id":48193,"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/pages\/29706\/revisions\/48193"}],"wp:attachment":[{"href":"https:\/\/www.northafricatrees.org\/en\/wp-json\/wp\/v2\/media?parent=29706"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}