0

I'm currently working on implementing a store locator on a new site. Because of the complexity of the old store locator I've chosen to go with Google Maps for EE because of the flexibility of the plugin and the import.

I've been able to import a small subset of the stores for testing and successfully geocode them on import. I've also managed to get pagination working. But there are a few things missing:

I would like the ability to "search by region". So The idea is there is are tabs (or styled radio options) with USA, Canada, and International. When one is selected the map should return the results for that region. I can't figure out how to do this?

The other problem, I'm spitting the results into a <ol> to keep a count, with pagination this breaks (for obvious reasons), I tried using the {count} variable like so <li... data-count="{count}" so I could extract the count, but it also resets on paginate? I would think this value should keep count throughout paginate, but it doesn't?

Last thing is the annoying caching! I've tried to set the tag variable to "false", yet everything is still cached. I would love to turn this off somehow as it's really annoying, and also makes testing more difficult.

Finally, here is the template I'm attempting to use. Any advice is greatly appreciated!!

{exp:gmap:search
    channel="store_locations"
    latitude_field="store_lat"
    longitude_field="store_long"
    distance_field="distance_max"
    geocode_field="location"
    cache_post="false"
    }
    <input type="hidden" name="XID" value="{XID_HASH}" />
    <div class="row">
        <div class="small-12 large-6 columns">
             <input type="text" name="location" id="location" value="{if post:location}{post:location}{/if}">
             {if error:location}<p class="error">{error:location}</p>{/if}
        </div>
        <div class="small-12 large-6 columns">
            <select name="distance_max">
                <option value="25" &#123;if="" distance_max="=" 25}selected="selected" &#123;="" if}="">Within 25 Miles</option>
                <option value="50" &#123;if="" distance_max="=" 50}selected="selected" &#123;="" if}="">Within 50 Miles</option>
                <option value="100" &#123;if="" distance_max="=" 100}selected="selected" &#123;="" if}="">Within 100 Miles</option>
            </select>
        </div>
    </div>
  <button type="submit" class="button alert">
    <i class="icon-search icon-white"></i> Search
  </button>
{/exp:gmap:search}

<hr/>

{exp:gmap:results order_by="distance" sort="asc" parse="inward" paginate="true" limit="10"}

<div class="row">
    <div class="small-12 large-6 columns">
        <div class="store-locator-store">

        {if has_searched}
            <ol class="circles-list">
            {results}   
                <li data-count="{count}">
                    <div class="row">
                        <div class="small-12 large-9 columns">
                            <h4 class="soft">{result:title}</h4>
                            <p>  
                                {result:store_address}<br />
                              {if result:store_address_2 != ""}
                              {result:store_address_2}<br />
                              {/if}
                              {result:store_city}, {result:store_state} {result:store_zip}<br />
                              {if result:store_phone}Telephone: {result:store_phone}{/if}
                            </p>
                        </div>
                        <div class="small-12 large-3 columns">
                            <p>
                            <br/>
                            <strong>
                              {result:distance} miles<br />
                              <a href="{directions_url}" target="_blank">View Map</a><br />
                                <a href="{directions_url}" target="_blank">More Info</a>
                            </strong>
                            </p>
                        </div>
                    </div>
                </li>
            {/results}
            </ol>
        {/if}

        <div class="pagination-count">
        Showing page {current_page} of {total_pages}<br/><br/>
        </div>
        <div class="pagination-links">
        {if prev_page}<a href="{site_url}store_locator/store_temp/page/{prev_page}">&larr; Prev</a>{/if}&nbsp;&nbsp;
        {if next_page}<a href="{site_url}store_locator/store_temp/page/{next_page}">Next &rarr;</a>{/if}
        </div>

        </div>
    </div>

    <div id="map_container" class="small-12 large-6 columns">
        <p class="right">
            {if total_results > 1}
            <strong>Here are your results:</strong>
          <br /> 
            Displaying <strong>{total_results}</strong> matches within {search_distance} miles of <strong>{post:location}</strong>.
        </p>
            {exp:gmap:init id="map" class="google-map" style="width:100%;height:600px"}
            {results}                   
           {exp:gmap:marker id="map" latitude="{store_lat}" longitude="{store_long}"}
       {/results}
            {if:else}
            <p>Sorry, we were unable to find any matches for {post:location} within {search_distance}.</p>
            {/if}
    </div>

</div>
{/exp:gmap:results}
0

As for keeping the count, try using the {total_results} variable. That should show you the number of items returned regardless of pagination.

Regions are tricky. I don't think there is any built in method for handling them in Google Maps For ExpressionEngine. Although you can get a marker for a region, it will be in the centre of that region rather than a means to check a boundary. Logically, this is actually extremely difficult to do if you are doing proximity searches rather than just "is this place inside this region". There will always be a case where it just doesn't work sensibly.

Consider a situation where someone lives near the edge of a region. They search for the nearest store by selecting their region. The nearest store might be just over the 'border' but it would not be returned since it isn't in the region searched for.

So the next step is to return stores within a set distance of the border. That's a hell of a calculation to perform and still may not return the closest store due to the 'wiggliness' of borders.

ObjectiveHTML has made a search add-on which might help you as it will let you search within the Gmap4EE field for the address component of your geomarkers. This can go some way to solving the region problem. I don't know if it's on general release but might be worth asking.

  • You do raise some good points. I will have to take that into consideration. Right now the customer just really wants it separated by the three as explained. – shparkison Jun 9 '14 at 15:43
  • ...also, had seen the "channel search" plugin they released, problem is shelling out another $40 for it, when I feel the search should be a basic feature for the Maps plugin? Maybe I'll give it a shot anyway, we'll see... – shparkison Jun 9 '14 at 15:47
  • Well search is a basic feature of the maps plugin. Which, to be fair, is for displaying maps easily. – foamcow Jun 9 '14 at 16:53
0

I had been having the same issue with pagination but I found that the solution was to add page_segment="page" to the gmap:search parameters and then include "page" in my pagination links - which you have already according to your template code.

I'm having the same trouble with total_results though. If I do a search with a 10mile radius, and paginate="true" and limit="10" total_results returns 10. If I set limit to 50, total results returns 50. So at the moment, while the paginate variables are returning a correct number of pages, I'm having trouble with the ability to display something like "Displaying 1-25 of 86 matches" because total results is displaying the results returned within the pagination limit and not the total matches, as I was expecting.

  • Exactly my problem. Now if only we can find a solution to the total results issue... Gonna make it really confusing for the visitor when they go to page 2, or 3, or 4, etc. and says displaying results "1-10", even though it's 11-20, or 21-30, etc. – shparkison Jun 9 '14 at 15:46
  • I did crack this problem. Maybe it wasn't with the total_results tag as I thought. I've since migrated to use the new search add-on which uses {grand_total}, but I don't think that's right for Gmap4EE. – foamcow Jun 10 '14 at 8:52
  • True enough. I'm rather hoping the existing search function will allow me to provide this functionality - I wouldn't want to have to move to a separate search functionality just to get access to the proper totalling variables, but I may need the new search add-on for other searches within my geolocated data anyway. – Jean St-Amand Jun 10 '14 at 13:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.