Class Editor

Constructors

constructor

Properties

container context id layers mapbox name options sprites

Methods

createElement display getContainer getContext getID getLayer getLayerFromStyle getLayers getStyle getStyleLayer setContext

Constructors

constructor

  • new Editor(options: EditorOptions): Editor

    Parameters

    Returns Editor

    Fires

    editor:layer:onclickvisibility

    Fires

    editor:layer:onclickclone

    Fires

    editor:layer:onclickremove

    Fires

    editor:style:oneditjson

    Fires

    editor:style:scale:onchangemin

    Fires

    editor:style:scale:onchangemax

    Fires

    editor:legend:onclickedition

    Fires

    editor:legend:onchangevalue

    Fires

    editor:filter:oneditjson

    Fires

    editor:themes:onclickimage

    Fires

    editor:themes:onclicktitle

    Fires

    editor:group:oncollapse

    Fires

    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) {...});

Properties

container

container: undefined | null | HTMLDivElement

context

context: undefined | {}

id

id: undefined | string | number

layers

layers: undefined | any[]

mapbox

mapbox: any

name

name:
    | undefined
    | {
        container: string;
        containerID: string;
        containerLayers: string;
        sep: string;
        target: string;
        titleLayers: string;
        titleLayersID: string;
        titleThemes: string;
        titleThemesID: string;
    }

options

options: EditorOptions

sprites

sprites: undefined | {}

Methods

createElement

display

getContainer

getContext

getID

getLayer

getLayerFromStyle

getLayers

getStyle

getStyleLayer

setContext

Settings

Member Visibility

On This Page

Constructors
Properties
Methods