Přidání vlastního JavaScriptu

Princip

Přidání JavaScriptu (JS) je užitečné pro různá pokročilá použití. Můžete například:

• skrýt některé prvky uživatelského rozhraní, které nechcete zobrazovat ve výchozím nastavení.

• přidání vlastního tlačítka do uživatelského rozhraní

• přidat vyskakovací okno při otevření projektu (pro zobrazení sponzorů, kreditů…)

• zabránit tomu, aby lidé mohli stahovat prvky stránky kliknutím pravým tlačítkem myši, a samozřejmě mnoho dalšího.

Předpoklady

• Tuto funkci musí aktivovat správce instance Lizmap.

• Adresář media. Přečtěte si, jak používat adresář Media v Lizmap.

Konfigurace nástroje

• V úložišti (např. /home/data/repo1/myproject.qgs) byste měli mít tyto adresáře:

  media
  |-- js
    |-- myproject
    |-- default
  

• Veškerý kód JavaScriptu, který zkopírujete do adresáře /home/data/rep1/media/js/myproject/, spustí Lizmap pouze pro tento konkrétní projekt.

• Veškerý kód JavaScriptu v default se spustí pro všechny projekty.

• Chcete-li povolit spouštění kódu JavaScript, musíte v administračním rozhraní Lizmap přidat oprávnění Povolit motivy pro tento repozitář.

Výukové video

Toto video je rychlý návod, jak přidat JavaScript pro změnu výchozího panelu v Lizmap.

Knihovna skriptů

Některé příklady najdete v JavaScriptové knihovně na GitHubu.

V adresáři lizmap-web-client/lizmap/install/qgis/media/js/ (nebo na GitHubu) najdete také příklady vhodného kódu v jazyce JavaScript.

Odstraňte příponu .example a zkopírujte je do složky media/js/default/, abyste je aktivovali.

Dokumentace API

Automatizovaně generovaná dokumentace rozhraní JavaScript API je k dispozici na docs.3liz.org.

Dostupné události Javascript

Kód Javascript může využívat mnoho událostí vyvolaných aplikací Lizmap Web Client. Zde je seznam všech dostupných událostí s vrácenými vlastnostmi.

Dostupné události webového klienta Lizmap

Název události	Popis	Vrácené vlastnosti
treecreated	Vyvolá se, když je na panelu legendy vytvořen strom vrstev
mapcreated	Vyvoláno po vytvoření mapy OpenLayers
layersadded	Vyvoláno po přidání vrstev Openlayers
uicreated	Vyvoláno po vytvoření rozhraní
dockopened	Vyvoláno při otevření doku (levý panel)	id
dockclosed	Spuštěno při zavření doku (levý panel)	id
minidockopened	Vyvolá se, když je otevřen minidok (pravý kontejner na nástroje).	id
minidockclosed	Vyvolá se, když je minidok uzavřen.	id
bottomdockopened	Spustí se při otevření spodního doku	id
bottomdockclosed	Vypaluje se při zavřeném spodním doku	id
lizmapbaselayerchanged	Vyvoláno při výměně základní vrstvy	vrstva
lizmapswitcheritemselected	Vyvolá se, když je vrstva zvýrazněna na panelu legendy vrstvy.	name | type | selected
layerstylechanged	Vyvolává se při změně stylu vrstvy	featureType
lizmaplocatefeaturecanceled	Vyvolá se, když uživatel zruší nástroj vyhledávání podle vrstvy.	featureType
lizmaplocatefeaturechanged	Vyvolá se, když uživatel vybere položku v nástroji vyhledávání podle vrstvy.	featureType | featureId
lizmappopupdisplayed	Vyvoláno při zobrazení obsahu vyskakovacího okna
lizmappopupallchildrendisplayed	Vyvolává se při zobrazení vyskakovacích oken všech podřazených objektů.	parentPopupElement | childPopupElements
lizmappopupdisplayed_inattributetable	Vyvolá se, když je obsah vyskakovacího okna zobrazen v tabulce atributů (pravý dílčí panel).
lizmapeditionformdisplayed	Vyvolává se při zobrazení formuláře pro editaci	layerId | featureId | editionConfig
lizmapeditionfeaturecreated	Vyvolá se, když byl prvek vrstvy vytvořen nástrojem pro editaci.	layerId
lizmapeditionfeaturemodified	Vyvolá se, když byl prvek vrstvy upraven nástrojem pro editaci.	layerId
lizmapeditionfeaturedeleted	Vyvolá se, když byl prvek vrstvy odstraněn nástrojem pro editaci.	layerId | featureId
attributeLayersReady	Vyvolá se, když jsou nastaveny všechny vrstvy, které se mají zobrazit v nástroji atributové vrstvy.	vrstvy
attributeLayerContentReady	Vyvolá se, když je v dolním doku zobrazena tabulka pro vrstvu.	featureType
layerfeaturehighlighted	Vyvolá se, když je prvek zvýrazněn v tabulce atributů ( šedý obdélník ). Vyvolání této události ručně vynutí obnovení podřízených tabulek, pokud pro vrstvu existují.	sourceTable | featureType | fid
layerfeatureselected	Spuštěním této události se spustí výběr prvku pro vrstvu, přičemž se předá id prvku. Jakmile je výběr proveden, je zpětně vyvolána událost layerSelectionChanged.	featureType | fid | updateDrawing
layerfeaturefilterselected	Vyvoláním této události se spustí filtrování vrstvy pro vybrané prvky. Před spuštěním této události musíte vybrat některé prvky. Jakmile je filtr použit, Lizmap zpětně vyvolá událost layerFilteredFeaturesChanged.	featureType
layerFilteredFeaturesChanged	Vyvolá se, když byl na mapu pro vrstvu použit filtr. Tato událost také spustí překreslení mapy a obsahu atributových tabulek.	featureType | featureIds | updateDrawing
layerFilterParamChanged	Vyvolává se, když se pro vrstvu změní parametry požadavků WMS. Například když byl pro vrstvu změněn STYL nebo FILTR.	featureType | filter | updateDrawing
layerfeatureremovefilter	Vyvoláním této události odstraníte všechny filtry použité na mapě. Jakmile je to provedeno, vyvolá se zpět událost layerFilteredFeaturesChanged a obsah mapy a atributových tabulek se obnoví.	featureType
layerSelectionChanged	Vyvolá se, když byl pro vrstvu změněn výběr. To také vyvolá překreslení obsahu atributové tabulky a obsahu mapy.	featureType | featureIds | updateDrawing
layerfeatureselectsearched	Vyvoláním této události se vyberou všechny prvky odpovídající zobrazeným řádkům tabulky atributů, které může uživatel vizuálně filtrovat zadáním některých znaků do textového vstupu pro vyhledávání.	featureType | updateDrawing
layerfeatureunselectall	Vyvoláním této události odstraníte všechny prvky z výběru vrstvy. Jakmile je to provedeno, Lizmap reaguje událostí layerSelectionChanged.	featureType | updateDrawing
lizmapexternalsearchitemselected	Vyvolá se, když uživatel vybere položku uvedenou ve výsledcích vyhledávání v záhlaví.	funkce
actionResultReceived	Vyvolává se, když byla provedena akce vyskakovacího okna Lizmap a byl přijat výsledek.	layerId | featureId | action | features

