Module: /ui/elements/layerStyle

/ui/elements/layerStyle

The module exports an object of methods to for the creation of layer style elements.

Dictionary entries:

layer_style_display_hover
layer_style_display_labels
layer_style_opacity
layer_style_select_theme
icon_scaling_field
icon_scaling_label
icon_scaling_cluster
icon_scaling_zoom_in
icon_scaling_zoom_out

Source: ui/elements/layerStyle.mjs, line 1

Requires

Methods

(inner) applyTheme(layer)

The applyTheme method assigns the label and hover configuration referenced by the setLabel and setHover keys of the current theme.

The method is called from the panel method prior to the creation of the style elements. The label and hover elements are therefore created for the configuration assigned by the current theme.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Attributes	Description
`layer.style`	layer-style		The layer style configuration.
`style.theme`	Object	<optional>	The current theme.
`theme.setLabel`	string	<optional>	Key for label from style.labels{} to assign.
`theme.setHover`	string	<optional>	Key for hover from style.hovers{} to assign.

Source: ui/elements/layerStyle.mjs, line 89

(inner) hover(layer) → {HTMLElement}

The hover() style element method will return a checkbox to toggle the display of the current hover.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Description
`layer.style`	layer-style	The layer style configuration.
`style.hover`	Object	The current hover.
`hover.hidden`	Boolean	Whether a checkbox should be returned.
`hover.display`	Boolean	The state of the hover.

Source: ui/elements/layerStyle.mjs, line 121

Returns:

A checkbox element to toggle the current hover.

Type:: HTMLElement

(inner) hovers(layer) → {HTMLElement}

The hovers() style element method will return a dropdown to change the current hover assigned to a layer.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Description
`layer.style`	layer-style	The layer style configuration.
`style.hover`	Object	The current hover.
`style.hovers`	Object	Object where each property represents a hover configuration.

Source: ui/elements/layerStyle.mjs, line 154

Returns:

A dropdown element to switch the current hover.

Type:: HTMLElement

(inner) icon_scaling(layer) → {HTMLElement}

The icon_scaling() style element method will returns a contents array with controls for icon.scaling properties (field, icon, clusterScale, zoomInScale, and zoomOutScale).

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Attributes	Description
`layer.style`	layer-style		The layer style configuration.
`style.icon_scaling`	Object		The icon_scaling config.
`icon_scaling.hidden`	Boolean		Do not show icon_scaling controls in panel.
`icon_scaling.field`	String	<optional>	Assign field value as feature property for scaling point feature icons.
`icon_scaling.fields`	Object	<optional>	An Object of objects with fields that can be assigned the feature property for scaling.
`icon_scaling.icon`	Boolean	<optional>	Add control to alter the base icon scale.
`icon_scaling.clusterScale`	Boolean	<optional>	Add control to alter the cluster.clusterScale value.
`icon_scaling.zoomInScale`	Boolean	<optional>	Add control to alter the zoomInScale value.
`icon_scaling.zoomOutScale`	Boolean	<optional>	Add control to alter the zoomOutScale value.

Source: ui/elements/layerStyle.mjs, line 448

Returns:

with contents array of HTMLElements to control icon scaling.

Type:: HTMLElement

(inner) label(layer) → {HTMLElement}

The label() style element method will return a checkbox to toggle the display of the current label.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Description
`layer.style`	layer-style	The layer style configuration.
`style.label`	Object	The current label.
`label.hidden`	Boolean	Whether a checkbox should be returned.
`label.display`	Boolean	The state of the label.

Source: ui/elements/layerStyle.mjs, line 205

Returns:

A checkbox element to toggle the current label.

Type:: HTMLElement

(inner) labels(layer) → {HTMLElement}

The labels() style element method will return a dropdown to change the current label assigned to a layer.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Description
`layer.style`	layer-style	The layer style configuration.
`style.label`	Object	The current label.
`style.labels`	Object	Object where each property represents a label configuration.

Source: ui/elements/layerStyle.mjs, line 273

Returns:

A dropdown element to switch the current label.

Type:: HTMLElement

(inner) panel(layer) → {HTMLElement}

The panel() style element method creates an array of style.elements from all available style property keys if not implicit.

The elements array will be mapped to return a flat array of HTMLElements as content for the layer.style.view node.

The layer.style.view is returned for the style drawer shown in the default mapp view layer.view.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Attributes	Description
`layer.style`	layer-style		The layer style configuration.
`style.elements`	Array	<optional>	Array of method keys to order elements in the layer.style.view.
`style.legend`	HTMLElement	<optional>	The legend node created by the theme element method.
`layer.showCallbacks`	Array		Array of methods executed on layer.show().

Source: ui/elements/layerStyle.mjs, line 39

Returns:

The layer.style.view element.

Type:: HTMLElement

(inner) theme(layer) → {HTMLElement}

The theme() style element method will returns a content array with elements for the theme meta text and legend.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Attributes	Description
`layer.style`	layer-style		The layer style configuration.
`style.legend`	HTMLElement	<optional>	The legend node created by the theme method into which the drawLegend method renders.
`style.theme`	Object		The current theme.
`theme.meta`	string	<optional>	Meta text to display.
`theme.meta_node`	HTMLElement	<optional>	The node created for the theme.meta text.

Source: ui/elements/layerStyle.mjs, line 341

Returns:

with contents array for the theme meta and legend.

Type:: HTMLElement

(inner) themes(layer) → {HTMLElement}

The themes() style element method will return a dropdown to change the current theme assigned to a layer.

The dropdown callback assigns the theme selected from the style.themes{} configuration and recreates the style panel for the current theme.

A location layer entry has no style drawer. The elements from the panel method replace the children of the entry style.panel. The children of a new style drawer replace those of the style drawer in the layer.view otherwise. The targets are exclusive since a node can only be moved into one parent.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Properties

Name	Type	Attributes	Description
`layer.style`	layer-style		The layer style configuration.
`style.panel`	HTMLElement	<optional>	The style panel element of a location layer entry.
`style.theme`	Object		The current theme.
`style.themes`	Object		Object where each property represents a theme.
`theme.title`	string	<optional>	Theme title for the dropdown placeholder and entries.
`layer.view`	HTMLElement	<optional>	The layer view containing the style drawer element.
`layer.reload`	function		The layer reload method called after the theme has been set.

Source: ui/elements/layerStyle.mjs, line 380

Returns:

A dropdown element to switch the current theme.

Type:: HTMLElement

(inner) zoomLabel(layer)

The method checks whether the label object has a min or maxZoom restriction and will toggle the status of the associated checkbox.

Parameters:

Name	Type	Description
`layer`	layer	A decorated mapp layer with a style object.

Source: ui/elements/layerStyle.mjs, line 251