Geoportal Extension for OpenLayers
API Reference

Class: Editor

ol.style.Editor

Editor Styles MapBox...

new Editor(options)

Controls/Editor/Editor.js, line 145
Name Type Description
options Object

options for function call.

Fires:
  • editor:layer:onclickvisibility
  • editor:layer:onclickclone
  • editor:layer:onclickremove
  • editor:style:oneditjson
  • editor:style:scale:onchangemin
  • editor:style:scale:onchangemax
  • editor:legend:onclickedition
  • editor:legend:onchangevalue
  • editor:filter:oneditjson
  • editor:themes:onclickimage
  • editor:themes:onclicktitle
  • editor:group:oncollapse
  • editor:onloaded
Example
var editor = new Editor ({
     target : "",
     style : "data/styles/layer.json",
     themes: {
         themesSummary : "",
         themes : [{
            "thumbnail": "data/images/layer0.png",
            "name": "standard0",
            "url": "data/styles/layer0.json",
            "description": "",
            "selected" : true
         },{
            "thumbnail": "data/images/layer1.png",
            "name": "standard1",
            "url": "data/styles/layer1.json",
            "description": ""
         }]
     },
     scope : this,
     events : {
         "editor:layer:onclickvisibility" : ...,
         "editor:layer:onclickclone" : ...,
         "editor:layer:onclickremove" : ...,
         "editor:style:oneditjson" : ...,
         "editor:style:scale:onchangemin" : ...,
         "editor:style:scale:onchangemax" : ...,
         "editor:filter:oneditjson" : ...,
         "editor:themes:onclickimage" : this._onClickEventImageTheme(),
         "editor:themes:onclicktitle" : function(e) {...}
     },
     tools : {
         // afficher/cacher les themes (par defaut) ou utiliser les options
         themes : true | false | {
             target : "...",
             tools : {
                 "thumbnails": true,
                 "button": { visible : true, type : "checkbox" }
             },
         },
         layers : true | false,     // afficher les couches (layers)
         search : true | false,     // TODO : afficher l'outil de recheche de couches
         style : true | false,      // afficher les styles (sous menu layers)
         filter : true | false,     // afficher les filtres (sous menu layers)
         legend : true | false,     // afficher les legendes (layers)
         group : true | false,      // grouper les couches, l'option 'sort' doit être activée (layers)
         groupAuto : true | false,  // definir la construction automatiques des groupes
         sort : true | false,       // trier les couches (layers)
         sortBy : "id|class|geom",  // definir le type de tri (layers)
         sortOrder : "asc, desc",   // definir l'ordre de tri (layers)
         title : true | false       // afficher les titres des rubriques,
         collapse : true | false | undefined // afficher et/ou plier les couches ou ne pas afficher l'option,
         type : true | false,       // afficher le type de geometrie (layers)
         pin : true | false,        // afficher la puce pour chaque couche (layers)
         visibility : true | false, // afficher l'icone de visibilité (layers),
         icon : {                   // afficher l'icone "oeil" ou "checkbox" (layers),
             "image" : true,
             "anchor" : "start" // afficher l'icone au debut ou à la fin de la ligne
         },
         editable : true | false    // active l'edition de la legende (legendes)
     }
  });
  // options par defaut
  {
     themes : false,
     layers : true,
     search : false,
     style : false,
     filter : false,
     legend : false,
     group : false,
     groupAuto : false,
     sort : true,
     sortBy : "id",
     sortOrder : "asc",
     title : true,
     collapse : undefined,
     type : true,
     pin : true,
     visibility : true,
     icon : {
         image : true,
         anchor : "end"
     },
     editable : true
  }
  // Context
  editor.setContext("map", map);
  editor.setContext("layer", layer);
  // create DOM
  editor.createElement()
    .then(() => {
      console.warn(editor.getID());
      console.log(this.getContext("map"));
      console.log(this.getContext("layer"));
    })
    .catch(error => {});
  // possibility to add listeners with globale variable : eventbus
  eventbus.addEventListener("editor:style:scale:onchangemin", function (e) {...});

Methods

createElement(){Promise}

Controls/Editor/Editor.js, line 830

Create Editor

display(display)

Controls/Editor/Editor.js, line 899

Set display container (DOM)

Name Type Description
display Boolean

show/hidden container

getContainer(){DOMElement}

Controls/Editor/Editor.js, line 926

Get container (DOM)

Returns:
element

getID(){Number}

Controls/Editor/Editor.js, line 918

Get id editor

getLayer(i){Object}

Controls/Editor/Editor.js, line 990

Get the layer object from a list sorted or not (see options.tools.sort)

Name Type Description
i Number

index

See:
Returns:
object

getLayerFromStyle(i){Object}

Controls/Editor/Editor.js, line 962

Get layer object from json style

Name Type Description
i Number

index into style json

Returns:
MapBox of a layers

getLayers(){Array}

Controls/Editor/Editor.js, line 980

Get a list of layer object sorted or not (see options.tools.sort)

See:
Returns:
of layer object

getStyle(){Object}

Controls/Editor/Editor.js, line 934

Get Style (json)

Returns:
MapBox

getStyleLayer(i){Object}

Controls/Editor/Editor.js, line 943

Get layer style (json)

Name Type Description
i Number

index

Returns:
MapBox of a layers