K dispozici jsou také některé proměnné.

Lizmap Web Client dostupné proměnné

Název proměnné	Popis
lizUrls.media	URL pro získání média
lizUrls.params.repository	Název aktuálního úložiště
lizUrls.params.project	Název aktuálního projektu

Příklady

Legenda API

Pro danou vrstvu budovy :

var layer = lizMap.mainLizmap.state.rootMapGroup.getMapLayerByName('buildings');
// Name of the current loaded style
layer.wmsSelectedStyleName
// Toggle true or false the layer in the legend
layer.checked = true;

Podívejte se prosím na existující online demo, jako je Paris by night

Zakázat kliknutí pravým tlačítkem myši

Přidejte soubor s názvem např. disableRightClick.js s následujícím kódem:

lizMap.events.on({
   uicreated: function(e) {
      $('body').attr('oncontextmenu', 'return false;');
   }
});

• Pokud chcete, aby se tento kód spustil pro všechny projekty vašeho úložiště, musíte soubor zkopírovat do adresáře /home/data/rep1/media/js/default/ a ne do /home/data/rep1/media/js/myproject/.

Odeslat aktuální přihlašovací ID uživatele

Příklad umožňující odeslat aktuální přihlašovací ID uživatele (a/nebo jiné údaje o uživateli) do sloupce tabulky PostgreSQL pomocí editačního nástroje:

var formPrefix = 'jforms_view_edition';

// Name of the QGIS vector layer fields which must contain the user info
// In the list below, replace the right side by your own fields in Lizmap
var userFields = {
   login: 'your_lizmap_user_login_field',
   firstname: 'your_lizmap_user_firstname_field',
   lastname: 'your_lizmap_user_lastname_field'
};


lizMap.events.on({

   'lizmapeditionformdisplayed': function(e){

      // If user is logged in
      if( $('#info-user-login').length ){
            // Loop through the needed fields
            for( var f in userFields ){
               // If the user has some data for this property
               if( $('#info-user-' + f).text() ){
                  // If the field exists in the form
                  var fi = $('#' + formPrefix + '_' + userFields[f]);
                  if( fi.length ){
                        // Set val from lizmap user data
                        fi.val( $('#info-user-' + f).text() )
                        // Set disabled
                        fi.hide();
                  }
               }
            }
      }

   }

});

URL statického souboru

Pokud chcete získat adresu URL statického souboru, který se nachází ve složce Media:

var media = '/media/image/logo.jpg';
// It can also be a media located in the common media folder such as
// var media = '../media/logo.png';
var url = lizUrls.media + '?repository=' + lizUrls.params.repository + '&project=' + lizUrls.params.project + '&path=' + media;
// console.log(url);
var image  = '<img src="' + url + '" title="Logo" style="display:inline;height:80px;margin:20px 10px;" />';

Je možné použít funkci z knihovny OpenLayers, která pomůže sestavit adresu URL :

var mediaUrl = OpenLayers.Util.urlAppend(
     lizUrls.media,
     OpenLayers.Util.getParameterString({
         "repository": lizUrls.params.repository,
         "project": lizUrls.params.project,
         "path": "picture.png"
     })
);