munimap - úprava clusterování

Pomocí parametru cluster je možné upravit výchozí chování shlukování do clusterů. Shlukování má základní 4 stavy:

• marked.multiple - cluster s více prvky, kde alespoň jeden je marker
• marked.single - cluster s jedním prvkem typu marker
• unmarked.multiple - cluster s více prvky, kde žádný není marker
• unmarked.single - cluster s jedním prvkem, který není marker

Pro každý stav lze nastavit vlastní ikonu (vč. velikosti a pozice) a barvu popisku. Parametr cluster má tedy následující vlastnosti:

• marked - cluster, kde alespoň jeden je marker - nepovinný parametr
  • icon - definice vlastní ikony - nepovinný parametr
    • single - cluster, který obsahuje pouze jeden prvek - nepovinný parametr
      • url - url ikony - povinný parametr
      • size - velikost ikony (šířka a výška v pixelech) - povinný parametr
      • position - pozice ikony (above - nad souřadnicemi, below - pod souřadnicemi, origin - na souřadnice) - nepovinný parametr
    • multiple - cluster, který obsahuje více prvků - nepovinný parametr
      • url - url ikony - povinný parametr
      • size - velikost ikony (šířka a výška v pixelech) - povinný parametr
      • position - pozice ikony (above - nad souřadnicemi, below - pod souřadnicemi, origin - na souřadnice) - nepovinný parametr
  • color - definice barvy popisku - nepovinný parametr
    • single - cluster, který obsahuje pouze jeden prvek - nepovinný parametr
    • multiple - cluster, který obsahuje více prvků - nepovinný parametr
• unmarked - cluster, ve kterém není žádný marker - nepovinný parametr
  • icon- definice vlastní ikony - nepovinný parametr
    • single - cluster, který obsahuje pouze jeden prvek - nepovinný parametr
      • url - url ikony - povinný parametr
      • size - velikost ikony (šířka a výška v pixelech) - povinný parametr
      • position - pozice ikony (above - nad souřadnicemi, below - pod souřadnicemi, origin - na souřadnice) - nepovinný parametr
    • multiple - cluster, který obsahuje více prvků - nepovinný parametr
      • url - url ikony - povinný parametr
      • size - velikost ikony (šířka a výška v pixelech) - povinný parametr
      • position - pozice ikony (above - nad souřadnicemi, below - pod souřadnicemi, origin - na souřadnice) - nepovinný parametr
  • color - definice barvy popisku - nepovinný parametr
    • single - cluster, který obsahuje pouze jeden prvek - nepovinný parametr
    • multiple - cluster, který obsahuje více prvků - nepovinný parametr

Kromě toho lze přenastavit hodnotu minimální vzdálenosti mezi jednotlivými clustery pomocí parametru:

• distance - minimální vzdálenost mezi clustery v pixelech - nepovinný parametr

<script type="text/javascript">
  munimap.create({
    target: 'map',
    markers: [
      new ol.Feature({
        geometry: new ol.geom.Point([16.6311797, 49.2019158]),
        label: 'Vojenská nemocnice',
        detail:'<h4>Vojenská nemocnice</h4><a href="www.vnbrno.cz" target="_blank">www.vnbrno.cz</a>',
        color: 'green',
        onClick: function (evt) { //evt: PointerEvent
          return {
            animation: 'zoomTo', //enum ['zoomTo', 'centerTo', 'none']
          };
        },
        icon: {
          url: '../munimap/rectangle.png',
          size: [20, 20], // [width, height] in px
          position: 'origin', // enum ['above', 'below', 'origin']           
        },
      }),
      new ol.Feature({
        geometry: new ol.geom.Point([16.612802, 49.190582]),
        label: 'Brno hlavní nádraží',
        detail: '<h4>Hlavní nádraží</h4><a href="https://www.cd.cz" target="_blank">www.cd.cz</a>',
      }),
      new ol.Feature({
        geometry: new ol.geom.Point([16.616667, 49.185833]),
        label: 'Autobusové nádraží Zvonařka'
      }),
      'BMA01',
      'BHA04N01019'
    ],
    cluster: {
      marked: {
        icon: {
          single: {
            url: '../munimap/rectangle_blue.png',
            size: [20, 20], // [width, height] in px
            position: 'above', // enum ['above', 'below', 'origin']
          },
          multiple: {
            url: '../munimap/rectangle_purple.png',
            size: [20, 20],
            position: 'above',
          }
        },
        color: {
          single: '#0000dc',
          multiple: 'purple'
        }
      },
      unmarked: {
        icon: {
          single: {
            url: '../munimap/triangle_orange.png',
            size: [20, 20],
            position: 'below',
          },
          multiple: {
            url: '../munimap/triangle_cyan.png',
            size: [20, 20],
            position: 'below',
          }
        },
        color: {
          single: 'orange',
          multiple: 'darkcyan'
        }
      },
    }
  });
</script>
      

Parametry funkce munimap.create jsou následující:

• target - určuje id elementu, do kterého se mapa vykreslí
• markers - pole zvýrazněných bodů (špendlíků). Poloha je popsána zeměpisnými souřadnicemi v pořadí zemepisná délka, zeměpisná šířka.
• cluster - konfigurace clusterování

Více se dozvíte v naší dokumentaci.