.. _solid-map:
solid-map
=========

Receives the URL of a resource or of a container of resources via its
``data-src`` attribute, and displays it on a **map**. Here is the list
of fields needed to display the resources properly:

-  ``http://www.w3.org/2003/01/geo/wgs84_pos#lat``: latitude on which the resource will be displayed
-  ``http://www.w3.org/2003/01/geo/wgs84_pos#lng``: longitude on which the resource will be displayed

``lat`` and ``lng`` properties are added to the default context to map
respectively ``http://www.w3.org/2003/01/geo/wgs84_pos#lat`` and ``http://www.w3.org/2003/01/geo/wgs84_pos#lng``.


How to use
----------

The ``solid-map`` module needs to be imported independantly from the core, like following:

.. code:: html

  <script type="module" src="https://unpkg.com/@startinblox/core/dist/components/solid-map.js"></script>


Mixins
------

This component uses the following mixins:

  * :ref:`counter-mixin <counter-mixin>`
  * :ref:`filter-mixin <filter-mixin>`
  * :ref:`grouper-mixin <grouper-mixin>`
  * :ref:`list-mixin <list-mixin>`
  * :ref:`next-mixin <next-mixin>`
  * :ref:`store-mixin <store-mixin>`
  * :ref:`widget-mixin <widget-mixin>`


Please check their documentation to know more about their capabilities.


Attributes
----------

Like for ``solid-display``, fields can be displayed and filters or searching capabilities can be
added to interact with the list of data being displayed.

``fields``
~~~~~~~~~~
  List of the fields to display in a popup which opens when a marker is clicked. If the attribute is not defined, no popup will show up.

``clustering``
~~~~~~~~~~~~~~
  *Available from version 0.16*

  If this attribute is defined, markers spacially close are grouped in clusters.

Events
-------

``resourceSelect``
~~~~~~~~~~~~~~~~~~~
   Triggered when a marker is clicked on the map

Useful links: 
---------------
  To find latitude and longitude: https://www.latlong.net/