This jQuery plugin takes advantage of Google Maps API version 3 to create an easy to implement store locator. No
back-end programming is required, you just need to feed it KML, XML, or JSON data with all the location information.
How you create the data file is up to you. I originally created this for a company that didn’t have many locations, so I
just used a static XML file. You will need to geocode your locations beforehand or use a geocoding API service if
you want to try to do it on the fly. The reason for this is that all free geocoding APIs have strict limits that would
easily be exceeded. In the end, you're much better off storing the coordinates versus having to look them up for each
location on each request.
A note on the distance calculation: this plugin currently uses a distance function that I found on the blog of
Chris Pietschmann.
Google Maps API version 3 does include a distance calculation service
(Google Distance Matrix API) but I decided not to use
it because of the current request limits, which seem somewhat low. For v2 I also tried experimenting with the Directions API to request distances but also found the limits to be too restrictive. So, the distance calculation is “as the crow flies” instead of a
road distance calculation. However, if you use the inline directions option that does provide the distance that's returned via the directions request.
Last, it’s very important to note that the plugin requires the Handlebars template engine. This separates the markup of the
infowindows and location list elements so that they can easily be restructured. Handlebars pretty slick, will read
Mustache templates, and the built-in helpers really come in handy. Depending on what your data source is, 2 of the
4 total templates will be used (KML vs XML or JSON) and there are options to set the paths of each template if you don’t
want them in the default location. If you’re developing something for mobile devices the templates can be pre-compiled
for even faster loading.
WordPress version
Cardinal Store Locator plugin for WordPress is now available, which uses this jQuery plugin
as a base and all of the settings can be set via a settings page in the WP dashboard. It also integrates with core
WordPress features such as custom post types for location data and custom taxonomies for location categorization and
filtering.
Changelog
Version 3.1.7
Fixed empty name search value not clearing previous value.
Fixed openNearest setting not working in combination with querystringParams setting.
Fixed openNearest setting not opening correct location with custom sorting (sortBy) enabled.
Version 3.1.6
Added extra check to make sure mapping doesn't fire twice when defaultLoc is enabled and fullMapStart is also enabled.
fullMapStart is not needed when defaultLoc is enabled and this is just a preventative to avoid user errors.
Fixed centering issue on initial search with maxDistance enabled introduced with fitBounds updates in last update.
Updated jQuery version in example files to v3.6.0.
Version 3.1.2
Fixed name search issue introduced in v3.1.1. Reverted to previous matching pattern only for name searches and still using the new patter for taxonomy matching.
Version 3.1.1
Enhanced filtering regular expression to better account for exact matches vs. substrings.
Fixed multi-category selection filtering issue introduced in last version 3.1.0.
Updated bundled Handlebars to v4.7.6.
Updated node modules.
Version 3.1.0
Added featuredDistance setting to restrict featured locations by a specified distance (number value should be used).
Updated bundled version of Handlebars to v4.5.1 due to security issue.
Updated taxonomy filtering REGEX and string replacements for international character support.
Version 3.0.1
Added custom order handling to tie into previously added custom sorting. Set order to asc or desc.
Added functionality to fill in search input with determined address when using autoGeocode or geocodeID settings.
Added Google Map object as parameter to callbackBeforeSend, callbackListClick, callbackModalReady, and callbackFilters callbacks.
Changed parseJSON to native JSON.parse due to deprecation in rawData processing function.
Fixed issue with mapReload (triggered with optional reset button) where storeLimit wasn't reset.
Updated sort-example.html example with order select field.
Version 3.0.0
Version 3 has a breaking change with the dataLocation and dataType settings switching the default from XML to JSON.
Added ajaxData to allow custom data to be sent with the AJAX request. The setting accepts an object.
Added altDistanceNoResult setting to display no results message vs. all locations when closest location is further than distanceAlert setting.
Added callbackAutoGeoSuccess callback that fires after the geolocation API returns a successful result.
Added callbackFormVals callback that fires after the form values have been processed from the form.
Added callbackGeocodeRestrictions callback that allows the componentRestrictions object to be overridden.
Added callbackNearestLoc callback that fires when the nearest location is triggered with the openNearest setting.
Added callbackSorting callback that fires when when a new sorting method is selected.
Added component filtering for geocoding to better restrict by area.
Added length unit (distance miles/kilometers) front-end swap functionality, setting and example file.
Added mappingObject, originPoint, data, and page parameters to callbackSuccess callback.
Added new front-end sorting functionality, settings, and example file.
Added location data object as parameter of callbackDirectionsRequest callback.
Added openNearest setting to open/select the nearest location after searching.
Fixed issue with featuredLocations setting where featured locations at far distances would trigger distance alert.
Fixed issue with filtering values containing ampersands, which would not display any results - updated filtering regex.
Fixed issue where HTML5 Geolocation was skipped when using the fullMapStartBlank setting.
Fixed issue with pagination page numbers displaying after no results via PR from heldr88
Fixed issue with taxonomy filtering and autoGeocode setting where HTML Geocoding API would run on every filter change.
Removed Less from the project as it is no longer needed with the Bootstrap update.
Swapped the default location data type to be JSON instead of XML.
Updated Bootstrap example file to make use of Bootstrap 4.
Updated taxonomy filtering so pagination is reset to first page after selecting a filter.
Version 2.7.4
Fixed error when filtering with query strings where filter values with spaces wouldn't work.
Updated processForm method so submitting the map removes focus from any of the form input/select fields instead of just the address input.
Updated filterData string replace methods to match string replace method in filters setup.
Version 2.7.3
Added ability to indicate multiple query string parameter values (for checkboxes) with a comma separated list value.
Added autoCompleteDisableListener setting to disable the listener that immediately triggers a search when an auto complete location option is selected.
Added blur to primary location input field after form submission to hide mobile keyboards.
Added check to exclusive filtering to make sure filter values are not undefined before proceeding with the regular expression.
Added functionality to automatically select/check filters on load from query string parameter values.
Added location details object to callbackListClick and callbackMarkerClick objects.
Fixed broken dragSearch functionality that was introduced after map scope pull request was merged.
Fixed Handlebars targeting issue triggered by placing an unordered list within the location list template.
Fixed issue with fullMapStart where conditional was checking if isNaN was true when it should have been false on fullMapStartListLimit setting.
Updated callbackListClick documentation to include second market object parameter.
Updated zooming to prevent fitBounds from being used when query string parameters are in use and the location has been set with bh-sl-address.
Version 2.7.2
Added callbackRegion callback, which allows region to be set before being sent to the Google Maps Geocoding API.
Fixed incorrect origin marker parameter order after code restructure.
Fixed issue where searching by name after searching by address, without a new address, didn't reset the origin.
Merged pull-request from ollea that adds "getMap" function that returns a google.maps.Map instance.
Version 2.7.1
Hotfix to prevent potential error with updated filterData method if the category of a location is undefined.
Merged in pull request from noclat that added autoCompleteOptions setting.
Version 2.6.0
Added bounds and formatted address info from geocoding API to AJAX data parameters.
Added Marker Clusterer library support, setting and example file.
Added disableAlphaMarkers setting to completely disable displaying markers and location list indicators with alpha characters.
Fixed issue with combination of autoGeocode and originMarker settings.
Merged in pull request from drcomix that fixed zoom issue with dragSearch setting.
Switched included remote scripts in example files to https.
Updated jQuery references to the latest version.
Version 2.5.3
Removed check from createMarker method that removed spaces from categories - created issues with categories that have spaces.
Re-worked handling of no results.
Updated createMarker method to ensure custom category marker images are converted to integers if strings are passed for dimensions.
Updated autoGeocode and default location functionality so that max distance is applied on initial load.
Version 2.5.2
Fixed pagination bubbling issue.
Fixed pagination issues with autoGeocode and dragSearch combinations.
Version 2.5.1
Fixed issues with visibleMarkersList and location list background colors and selection.
Version 2.5.0
Added new dragSearch setting which performs a new search when the map is dragged when enabled.
Added new geocodeID setting so that the HTML geocoding API can be triggered by a button instead of firing automatically.
Fixed issues with no results where clicking the marker would display data from the previous result and clicking the location list item would throw an error.
Merged in pull request from hawkmeister with update to bower.json file with main property.
Merged in pull request from hyperTwitch with fixes for using fullMapStartListLimit in combination with a different store limit.
Updated jQuery references to the latest version.
Version 2.4.2
Fixed issue with new full map start location list limit where clicking on a marker that didn't have a list item
displayed caused an error.
Fixed issue with settings combination of inline directions and default location.
Reverted change to new list limit so that it's always applied with full map start enabled.
Version 2.4.1
Changed new full map start list limit so that it's only applied on the initial load.
Fixed issue with new autocomplete setting where search was firing twice.
Version 2.4.0
Added new selected marker image options to highlight clicked marker.
Added Google Places autocomplete option and example file.
Added full map start location list limit setting.
Version 2.3.3
Removed code that temporarily hid the map and results, when there are no results, in favor of just displaying the no
results message and empty map.
Version 2.3.2
Tweaked list label width styling.
Version 2.3.1
Added preventative styling to inline directions panel table.
Switched to unitless line-heights.
Version 2.3.0
Added fullMapStartBlank option to show a blank map without any locations initially. Set this setting to an integer,
which will be applied as the initial Google Maps zoom value and will then fall back to the mapSettings zoom level after
a search is performed.
Added fullMapStartBlank example file.
Fixed filters select field styling inconsistency.
Moved pagination container within map container div in pagination example to avoid confusion when combined with modal option.
Reworked styling so that all HTML example files are responsive by default.
Updated map-container ID in all example files with bh-sl prefix.
Version 2.2.2
Added preventative styling to avoid table conflicts with directions panel.
Fixed clearMarkers issue with inline directions enabled.
Version 2.2.1
Updated preventative styling to be more specific to the map container and added max-height img rule.
Version 2.2.0
Added check for Google Maps API.
Added Grunt Handlebars task for compiling Handlebars templates from src directory - will add more compatibility in future release.
Added preventative styling to avoid conflicts with CSS frameworks and resets.
Default design refresh.
Fixed bug with inline directions panel that occurred after multiple address submissions.
Removed sensor parameter from Google Maps API URL as it's no longer needed.
Switched the default plugin styling from LESS to SASS.
Added writeDebug console.log helper function for debugging.
Added sessionStorage option to store user's location when autoGeocode in enabled to prevent multiple lookups per session.
Fixed bug with inline directions panel that occurred after multiple address submissions.
Updated processForm method form field variables with empty string fallback values.
Version 2.0.9
Fixed issue when using catMarkers setting and not setting a location's category resulted in an error.
Version 2.0.8
Changed infowindow and location list templates so that the comma is added if the city is available.
Fixed issue with inline directions where "null" was prepended to the destination address.
Fixed close directions bug where close icon couldn't be clicked more than two times.
Fixed bug where form wasn't overriding query string parameters.
Updated processForm method to accept max distance query string parameter.
Updated processForm method to use existing origin data if it's present and matches to avoid unnecessary geocode
requests.
Updated max distance check to less than or equal to the selected distance vs. just less than.
Updated regionID description in options.md for clarity.
Updated formEventHandler method to prevent ASP.net form submission on keydown instead of keyup.
Updated mapSettings description in options.md to highlight that zoom can be set to 0 for automatic centering and zooming.
Version 2.0.7
Fixed bug where reverse geocoding wasn't passing the origin to the templates (autogeocode and default location),
causing incorrect direction links.
Updated location list directions link to use https.
Version 2.0.6
Added the option to filter data exclusively rather than inclusively with the exclusiveFiltering setting.
Added callbackFilters that fires when a filter is changed and returns the filter values if needed.
Added dataRaw option to use raw KML, XML or JSON data instead of the AJAX call.
Added basic raw data example rawdata-example.php file.
Added visibleMarkersList option that updates the location list to only display data from the markers that are curently
displayed on the map.
Changed the distance error functionality so that the map centers and zooms automatically and all locations are
displayed on the map.
Fixed issue with fullMapStart and inlineDirections setting combination.
Fixed issue with global olat and olng variables not being set with autoGeocode setting enabled.
Fixed issue with maxDistance and autoGeocode setting combination.
Version 2.0.5
Fixed typo with originMarker setup.
Made the originMarkerDim setting optional when setting a custom origin marker image - defaults to 32px by 32px.
Removed geocodeErrorAlert language option and switched error alerts to custom exceptions so users aren't shown
multiple alerts.
Fixed bug with inline directions where close icon wasn't being removed on page reload.
Added callbackListClick that fires when a list element is clicked.
Added callbackMarkerClick that fires when a map marker is clicked.
Version 2.0.4
Fixed bug with maxDistance and pagination setting combination. The last page of of the pagination results was set to
use the locationsPerPage setting instead of the remaining number, which could have resulted in the plugin trying to
load undefined locations.
Fixed bugs with googleGeocode and reverseGoogleGeocode methods in which references to "this" were undefined.
Version 2.0.3
Fixed bug with maxDistance setting - updated locationsSetup method so that the locationset array uses array.push
instead of incrementing via a passed in parameter, which was causing undefined array elements and causing errors.
Removed testing line from maxdistance-example.html that was left in.
Version 2.0.2
Updated the Handlebars.compile calls when using the inline template options to include the ID hash so that it's
consistent with the other ID settings.
Fixed incorrect callback call in the modalClose method - callbackModalOpen to callbackModalClose.
Added callbackModalReady that fires when the the content of the modal is generated.
Quick fix to remove a dupicate copyright notice in dist/ file. Copyright was removed from src/jquery.storelocator.js
file to prevent duplication with the Grunt Banner task.
Version 2.0.0
Version 2 is a complete rewrite of the plugin based on the "basic" plugin pattern of the
jQuery Boilerplate. The overall file structure has changed, several of the plugin
settings have changed and all of the CSS is now prefixed to avoid potential collisions. In other words,
you're not going to be able to simply replace the main plugin file to upgrade to the latest version. I've been working
on this update off and on for the past six months, so a lot has changed. I've also added many new features based on the most common requests I've received. The following list doesn't cover everything that's new but all of the important items to note:
Grunt is now utilized to minify and compile the plugin and CSS. You only need to worry about running this if you're doing extensive modifications or are interested in submitting a pull request.
Many of the methods are public and can be called as needed
Google Maps settings are now exposed as a setting. Instead of trying to modify the plugin to make Google Maps settings changes simply use the mapSettings option to override.
Added inline directions option
Added multi-group live filtering via regex for quick category, etc. filtering.
Added option to search locations by name
Added option to set custom markers by category
Added option for paginating results
Added responsive Bootstrap example
Added region biasing setting to handle region/country select field
Added coordinates and address (user input) to primary AJAX GET request for better back-end integration
Added the possibility to set the 'storeLimit' option to -1, which means unlimited
Added the possibility to set the 'distanceAlert' option to -1, which means disable distance alert
Added little checks to only format 'web' variable when it is not null otherwise javascript would gives an error
Possibility to add custom variables in locations
If 'distance' variable is set in location, do not calculate it
Simplified some parts of the code
If noForm is true, only simulate the submit when the field is actually in focus
Version 1.4.7
Added ability to feature locations so that they always show at the top of the location list. To use, set the featuredLocations option to true and add featured="true" to featured locations in your XML or JSON locations data.
Version 1.4.6
Fixed a bug where infowindows wouldn't open if the map div was changed.
Version 1.4.5
A minor update that includes the latest versions of jQuery and Handlebars, two new location variables and some clean-up.
Added email and country variables for locations
Updated included Handlebars version to v1.0.0
Updated jQuery call to v1.10.1
Some bracket clean-up
Version 1.4.4
This update includes a bug fix for form re-submissions that was most apparent with the maximum distance example. It also includes a new jsonpCallback setting that was submitted by quayzar.
Moved markers array declaration up to line 115
Added a reset function that resets both the locationset and markers array and resets the list click event handler
Includes quayzar's jsonpCallback callback
Version 1.4.3
A minor update with some clean up and additional language options.
Additions:
Added several options for messaging so they can be easily translated into other languages
Added event namespacing
Added category to location variables
Fixes:
The distance error would only display "miles" in the alert. It will now show miles or kilometers depending on what the lengthUnit option is set to.
请发表评论