Maps Shortcodes

wpv-map-marker

Description
Adds a marker on a map.
Arguments
  • map_id. Mandatory. The unique ID for the map where this marker will be rendered. Must be a string.
  • marker_id. Mandatory. The unique ID for this marker. Must be a string.
  • marker_title. Optional, defaults to empty. When empty, and the marker comes from a meta field, it will automatically be populated with the post title, term name or user nicename. Shown when you hover over a marker.
  • id. Optional, defaults to empty. The ID of the object used to get the address meta field value for this marker.
  • marker_field. Optional. Source of the marker location when displaying a marker from an address postmeta field.
  • marker_termmeta. Optional. Source of the marker location when displaying a marker from an address termmeta field. When used on a View listing taxonomy terms, it uses the termmeta field from the current term in the View loop. Otherwise, you need to pass a value with the id attribute.
  • marker_usermeta. Optional. Source of the marker location when displaying a marker from an address usermeta field. When used on a View listing users, uses the usermeta field from the current user in the View loop. Otherwise, you need to pass a value using the id attribute.
  • address. Optional. Defaults to empty. Another optional source of the marker address, allows to display a marker given a fixed, known address.
  • lat and lon. Optional, both default to empty. Another optional source of the marker location, allows to display a marker given its latitude and longitude coordinates. Both values need to be passed.
  • marker_icon. Optional, defaults to empty, which means using the default Google Maps icons for markers, or the one set for the whole map. Can be a complete URL pointing to an image to use as marker image.
  • marker_icon_hover. Optional, defaults to empty, which means using the default Google Maps icons for markers or the one set for the whole map. Can be a complete URL pointing to an image to use as marker image when hovering over it.
Output
The marker of a map.

More Usage examples

Example
[wpv-map-marker map_id="my-map" marker_id="my-marker" marker_title="This is a marker" marker_field="wpcf-my-marker"]This is the content of the marker popup.[/wpv-map-marker]

wpv-map-render

Description
Renders a map.
Arguments
  • map_id. Mandatory. The unique ID for the map to be rendered. Must me a string.
  • map_width. Optional. Defaults to 100% . Can take just a number, which will be evaluated as number of pixels, or a number with an unit, like 80% , 300px or 50em.
  • map_height. Optional, defaults to 250 pixels . Again, can be just a number (evaluated as pixels) or a number with a unit.
  • fitbounds. Optional, defaults to on. Can be on or off. When on, the map zoom and center will be calculated to show all the markers at once in the closest possible view.
  • general_zoom. Optional, defaults to 5. When fitbounds is set to off, this one sets the zoom level of the map. The range of valid zoom levels for a Google Map depends on the detail of each position (in this case, the center), and the kind of map (terrain, traffic, etc). It goes from 0 (maximum zoom out) to a safe value of around 18, although on populated areas it can get up to 22.
  • general_center_lat and general_center_lon. Optional, coordinates for the map center when fitbounds is set to off. It takes valid latitude and longitude values: a latitude between -85 and 85, excluded, and a longitude between -180 and 180, included. Those numbers come from rstrictions from the Google Maps API.
  • single_zoom. Optional. Defaults to 14. When displaying a map with a single marker, using fitbounds set to on would zoom on the single marker at the maximum zoom level. This attribute overrides that behavior.
  • single_center. Optional, defaults to on . Can be on or off. In cases where fitbounds is set to off, you set specific map center options, and the map has only one marker, you can use this switch to override the centering settings and enforce centering on the sole marker.
  • cluster. Optional, defaults to off . Can be on or off . When set to on, markers close enough based on some rules will be rendered as a cluster.
  • cluster_grid_size. Optional. Defaults to 60 (pixels). When cluster is set to on, this attribute sets the minimum distance in pixels between two markers to join them into the same cluster.
  • cluster_max_zoom. Optional, defaults to empty. When cluster is set to on , this attribute sets the minimum zoom level that dissolves clusters into individual markers again.
  • cluster_click_zoom. Optional, defaults to on , can be on or off. This attribute sets whether clicking on a cluster should zoom it. By design, it sets the fitbounds value of the map based on the markers contained in that cluster. Sometimes, this attribute needs to be used together with the cluster_max_zoom attribute to dissolve a cluster when markers are too close.
  • cluster_min_size. Optional, defaults to 2. Minimum number of markers that can get wrapped into a cluster.
  • draggable. Optional, defaults to on. Can be on or off. Defines whether you can move the map view by dragging it.
  • scrollwheel. Optional, defaults to on. Can be on or off. It defines whether you can zoom the map using the mouse scrollwheel.
  • double_click_zoom. Optional, defaults to on, can be on or off. It defines whether double-clicking on a map should zoom it in.
  • map_type_control. Optional, defaults to on, can be on or off. It defines whether the map should display and offer map types control (terrain, roadmap, satellite, etc).
  • full_screen_control. Optional, defaults to off. Can be on or off . It defines whether the map should offer a control to toggle the full-screen view. Disabled by default as it might not work properly in all cases and is not included in the user interface either.
  • zoom_control. Optional, defaults to on, can be on or off . It defines whether the map should offer zooming controls.
  • street_view_control. Optional, defaults to on, can be on or off. It defines whether the map should offer controls for Street View.
  • background_color. Optional, defaults to empty. The hexadecimal color to use for the map background, visible when loading tiles. Must be prefixed with the right # character.
  • marker_icon. Optional, defaults to empty, which means using the default Google Maps icons for markers. Can be a complete URL pointing to an image to use as a marker for all markers on this map.
  • marker_icon_hover. Optional, defaults to empty, which means using the default Google Maps icons for markers. Can be a complete URL pointing to an image to use as a marker for all markers on this map, when hovering over them.
Output
A map on the frontend.

More Usage examples

Example
[wpv-map-render map_id="my-map" map_width="400px" map_height="200px" fitbounds="off" general_zoom="6" single_zoom="15" cluster="on"]

Extra Elements

There are some elements that are not actual shortcodes, but also provide interaction with maps.

Map focus on marker

Description
This is a clickable HTML element that focus on a marker of a map.
Arguments
  • A class with the value js-wpv-addon-maps-focus-map.
  • A data attribute data-map holding the value of the map ID to focus on.
  • A data attribute data-marker holding the value of the marker ID to focus on.
Output
A clickable element that focus on a marker of a map.

More Usage examples

Example
<button class="js-wpv-addon-maps-focus-map" data-map="my-map" data-marker="my-marker">Focus on marker</button>

Map reload

Description
This is a clickable HTML element that reloads a map.
Arguments
  • A class with the value js-wpv-addon-maps-reload-map.
  • A data attribute data-map holding the value of the map ID to reload.
Output
A clickable element that reloads a map.

More Usage examples

Example
<button class="js-wpv-addon-maps-reload-map" data-map="my-map">Reload the map</button>

Map zoom restore

Description
This is a clickable HTML element that restores the zoom of a map.
Arguments
  • A class with the value js-wpv-addon-maps-restore-map.
  • A data attribute data-map holding the value of the map ID to restore the zoom.
Output
A clickable element that restores the zoom of a map.

More Usage examples

Example
<button class="js-wpv-addon-maps-restore-map" data-map="my-map">Restore zoom of the map</button>