Jump to Content

Objective HTML

Fieldtype Reference

The complete geolocation and mapping toolkit

Fieldtype Reference

The fieldtype has several parameters and can be called in the exp:channel:entries method just like any other channel field. The fieldtype will return a JSON response if you don't use the id parameter. Since most everyone will not even need this option, the id param is marked as required.

Basic Usage Example

Standard Parameters

Infobox Parameters

Additional Tags

id= required


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map"}

{/exp:channel:entries}	

This parameter is required so the marker can be added to the correct map. The id on the exp:gmap:init method must match the id parameter set in the fieldtype variable

Back to Top

append=


{exp:channel:entries channel="maps_channel"}

{exp:gmap:init id="map{entry_id}" style="width:400px;height:300px"}

{map id="map" append="true"}
	
	{entry_id}
	
{/map}

{/exp:channel:entries}

This parameter allows you to append a variable name to map's ID using the Google Maps fieldtype. When using this parameter that, you loose the ability to define your info window's within the template. However, if you use the exp:gmap:marker tag you can get around this parsing issue, but obviously if you need to plot routes or regions, then exp:gmap:marker would not work for you.

Back to Top

extend_bounds=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" extend_bounds="false"}

{/exp:channel:entries}	

This parameter is required if you don't want the zoom to be dynamically set based on the things added to the map.

Back to Top

icon=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" icon="some/file/path.png"}

{/exp:channel:entries}	

This allows you to define a custom icon for the markers. This will override any marker set within the fieldtype.

Back to Top

open_windows=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" open_windows="true"}

{/exp:channel:entries}	

This parameter is used to open all the windows when the map is loaded. This is most useful when a single window on a map needs to be displayed without a user clicking the marker.

Back to Top

parse=


{field_name parse="markers|route|regions"}

	{markers}
		{marker:title}
		{marker:content}
		{marker:latitude}, {marker:longitude}
		{marker:formatted_address}
		{marker:address_components}
			{short_name}
			{long_name}
			{types}
		{/marker:address_components}
		{marker:index}
		{marker:count}
		{marker:entry_id}
		{marker:offset}
	{/markers}

	{route}
		{route:title}
		{route:content}
		{route:latitude}, {marker:longitude}
		{route:formatted_address}
		{route:address_components}
			{short_name}
			{long_name}
			{types}
		{/route:address_components}
		{route:index}
		{route:count}
		{route:entry_id}
		{route:offset}
	{/route}

	{regions}
		{region:title}
		{region:content}
		{region:total_points} //Same as total_coords
		{region:total_coords}
		{region:stroke_color}
		{region:stroke_weight}
		{region:stroke_opacity}
		{region:fill_color}
		{region:fill_opacity}
		{region:coord_string}
		{region:coords}
			{lat}, {lng}
		{/region:coords}
	{/regions}

{/field_name}

This parameter allows you to access all the data stored within the Fieldtype without adding a marker to a map. Instead, this parameter will return variables based on each type of data you are plotting. For example, data associated to markers is different than regions.

Back to Top

show_one_window=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" show_one_window="true"}

{/exp:channel:entries}	

This parameter is used to only display one window at a time. If this param is set to true, then each time a user clicks a marker the other windows will close.

Back to Top

render=


