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ů
You can find some examples in the JavaScript library on GitHub.
Also, in the directory lizmap-web-client/lizmap/install/qgis/media/js/
(or in
GitHub),
you can find examples of suitable JavaScript code.
Odstraňte příponu .example
a zkopírujte je do složky media/js/default/
, abyste je aktivovali.
API documentation
An automated generated documentation of the JavaScript API is available on 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.
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é.
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
Legend API
For a given layer buildings
:
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;
Please have a look to existing online demo, like the 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"
})
);