{"id":1663,"date":"2025-06-03T14:06:27","date_gmt":"2025-06-03T13:06:27","guid":{"rendered":"https:\/\/northwood1dev.wpenginepowered.com\/?page_id=1663"},"modified":"2025-12-12T15:47:41","modified_gmt":"2025-12-12T15:47:41","slug":"map-view","status":"publish","type":"page","link":"https:\/\/www.northwooduk.com\/map-view\/","title":{"rendered":"Map View"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1663\" class=\"elementor elementor-1663\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5fc2e56 e-con-full e-flex e-con e-parent\" data-id=\"5fc2e56\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3463522 elementor-widget__width-inherit elementor-widget elementor-widget-shortcode\" data-id=\"3463522\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><div class=\"search-horizontal-wrapper\">\r\n    <div class=\"container-xxl\">\r\n        <div class=\"row\">\r\n            <div class=\"col\">\r\n                <section>\r\n            <form id=\"search-autocomplete-form\" data-component=\"SearchForm\" data-prevent-default-submit=\"false\" data-subscribe-submit-to-event=\"SEARCH_CORE\" action=\"https:\/\/www.northwooduk.com\/properties\/\" class=\"property-search-horizontal\">\r\n     \r\n        <input\r\n            type=\"hidden\"\r\n            data-component=\"FormItem\" \r\n            data-bind-value-to-events='[\"ORDER_BY_CHANGE_EVENT\"]'\r\n            name=\"orderby\"\r\n        >\r\n\r\n        <input id=\"hnt-branch-id\" data-component=\"FormItem\" type=\"hidden\" name=\"branchId\" value=\"\">\r\n\r\n        <input id=\"showsold\" data-component=\"FormItem\" type=\"hidden\" name=\"showsold\" value=\"\">\r\n\r\n        <input id=\"showstc\" data-component=\"FormItem\" type=\"hidden\" name=\"showstc\" value=\"\">\r\n\r\n        <ul id=\"wrapperFilters\" class=\"list-inline filter-search-list position-relative w-100 d-lg-flex flex-wrap flex-xl-nowrap align-items-center justify-content-lg-between mb-0\">\r\n            <li class=\"mobile-fields full\">\r\n                <select data-component=\"FormItem\" name=\"instruction_type\" id=\"instruction-type\" class=\"form-control options-activate-selectors\">\r\n                    <option value=\"sale\"  data-activate=\".sales-prices\">Buy<\/option>\r\n                    <option value=\"letting\"  data-activate=\".lettings-prices\">Rent<\/option>\r\n                <\/select>\r\n            <\/li>\r\n            \r\n            <li>\r\n                <div\r\n    data-component=\"GooglePlaces\" style=\"position: relative;\"\r\n    data-parent-form-id=\"search-autocomplete-form\"\r\n    data-fallback-to-address-search=\"true\"\r\n    data-search-developments=\"true\"\r\n    data-include-developments-properties-no=\"true\"\r\n    data-development-entry-template=\"&amp;lt;span class=&amp;quot;development-name&amp;quot;&amp;gt;&amp;lt;\/span&amp;gt;&amp;lt;span&amp;gt;(&amp;lt;span class=&amp;quot;properties-count&amp;quot;&amp;gt;&amp;lt;\/span&amp;gt;)&amp;lt;\/span&amp;gt;\" \r\n    data-place-entry-template=\"&amp;lt;span class=&amp;quot;place-icon&amp;quot;&amp;gt;&amp;lt;img src=&amp;quot;https:\/\/www.northwooduk.com\/wp-content\/plugins\/wp-blade-plugin-standalone\/assets\/dist\/img\/location_map_marker_icon.svg&amp;quot; \/&amp;gt;&amp;lt;\/span&amp;gt;&amp;lt;span class=&amp;quot;place-name&amp;quot;&amp;gt;&amp;lt;\/span&amp;gt;\" \r\n    data-max-google-results=\"7\" \r\n    data-developments-entries-title=\"DEVELOPMENTS\" \r\n    data-places-entries-title=\"LOCATIONS\" \r\n    data-max-developments-results=\"5\" \r\n    data-developments-show-first=\"true\" \r\n    data-debounce-milliseconds=\"250\" \r\n    data-places-use-radius-or-bounds=\"bounds\" \r\n    data-debug-mode=\"false\" \r\n    data-autocomplete-search-types=\"[&quot;postal_code&quot;,&quot;postal_town&quot;,&quot;locality&quot;,&quot;political&quot;,&quot;route&quot;]\" \r\n    data-search-countries=\"[&quot;gb&quot;]\"\r\n    \r\n>\r\n    <label for=\"google_places_address_keyword\" class=\"form-label visually-hidden-focusable\">Location, area or postcode<\/label>\r\n    <input\r\n        data-component=\"FormItem\"\r\n        type=\"text\"\r\n        name=\"place\"\r\n        id=\"google_places_address_keyword\"\r\n        class=\"tpj_search_input form-control location\"\r\n        placeholder=\"Street, area or postcode\"\r\n        autocomplete=\"off\"\r\n    >\r\n    <!-- <div class=\"tpj_clear_google_places\">\r\n        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" fill=\"currentColor\" class=\"bi bi-x\" viewBox=\"0 0 16 16\"><path d=\"M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708\"\/><\/svg>\r\n    <\/div> -->\r\n<\/div>            <\/li>\r\n            <li class=\"mobile-fields full\">\r\n                <select\r\n                    data-component=\"FormItem\"\r\n                    name=\"radius\"\r\n                    class=\"form-control\"\r\n                >\r\n                    <option value=\"0.1\">Radius<\/option>\r\n                    <option value=\"0.25\">1\/4 Miles<\/option>\r\n                    <option value=\"0.5\">1\/2 Miles<\/option>\r\n                    <option value=\"1\">1 Miles<\/option>\r\n                    <option value=\"3\">3 Miles<\/option>\r\n                    <option value=\"5\">5 Miles<\/option>\r\n                    <option value=\"10\">10 Miles<\/option>\r\n                    <option value=\"20\">20 Miles<\/option>\r\n                    <option value=\"30\">30 Miles<\/option>\r\n                    <option value=\"40\">40 Miles<\/option>\r\n                    <option value=\"50\">+ 50 Miles<\/option>\r\n                <\/select>\r\n            <\/li> \r\n            <li>\r\n                <div class=\"search-divider d-xl-block d-none\"><\/div>\r\n            <\/li>\r\n            <li class=\"mobile-fields odd\">\r\n                <div class=\"sales-prices\">\r\n                    <select data-component=\"FormItem\" name=\"minprice\" id=\"minprice-sales\" class=\"form-control\">\r\n                        <option value=\"\" selected>Min Price<\/option>\r\n                        <script>\r\n\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  const minPriceSelects = document.querySelectorAll('#minprice-sales, #minprice-lettings');\r\n  const maxPriceSelects = document.querySelectorAll('#maxprice-sales, #maxprice-lettings');\r\n\r\n  \/\/ Add event listener for min price dropdown change\r\n  minPriceSelects.forEach(minPriceSelect => {\r\n    minPriceSelect.addEventListener('change', function() {\r\n      updateMaxPriceOptions(this, maxPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Add event listener for max price dropdown change\r\n  maxPriceSelects.forEach(maxPriceSelect => {\r\n    maxPriceSelect.addEventListener('change', function() {\r\n      updateMinPriceOptions(this, minPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Function to update max price dropdown options based on selected min price\r\n  function updateMaxPriceOptions(minPriceSelect, maxPriceSelects) {\r\n    const selectedMinPrice = parseInt(minPriceSelect.value);\r\n\r\n    maxPriceSelects.forEach(maxPriceSelect => {\r\n      const maxPriceOptions = maxPriceSelect.options;\r\n\r\n      for (let i = 0; i < maxPriceOptions.length; i++) {\r\n        const option = maxPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options below the selected min price and show only options starting from the next available value\r\n        option.style.display = optionValue <= selectedMinPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n\r\n  \/\/ Function to update min price dropdown options based on selected max price\r\n  function updateMinPriceOptions(maxPriceSelect, minPriceSelects) {\r\n    const selectedMaxPrice = parseInt(maxPriceSelect.value);\r\n\r\n    minPriceSelects.forEach(minPriceSelect => {\r\n      const minPriceOptions = minPriceSelect.options;\r\n\r\n      for (let i = 0; i < minPriceOptions.length; i++) {\r\n        const option = minPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options above the selected max price and show only options starting from the previous available value\r\n        option.style.display = optionValue >= selectedMaxPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n});\r\n\r\n<\/script>\r\n\r\n    <option value=\"50000\">\u00a350,000<\/option>\r\n    <option value=\"100000\">\u00a3100,000<\/option>\r\n    <option value=\"150000\">\u00a3150,000<\/option>\r\n    <option value=\"200000\">\u00a3200,000<\/option>\r\n    <option value=\"250000\">\u00a3250,000<\/option>\r\n    <option value=\"300000\">\u00a3300,000<\/option>\r\n    <option value=\"350000\">\u00a3350,000<\/option>\r\n    <option value=\"400000\">\u00a3400,000<\/option>\r\n    <option value=\"450000\">\u00a3450,000<\/option>\r\n    <option value=\"500000\">\u00a3500,000<\/option>\r\n    <option value=\"550000\">\u00a3550,000<\/option>\r\n    <option value=\"600000\">\u00a3600,000<\/option>\r\n    <option value=\"650000\">\u00a3650,000<\/option>\r\n    <option value=\"700000\">\u00a3700,000<\/option>\r\n    <option value=\"750000\">\u00a3750,000<\/option>\r\n    <option value=\"800000\">\u00a3800,000<\/option>\r\n    <option value=\"850000\">\u00a3850,000<\/option>\r\n    <option value=\"900000\">\u00a3900,000<\/option>\r\n    <option value=\"950000\">\u00a3950,000<\/option>\r\n    <option value=\"1000000\">\u00a31,000,000<\/option>\r\n    <option value=\"2000000\">\u00a32,000,000<\/option>\r\n    <option value=\"3000000\">\u00a33,000,000<\/option>\r\n    <option value=\"4000000\">\u00a34,000,000<\/option>\r\n    <option value=\"5000000\">\u00a35,000,000<\/option>\r\n    <option value=\"6000000\">\u00a36,000,000<\/option>\r\n    <option value=\"7000000\">\u00a37,000,000<\/option>\r\n    <option value=\"8000000\">\u00a38,000,000<\/option>\r\n    <option value=\"9000000\">\u00a39,000,000<\/option>\r\n    <option value=\"10000000\">\u00a310,000,000<\/option>\r\n                    <\/select>\r\n                <\/div>\r\n                <div class=\"lettings-prices\">\r\n                    <select data-component=\"FormItem\" name=\"minprice\" id=\"minprice-lettings\" class=\"form-control\">\r\n                        <option value=\"\" selected>Min Price<\/option>\r\n                        <script>\r\n\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  const minPriceSelects = document.querySelectorAll('#minprice-sales, #minprice-lettings');\r\n  const maxPriceSelects = document.querySelectorAll('#maxprice-sales, #maxprice-lettings');\r\n\r\n  \/\/ Add event listener for min price dropdown change\r\n  minPriceSelects.forEach(minPriceSelect => {\r\n    minPriceSelect.addEventListener('change', function() {\r\n      updateMaxPriceOptions(this, maxPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Add event listener for max price dropdown change\r\n  maxPriceSelects.forEach(maxPriceSelect => {\r\n    maxPriceSelect.addEventListener('change', function() {\r\n      updateMinPriceOptions(this, minPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Function to update max price dropdown options based on selected min price\r\n  function updateMaxPriceOptions(minPriceSelect, maxPriceSelects) {\r\n    const selectedMinPrice = parseInt(minPriceSelect.value);\r\n\r\n    maxPriceSelects.forEach(maxPriceSelect => {\r\n      const maxPriceOptions = maxPriceSelect.options;\r\n\r\n      for (let i = 0; i < maxPriceOptions.length; i++) {\r\n        const option = maxPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options below the selected min price and show only options starting from the next available value\r\n        option.style.display = optionValue <= selectedMinPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n\r\n  \/\/ Function to update min price dropdown options based on selected max price\r\n  function updateMinPriceOptions(maxPriceSelect, minPriceSelects) {\r\n    const selectedMaxPrice = parseInt(maxPriceSelect.value);\r\n\r\n    minPriceSelects.forEach(minPriceSelect => {\r\n      const minPriceOptions = minPriceSelect.options;\r\n\r\n      for (let i = 0; i < minPriceOptions.length; i++) {\r\n        const option = minPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options above the selected max price and show only options starting from the previous available value\r\n        option.style.display = optionValue >= selectedMaxPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n});\r\n\r\n<\/script>\r\n\r\n    <option value=\"350\">&pound;350 PCM<\/option>\r\n    <option value=\"350\">&pound;350 PCM<\/option>\r\n    <option value=\"450\">&pound;450 PCM<\/option>\r\n    <option value=\"500\">&pound;500 PCM<\/option>\r\n    <option value=\"550\">&pound;550 PCM<\/option>\r\n    <option value=\"600\">&pound;600 PCM<\/option>\r\n    <option value=\"650\">&pound;650 PCM<\/option>\r\n    <option value=\"700\">&pound;700 PCM<\/option>\r\n    <option value=\"800\">&pound;800 PCM<\/option>\r\n    <option value=\"900\">&pound;900 PCM<\/option>\r\n    <option value=\"1000\">&pound;1000 PCM<\/option>\r\n    <option value=\"1500\">&pound;1500 PCM<\/option>\r\n    <option value=\"2000\">&pound;2000 PCM<\/option>\r\n    <option value=\"3000\">&pound;3000 PCM<\/option>\r\n    <option value=\"4000\">&pound;4000 PCM<\/option>\r\n    <option value=\"5000\">&pound;5000 PCM<\/option>\r\n    <option value=\"6000\">&pound;6000 PCM<\/option>\r\n    <option value=\"7000\">&pound;7000 PCM<\/option>\r\n    <option value=\"8000\">&pound;8000 PCM<\/option>\r\n    <option value=\"9000\">&pound;9000 PCM<\/option>\r\n    <option value=\"10000\">&pound;10,000 PCM<\/option>\r\n                    <\/select>\r\n                <\/div>\r\n            <\/li>\r\n            <li>\r\n                <div class=\"search-divider d-xl-block d-none\"><\/div>\r\n            <\/li>\r\n            <li class=\"mobile-fields even\">\r\n                <div class=\"sales-prices\">\r\n                    <select data-component=\"FormItem\" name=\"maxprice\" id=\"maxprice-sales\" class=\"form-control\">\r\n                        <option value=\"\" selected>Max Price<\/option>\r\n                        <script>\r\n\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  const minPriceSelects = document.querySelectorAll('#minprice-sales, #minprice-lettings');\r\n  const maxPriceSelects = document.querySelectorAll('#maxprice-sales, #maxprice-lettings');\r\n\r\n  \/\/ Add event listener for min price dropdown change\r\n  minPriceSelects.forEach(minPriceSelect => {\r\n    minPriceSelect.addEventListener('change', function() {\r\n      updateMaxPriceOptions(this, maxPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Add event listener for max price dropdown change\r\n  maxPriceSelects.forEach(maxPriceSelect => {\r\n    maxPriceSelect.addEventListener('change', function() {\r\n      updateMinPriceOptions(this, minPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Function to update max price dropdown options based on selected min price\r\n  function updateMaxPriceOptions(minPriceSelect, maxPriceSelects) {\r\n    const selectedMinPrice = parseInt(minPriceSelect.value);\r\n\r\n    maxPriceSelects.forEach(maxPriceSelect => {\r\n      const maxPriceOptions = maxPriceSelect.options;\r\n\r\n      for (let i = 0; i < maxPriceOptions.length; i++) {\r\n        const option = maxPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options below the selected min price and show only options starting from the next available value\r\n        option.style.display = optionValue <= selectedMinPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n\r\n  \/\/ Function to update min price dropdown options based on selected max price\r\n  function updateMinPriceOptions(maxPriceSelect, minPriceSelects) {\r\n    const selectedMaxPrice = parseInt(maxPriceSelect.value);\r\n\r\n    minPriceSelects.forEach(minPriceSelect => {\r\n      const minPriceOptions = minPriceSelect.options;\r\n\r\n      for (let i = 0; i < minPriceOptions.length; i++) {\r\n        const option = minPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options above the selected max price and show only options starting from the previous available value\r\n        option.style.display = optionValue >= selectedMaxPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n});\r\n\r\n<\/script>\r\n\r\n    <option value=\"50000\">\u00a350,000<\/option>\r\n    <option value=\"100000\">\u00a3100,000<\/option>\r\n    <option value=\"150000\">\u00a3150,000<\/option>\r\n    <option value=\"200000\">\u00a3200,000<\/option>\r\n    <option value=\"250000\">\u00a3250,000<\/option>\r\n    <option value=\"300000\">\u00a3300,000<\/option>\r\n    <option value=\"350000\">\u00a3350,000<\/option>\r\n    <option value=\"400000\">\u00a3400,000<\/option>\r\n    <option value=\"450000\">\u00a3450,000<\/option>\r\n    <option value=\"500000\">\u00a3500,000<\/option>\r\n    <option value=\"550000\">\u00a3550,000<\/option>\r\n    <option value=\"600000\">\u00a3600,000<\/option>\r\n    <option value=\"650000\">\u00a3650,000<\/option>\r\n    <option value=\"700000\">\u00a3700,000<\/option>\r\n    <option value=\"750000\">\u00a3750,000<\/option>\r\n    <option value=\"800000\">\u00a3800,000<\/option>\r\n    <option value=\"850000\">\u00a3850,000<\/option>\r\n    <option value=\"900000\">\u00a3900,000<\/option>\r\n    <option value=\"950000\">\u00a3950,000<\/option>\r\n    <option value=\"1000000\">\u00a31,000,000<\/option>\r\n    <option value=\"2000000\">\u00a32,000,000<\/option>\r\n    <option value=\"3000000\">\u00a33,000,000<\/option>\r\n    <option value=\"4000000\">\u00a34,000,000<\/option>\r\n    <option value=\"5000000\">\u00a35,000,000<\/option>\r\n    <option value=\"6000000\">\u00a36,000,000<\/option>\r\n    <option value=\"7000000\">\u00a37,000,000<\/option>\r\n    <option value=\"8000000\">\u00a38,000,000<\/option>\r\n    <option value=\"9000000\">\u00a39,000,000<\/option>\r\n    <option value=\"10000000\">\u00a310,000,000<\/option>\r\n                    <\/select>\r\n                <\/div>\r\n                <div class=\"lettings-prices\">\r\n                    <select data-component=\"FormItem\" name=\"maxprice\" id=\"maxprice-lettings\" class=\"form-control\">\r\n                        <option value=\"\" selected>Max Price<\/option>\r\n                        <script>\r\n\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  const minPriceSelects = document.querySelectorAll('#minprice-sales, #minprice-lettings');\r\n  const maxPriceSelects = document.querySelectorAll('#maxprice-sales, #maxprice-lettings');\r\n\r\n  \/\/ Add event listener for min price dropdown change\r\n  minPriceSelects.forEach(minPriceSelect => {\r\n    minPriceSelect.addEventListener('change', function() {\r\n      updateMaxPriceOptions(this, maxPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Add event listener for max price dropdown change\r\n  maxPriceSelects.forEach(maxPriceSelect => {\r\n    maxPriceSelect.addEventListener('change', function() {\r\n      updateMinPriceOptions(this, minPriceSelects);\r\n    });\r\n  });\r\n\r\n  \/\/ Function to update max price dropdown options based on selected min price\r\n  function updateMaxPriceOptions(minPriceSelect, maxPriceSelects) {\r\n    const selectedMinPrice = parseInt(minPriceSelect.value);\r\n\r\n    maxPriceSelects.forEach(maxPriceSelect => {\r\n      const maxPriceOptions = maxPriceSelect.options;\r\n\r\n      for (let i = 0; i < maxPriceOptions.length; i++) {\r\n        const option = maxPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options below the selected min price and show only options starting from the next available value\r\n        option.style.display = optionValue <= selectedMinPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n\r\n  \/\/ Function to update min price dropdown options based on selected max price\r\n  function updateMinPriceOptions(maxPriceSelect, minPriceSelects) {\r\n    const selectedMaxPrice = parseInt(maxPriceSelect.value);\r\n\r\n    minPriceSelects.forEach(minPriceSelect => {\r\n      const minPriceOptions = minPriceSelect.options;\r\n\r\n      for (let i = 0; i < minPriceOptions.length; i++) {\r\n        const option = minPriceOptions[i];\r\n        const optionValue = parseInt(option.value);\r\n\r\n        \/\/ Hide options above the selected max price and show only options starting from the previous available value\r\n        option.style.display = optionValue >= selectedMaxPrice ? 'none' : 'block';\r\n      }\r\n    });\r\n  }\r\n});\r\n\r\n<\/script>\r\n\r\n    <option value=\"350\">&pound;350 PCM<\/option>\r\n    <option value=\"350\">&pound;350 PCM<\/option>\r\n    <option value=\"450\">&pound;450 PCM<\/option>\r\n    <option value=\"500\">&pound;500 PCM<\/option>\r\n    <option value=\"550\">&pound;550 PCM<\/option>\r\n    <option value=\"600\">&pound;600 PCM<\/option>\r\n    <option value=\"650\">&pound;650 PCM<\/option>\r\n    <option value=\"700\">&pound;700 PCM<\/option>\r\n    <option value=\"800\">&pound;800 PCM<\/option>\r\n    <option value=\"900\">&pound;900 PCM<\/option>\r\n    <option value=\"1000\">&pound;1000 PCM<\/option>\r\n    <option value=\"1500\">&pound;1500 PCM<\/option>\r\n    <option value=\"2000\">&pound;2000 PCM<\/option>\r\n    <option value=\"3000\">&pound;3000 PCM<\/option>\r\n    <option value=\"4000\">&pound;4000 PCM<\/option>\r\n    <option value=\"5000\">&pound;5000 PCM<\/option>\r\n    <option value=\"6000\">&pound;6000 PCM<\/option>\r\n    <option value=\"7000\">&pound;7000 PCM<\/option>\r\n    <option value=\"8000\">&pound;8000 PCM<\/option>\r\n    <option value=\"9000\">&pound;9000 PCM<\/option>\r\n    <option value=\"10000\">&pound;10,000 PCM<\/option>\r\n                    <\/select>\r\n                <\/div>\r\n            <\/li>\r\n            <li>\r\n                <div class=\"search-divider d-xl-block d-none\"><\/div>\r\n            <\/li>\r\n            <li class=\"mobile-fields full\">\r\n                <select data-component=\"FormItem\" name=\"exact_bedrooms\" id=\"bedrooms\" class=\"form-control\">\r\n                    <option value=\"\" selected>Bedrooms<\/option>\r\n                    <option value=\"1\">1 Bedroom\/Studio<\/option>\r\n<option value=\"2\">2 Bedrooms<\/option>\r\n<option value=\"3\">3 Bedrooms<\/option>\r\n<option value=\"4\">4 Bedrooms<\/option>\r\n<option value=\"5\">5+ Bedrooms<\/option>\r\n                <\/select>\r\n            <\/li>\r\n            <li>\r\n                <div class=\"search-divider d-xl-block d-none\"><\/div>\r\n            <\/li>\r\n            <li class=\"mobile-fields full\">\r\n                <select data-component=\"FormItem\" name=\"property_type\" id=\"property-type-residential\" class=\"form-control\">\r\n                    <option value=\"\" selected>All Types<\/option>  <option value=\"House\">House<\/option>\r\n                                <option value=\"Flat\">Flat<\/option>\r\n                                <option value=\"Barn\">Barn<\/option>\r\n                                <option value=\"Block of Apartments\">Block of Apartments<\/option>\r\n                                <option value=\"Bungalow\">Bungalow<\/option>\r\n                                <option value=\"Caravan\">Caravan<\/option>\r\n                                <option value=\"Commerical\">Commerical<\/option>\r\n                                <option value=\"Farmland\">Farmland<\/option>\r\n                                <option value=\"Garage\">Garage<\/option>\r\n                                <option value=\"Land\">Land<\/option>\r\n                                <option value=\"Shared accommodation\">Shared accommodation<\/option>\r\n                                <option value=\"Other\">Other<\/option>\r\n                            <\/select>\r\n            <\/li>\r\n                        <li>\r\n                <div class=\"d-flex flex-row gap-3\">\r\n                    <button class=\"mobile-fields-btn d-block d-md-none btn btn-white\" id=\"mobileFields\">Options<\/button>\r\n                    <input type=\"submit\" id=\"searchBtn\" class=\"property-search-horizontal__btn\" value=\"Search\">\r\n                <\/div>\r\n            <\/li>\r\n        <\/ul>\r\n    <\/form>\r\n<\/section>\r\n\r\n<script>\r\n    \/\/ Department \/ instruction type sync\r\n    const departmentToggle = document.getElementById('department');\r\n    const instructionToggle = document.getElementById('instruction-type');\r\n\r\n    if (departmentToggle) {\r\n        const departmentValue = departmentToggle.value;\r\n\r\n        if (departmentValue === 'student') {\r\n            departmentToggle.addEventListener('input', function () {\r\n                instructionToggle.value = 'letting';\r\n            });\r\n        }\r\n    }\r\n\r\n    \/\/ More filters toggle (the existing radio\/checkbox panel)\r\n    const moreFilters = document.getElementById('moreFilters');\r\n    if (moreFilters) {\r\n        moreFilters.addEventListener('click', (e) => {\r\n            e.preventDefault();\r\n            document.querySelectorAll('.filters-modal').forEach(el => {\r\n                el.classList.toggle('d-block');\r\n            });\r\n        });\r\n    }\r\n\r\n    \/\/ Mobile fields toggle (reveals the hidden filter fields on mobile after submit)\r\n    const mobileFields = document.getElementById('mobileFields');\r\n    if (mobileFields) {\r\n        mobileFields.addEventListener('click', (e) => {\r\n            e.preventDefault();\r\n            document.body.classList.toggle('hide-fields-mobile');\r\n        });\r\n    }\r\n<\/script>            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n<div class=\"single-post-wrapper--small\">\r\n    <div class=\"container\">\r\n        <div class=\"row \">\r\n            <div class=\"col d-flex flex-column flex-lg-row justify-content-between align-items-lg-end\">\r\n                <div>\r\n                     <h1 class=\"dynamic-title mb-3 mb-lg-0\">Discover Your Properties in Map View<\/h1>\r\n                    <p class=\"fs-4 color-text mb-lg-0 mb-4\">Showing <span class=\"map_properties_no\"><\/span> results<\/p>\r\n                <\/div>\r\n                <div class=\"d-flex flex-column flex-md-row justify-content-md-between align-items-md-center\">\r\n                    <a class=\"d-flex flex-row align-items-center mb-3 mb-md-0 ms-lg-5\" href=\"\/wp-json\/wp\/v2\/pages\/1663?exclusive=1\">\r\n                        <div class=\"show-stc-checkbox\"><\/div><span class=\"fs-4 color-text ms-3\">Bespoke Properties<\/span>\r\n                    <\/a>\r\n                    <a class=\"d-flex flex-row align-items-center mb-3 mb-md-0 ms-lg-5\" href=\"\/wp-json\/wp\/v2\/pages\/1663?showstc=on&amp;showsold=on\">\r\n                        <div class=\"show-stc-checkbox\"><\/div><span class=\"fs-4 color-text ms-3\">Show Sold<\/span>\r\n                    <\/a>\r\n                    <a href=\"https:\/\/www.northwooduk.com\/properties\/&instruction_type=&maxprice=&minprice=\" class=\"d-flex flex-row align-items-center ms-lg-5\">\r\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M2.5 4C2.5 3.17157 3.17157 2.5 4 2.5H5.5C6.32843 2.5 7 3.17157 7 4V5.5C7 6.32843 6.32843 7 5.5 7H4C3.17157 7 2.5 6.32843 2.5 5.5V4Z\" stroke=\"#1B174A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><path d=\"M2.5 10.5C2.5 9.67157 3.17157 9 4 9H5.5C6.32843 9 7 9.67157 7 10.5V12C7 12.8284 6.32843 13.5 5.5 13.5H4C3.17157 13.5 2.5 12.8284 2.5 12V10.5Z\" stroke=\"#1B174A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><path d=\"M9 4C9 3.17157 9.67157 2.5 10.5 2.5H12C12.8284 2.5 13.5 3.17157 13.5 4V5.5C13.5 6.32843 12.8284 7 12 7H10.5C9.67157 7 9 6.32843 9 5.5V4Z\" stroke=\"#1B174A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><path d=\"M9 10.5C9 9.67157 9.67157 9 10.5 9H12C12.8284 9 13.5 9.67157 13.5 10.5V12C13.5 12.8284 12.8284 13.5 12 13.5H10.5C9.67157 13.5 9 12.8284 9 12V10.5Z\" stroke=\"#1B174A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n                        <span class=\"fs-4 color-text ms-3\">View on a grid<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n<div class=\"map-results-wrapper\">\r\n    <input\r\n        data-component=\"FormItem\"\r\n        data-bind-value-to-events='[\"MAP_POLY_CHANGE\"]'\r\n        name=\"bounds\"\r\n        type=\"hidden\"\r\n        >\r\n        <div\r\n    data-component=\"PropertiesMap\"\r\n    data-initial-lat=\"51.5073509\"\r\n    data-initial-lng=\"-0.1277583\"\r\n    data-initial-zoom=\"3\"\r\n    data-view-name=\"partials\/rest\/map-info-window\"\r\n    data-map-initial-query=''\r\n    data-map-bind-query-to-events='[\"MAP_CHANGE_FILTERS\"]'\r\n    data-map-emit-shape-draw-change-events='[\"MAP_POLY_CHANGE\"]'\r\n    data-supports-drawing-mode=\"false\"\r\n    data-map-drawing-options='{\"fillColor\":\"#33aa7e\",\"fillOpacity\":0.4,\"strokeWeight\":2,\"strokeColor\":\"#33aa7e\"}'\r\n    data-updates-window-query-vars=true \r\n    data-small-cluster-background=#301c42 \r\n    data-large-cluster-background=#301c42 \r\n    data-hide-map-if-no-results=false \r\n    data-prevent-load-properties-on-init=false\r\n    data-use-seo-permalinks=false \r\n    data-splitscreen-marker=https:\/\/www.northwooduk.com\/wp-content\/themes\/wp-tpj-child-theme\/dist\/img\/splitscreen-marker.png\r\n    data-splitscreen-marker-hover=https:\/\/www.northwooduk.com\/wp-content\/themes\/wp-tpj-child-theme\/dist\/img\/splitscreen-marker-hover.png\r\n    id=\"search-map-results\"\r\n    class=\"search-map-results\"\r\n>\r\n\r\n    <div class=\"tpj_load_info map-info\">\r\n        <div><strong>Loading Search Results...<\/strong><\/div>\r\n    <\/div>\r\n\r\n    <div class=\"tpj_map_no_results map-info\">\r\n        <div><strong>We couldn't find any properties with that search criteria.<\/strong><\/div>\r\n    <\/div>\r\n    \r\n    <\/div>\r\n<div class=\"tpj_map_no_results_map_html_replacement\" style=\"display: none;\">\r\n    <p>We couldn't find any properties with that search criteria.<\/p>\r\n<\/div><\/div> \r\n<script>\r\n    jQuery(document).ready(function($){\r\n        \/\/Sticky\r\n       \r\n        if ($('body').hasClass(\"admin-bar\")) {\r\n            var adminBar = $('#wpadminbar').outerHeight();\r\n        } else {\r\n            var adminBar = 0;    \r\n        }\r\n\r\n        var topHeight = $('.header--main').outerHeight() + adminBar;\r\n        var stickyNavTop = $('.search-horizontal-wrapper').offset().top - topHeight; \r\n        var resultsWrapperMargin = $('.search-horizontal-wrapper').height();\r\n\r\n        var stickyNav = function(){  \r\n            var scrollTop = $(window).scrollTop();  \r\n            if(window.matchMedia(\"(min-width: 992px)\").matches) {       \r\n                if (scrollTop >= stickyNavTop) {   \r\n                    $('.search-horizontal-wrapper').css({\r\n                        'position': 'fixed',\r\n                        'top': topHeight+'px'\r\n                    });\r\n                    $('.single-post-wrapper--small').css({\r\n                        'margin-top': resultsWrapperMargin+'px'\r\n                    });\r\n                } else {  \r\n                    $('.search-horizontal-wrapper').css({\r\n                        'position': 'relative',\r\n                        'top': '0'\r\n                    });  \r\n                    $('.single-post-wrapper--small').css({\r\n                        'margin-top': '0'\r\n                    });\r\n                }  \r\n            }\r\n        };  \r\n          \r\n        stickyNav();  \r\n          \r\n        $(window).scroll(function() {  \r\n            stickyNav();  \r\n        });\r\n    });\r\n\r\n<\/script>\r\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":10,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-1663","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Explore Properties in Map View | Northwood UK<\/title>\n<meta name=\"description\" content=\"Explore and find properties to buy or rent across the UK with our interactive map view. Start your search today.\" \/>\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.northwooduk.com\/map-view\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Explore Properties in Map View | Northwood UK\" \/>\n<meta property=\"og:description\" content=\"Explore and find properties to buy or rent across the UK with our interactive map view. Start your search today.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.northwooduk.com\/map-view\/\" \/>\n<meta property=\"og:site_name\" content=\"Northwood UK\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-12T15:47:41+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/map-view\\\/\",\"url\":\"https:\\\/\\\/www.northwooduk.com\\\/map-view\\\/\",\"name\":\"Explore Properties in Map View | Northwood UK\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/#website\"},\"datePublished\":\"2025-06-03T13:06:27+00:00\",\"dateModified\":\"2025-12-12T15:47:41+00:00\",\"description\":\"Explore and find properties to buy or rent across the UK with our interactive map view. Start your search today.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/map-view\\\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.northwooduk.com\\\/map-view\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/map-view\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.northwooduk.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Map View\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/#website\",\"url\":\"https:\\\/\\\/www.northwooduk.com\\\/\",\"name\":\"Northwood UK\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.northwooduk.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/#organization\",\"name\":\"Northwood UK\",\"url\":\"https:\\\/\\\/www.northwooduk.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.northwooduk.com\\\/wp-content\\\/uploads\\\/2025\\\/05\\\/logo.svg\",\"contentUrl\":\"https:\\\/\\\/www.northwooduk.com\\\/wp-content\\\/uploads\\\/2025\\\/05\\\/logo.svg\",\"width\":316,\"height\":68,\"caption\":\"Northwood UK\"},\"image\":{\"@id\":\"https:\\\/\\\/www.northwooduk.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Explore Properties in Map View | Northwood UK","description":"Explore and find properties to buy or rent across the UK with our interactive map view. Start your search today.","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.northwooduk.com\/map-view\/","og_locale":"en_GB","og_type":"article","og_title":"Explore Properties in Map View | Northwood UK","og_description":"Explore and find properties to buy or rent across the UK with our interactive map view. Start your search today.","og_url":"https:\/\/www.northwooduk.com\/map-view\/","og_site_name":"Northwood UK","article_modified_time":"2025-12-12T15:47:41+00:00","twitter_card":"summary_large_image","twitter_misc":{"Estimated reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.northwooduk.com\/map-view\/","url":"https:\/\/www.northwooduk.com\/map-view\/","name":"Explore Properties in Map View | Northwood UK","isPartOf":{"@id":"https:\/\/www.northwooduk.com\/#website"},"datePublished":"2025-06-03T13:06:27+00:00","dateModified":"2025-12-12T15:47:41+00:00","description":"Explore and find properties to buy or rent across the UK with our interactive map view. Start your search today.","breadcrumb":{"@id":"https:\/\/www.northwooduk.com\/map-view\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.northwooduk.com\/map-view\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.northwooduk.com\/map-view\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.northwooduk.com\/"},{"@type":"ListItem","position":2,"name":"Map View"}]},{"@type":"WebSite","@id":"https:\/\/www.northwooduk.com\/#website","url":"https:\/\/www.northwooduk.com\/","name":"Northwood UK","description":"","publisher":{"@id":"https:\/\/www.northwooduk.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.northwooduk.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Organization","@id":"https:\/\/www.northwooduk.com\/#organization","name":"Northwood UK","url":"https:\/\/www.northwooduk.com\/","logo":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.northwooduk.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.northwooduk.com\/wp-content\/uploads\/2025\/05\/logo.svg","contentUrl":"https:\/\/www.northwooduk.com\/wp-content\/uploads\/2025\/05\/logo.svg","width":316,"height":68,"caption":"Northwood UK"},"image":{"@id":"https:\/\/www.northwooduk.com\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.northwooduk.com\/wp-json\/wp\/v2\/pages\/1663","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.northwooduk.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.northwooduk.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.northwooduk.com\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/www.northwooduk.com\/wp-json\/wp\/v2\/comments?post=1663"}],"version-history":[{"count":0,"href":"https:\/\/www.northwooduk.com\/wp-json\/wp\/v2\/pages\/1663\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.northwooduk.com\/wp-json\/wp\/v2\/media?parent=1663"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}