Store Locator Widget Advanced Usages

  1. Custom event button
    1. Example of store event handling
  2. Custom renderer
    1. Example of simple store custom renderers
    2. Example of advanced store custom renderers
  3. Baidu Map
    1. Autocomplete
    2. Basemap styling
    3. Autocomplete and Basemaps Baidu styling example

Custom event button

The Store Locator Widget provides a customizable event button in its store renderers.

When you use the methods listenOn or listenOnce, a new button is automatically displayed in the renderers.

You can also modify the default label for this button “Set as Favorite” by updating the Store Locator Widget configuration. Please refer to the customTranslations documentation to do so.

Example of store event handling

Custom renderer

Left store panel is fully customizable using setSummaryStoreRenderer setFullStoreRenderer

A more detailed article is available on the Woosmap blog.

The two following examples can be useful for those who want to customize the Store Locator Widget. The simple example is sort of a default theme that you can edit it to add or remove informations. The advanced example has all previous informations plus pictures and ratings.

Example of simple store custom renderers

Example of advanced store custom renderers

Baidu Map

Autocomplete

When using Baidu provider for Store Locator Widget, autocomplete allows user to search for city names directly at first character input. As the webapp provides an unified configuration to handle various provider options, you can use the places configuration the same way than with Google provider.

Please see MapsConf object Specification for more details.

Note that the Localities autocomplete service is not available for China yet.

Basemap styling

You can use some Baidu styling options by using the baiduMapStyle property of the WoosmapViewConf object Specification. Currently, only Baidu JsAPI v2 styling is available using the following styles :

Autocomplete and Basemaps Baidu styling example