Map

The <salla-map> web component displays geographical maps from various sources. It supports multiple layers, tiled and full-image sources, adding markers, and interaction through events.

Example

Usage

HTML

SASS

Properties

Property	Attribute	Description	Type	Default
API Key	`api-key`	Valid Google Maps API Key.	`string`	`undefined`
Latitude	`lat`	Sets the map's latitude.	`number`	`undefined`
Longitude	`lng`	Sets the map's longitude.	`number`	`undefined`
Modal Title	`modal-title`	Modal Title	`string`	`undefined`
Name	`name`	File input name for the native formData	`string`	`'location'`
Read Only	`readonly`	Whether or not the actions are disabled or enabled.	`boolean`	`false`
Required	`required`	Set if the location input is required or not	`boolean`	`false`
Searchable	`seachable`	Whether or not to show the search bar.	`boolean`	`false`
Theme	`theme`	Sets map style.	`string`	`'light'`
Zoom	`zoom`	Sets the inital map zoom.	`number`	`10`

Events

Event	Description	Type
`currentLocationChanged`	This event will be fired when the current location is selected.	`CustomEvent<any>`
`invalidInput`	This event will be fired when the input is invalid.	`CustomEvent<any>`
`mapClicked`	This event will be fired when the map is clicked.	`CustomEvent<any>`
`selected`	This event will be fired when the location is selected.	`CustomEvent<any>`

Methods

The pre-defined methods allow for calling functions built by Salla to carry out certain actvities, such as open which opens the map component.

Method	Description	Return Type
`open()`	Open the map component	`Promise<HTMLElement>`

Example#

Usage#

Properties#

Events#

Methods#

Example

Usage

Properties

Events

Methods