{exp:gmap:init id="map_1" style="width:400px;height:300px"}
{exp:gmap:init id="map_2" style="width:400px;height:300px"}
{exp:gmap:init id="map_3" style="width:400px;height:300px"}
{exp:gmap:init id="map_4" style="width:400px;height:300px"}
{exp:gmap:init id="map_5" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map_1" render="markers"}
	{gis_gmap id="map_2" render="route"}
	{gis_gmap id="map_3" render="regions"}
	{gis_gmap id="map_4" render="markers|route"}
	{gis_gmap id="map_5" render="markers|route|regions"}

{/exp:channel:entries}					

This parameter is used when you want to limit what type of information is rendered on the map. This parameter allows you to create maps with only Markers or only Routes on a map, even though data might exist for all the available elements. You can plot any number of combinations by delimiting the value with a '|' character.

Without this parameter set, all elements will be plotted on the map.

Back to Top

Infobox Parameters

Infobox.js is supported if you want to create custom styles for info windows in ways that is not possible using the default methods. Simply set the infobox parameter to true. When the infobox parameter is set to true, then the following parameters become available. Most parameters are the officially support parameters, however some have been modified to better fit with the boundaries of ExpressionEngine templates.

It's important to note that these parameters control the styling of the windows. The way you define your infowindow content does not change using the infobox parameter.

Standard Parameters

class=



{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark"}

{/exp:channel:entries}

This parameter allows to set a class (or classes) on the infobox DOM object.

Back to Top

style=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" style="width:300px"}

{/exp:channel:entries}

This parameter allows to set a style (or styles) on the infobox DOM object.

Back to Top

alignBottom=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" alignBottom="true"}

{/exp:channel:entries}

This parameter aligns the bottom left corner of the InfoBox to the position location (default is false which means that the top left corner of the InfoBox is aligned).

Back to Top

clearanceX=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" clearanceX="10" clearanceY="10"}

{/exp:channel:entries}

This parameter allows you to change the minimum offset (in pixels) from the InfoBox to the map edge after an auto-pan. This parameter offset the X axis.

Back to Top

clearanceY=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" clearanceX="10" clearanceY="10"}

{/exp:channel:entries}

This parameter allows you to change the minimum offset (in pixels) from the InfoBox to the map edge after an auto-pan. This parameter offset the Y axis.

Back to Top

closeBoxMargin=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" closeBoxMargin="2px 2px 2px 10px"}

{/exp:channel:entries}

This parameter adds a margin style to the the close button.

Back to Top

closeBoxURL=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" closeBoxURL="/some/url/image.png"}

{/exp:channel:entries}

This parameter allows you to change the close image to something other than the default.

Back to Top

disableAutoPan=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" closeBoxURL="/some/url/image.png"}

{/exp:channel:entries}

This parameter allows you prevent the map from auto panning to the marker location when clicked.

Back to Top

enableEventPropagation=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" closeBoxURL="/some/url/image.png"}

{/exp:channel:entries}

This parameters disable all JavaScript events and makes the marker act more as a label.

Back to Top

isHidden=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" isHidden="false"}

{/exp:channel:entries}

This parameters hides the infowindow is set.

Back to Top

maxWidth=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" maxWidth="500"}

{/exp:channel:entries}

This parameters set the maximum width (in pixels) of the InfoBox. The maximum is set to 0 if there is no maximum set.

Back to Top

pane=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" pane="mapPanel"}

{/exp:channel:entries}

The pane where the InfoBox is to appear (default is "floatPane"). Set the pane to "mapPane" if the InfoBox is being used as a map label.

Back to Top

offsetX=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" offsetX="10" offsetY="10"}

{/exp:channel:entries}

This parameters offsets the X axis (in pixels).

Back to Top

offsetY=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" offsetX="10" offsetY="10"}

{/exp:channel:entries}

This parameters offsets the Y axis (in pixels).

Back to Top

zIndex=


{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap id="map" infobox="true" class="ui-infobox-dark" zIndex="5"}

{/exp:channel:entries}

This parameter sets zIndex for the infowindow.

Back to Top

Additional Tags

These tags require Google Maps for ExpressionEngine v3.3.0 or later to work properly.

:address_component

This tag will return the defined address components from the response. If more than 1 location is in the response, both will be returned.

Parameters

type
You must define a the type of address component to return. If you have two or more locations on the map, all results will be return. (required)
Google Maps stores address components in an abstract way. There is no "city" component, because "city" is specific to a locality. By default, US locality names are used. Use the table below to see what aliases are available for the various localities.
delimiter
This is a string that delimits the address components. By default, a space is used.
output
This parameter accepts two values: long_name or short_name. The long_name is used by default. If the short_name is used, the official abbreviation will be used for whatever value is being returned.
Country Code Possible Values
US street_number, street, city, township, state, zip, zipcode, zip_code, country
AU street_number, street, city, suburb, state, postcode, country


{exp:channel:entries channel="gis_data"}

	{gis_gmap:address_component height="300" width="300"}

{/exp:channel:entries}

Back to Top

:formatted_address

This tag will return the formatted addresss strings of map components in the field.

Parameters

limit
By default, there is no limit. If you only want to output a limited number of strings, use this parameter.
offset
By default, there is no offset. This paramter is used in conjuction with the limit parmater to offset the output.
process
By default markers, routes, and regions are processed. You can specify to process certain map components by overriding this paramater. Using a bar delimted list, you may enter either markers, waypoints, or regions.


{exp:channel:entries channel="gis_data"}

	{gis_gmap:formatted_address}

{/exp:channel:entries}

Back to Top

:static_map

This tag will return a static_map that resembles the map generated by the fieldtype. All the parameters available in the exp:gmap:static_map method are available this tag. The exception would be all the tags used to plot data, those are not available in the fieldtype tag since all your data is already stored in the channel entry.



{exp:channel:entries channel="gis_data"}

	{gis_gmap:static_map height="300" width="300"}

{/exp:channel:entries}

Back to Top

:total_markers

This tag will return the total markers for any entry.



{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap:total_markers}

{/exp:channel:entries}

Back to Top

:total_waypoints

This tag will return the total waypoints for any entry.



{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap:total_waypoints}

{/exp:channel:entries}

Back to Top

:total_regions

This tag will return the total regions for any entry.



{exp:gmap:init id="map" style="width:400px;height:300px"}

{exp:channel:entries channel="gis_data"}

	{gis_gmap:total_regions}

{/exp:channel:entries}

Back to Top