Aller au contenu principal

HTMLLayerElement

Propriétés​

checked​

HTMLLayerElement.checked est une valeur booléenne de lecteur et d’écriture qui active ou désactive la couche et reproduit l’attribut vérifié (checked). L’état vérifié est reproduit dans l’interface utilisateur du contrôle de la couche sous la forme d’une case à cocher à côté du nom de cette dernière. La propriété vérifiée peut servir à effectuer un changement programmatique de l’état vérifié de la couche. La propriété vérifiée ne peut être modifiée si l’état de la propriété est « désactivée »).

Pour activer l’état vérifié d’une couche activée :

let layer = document.querySelector('map-layer');
layer.checked = true; // les valeurs valides sont true | false

Pour lire l’état vérifié de la couche :

let layer = document.querySelector('map-layer');
let isChecked = layer.checked;

hidden​

HTMLLayerElement.hidden est une valeur booléenne de lecture et d’écriture qui ne masque ou n’affiche la couche qu’au niveau du contrôle de la couche. Masquer la couche n’a aucune incidence sur la présence de son contenu sur la carte, seulement sur le contrôle de la présence de la couche. Cela peut être utile pour gérer les couches de courte durée dans la carte, comme les résultats d’une recherche, sans que l’utilisateur soit obligé de gérer l’état de la couche, ce dont se charge votre application. Cela est également pratique pour gérer une couche permanente sans surcharger l’interface utilisateur.

Pour définir que la couche est masquée ou la mettre à jour avec cet état :

let layer = document.querySelector('map-layer');
layer.hidden = true; // les valeurs valides sont true | false

Pour obtenir la valeur hidden de <map-layer> :

let layer = document.querySelector('map-layer');
let isHidden = layer.hidden;

disabled​

HTMLLayerElement.disabled donne un accès en lecture seule à l’état désactivé de la couche. Une couche est désactivée si son contenu n’est pas rendu, soit parce qu’il sort complètement de l’étendue de la carte affichée ou parce qu’une erreur est associée au traitement de la couche, par exemple lorsque celle-ci se trouve dans un projection incompatible avec celle de la carte. Lorsqu’une couche est désactivée, l’utilisateur ne peut interagir avec elle au niveau du contrôle de la couche, et elle n’est pas visible dans la fenêtre d’affichage de la carte. Si la couche devient activée, par exemple à la suite d’une manipulation de la carte, l’utilisateur peut interagir avec elle au niveau du contrôle de la couche, et elle est visible dans la fenêtre d’affichage de la carte.

label​

HTMLLayerElement.label reflète l'attribut de contenu label, et spécifie un nom accessible de repli pour la couche, si le nom accessible n'est pas fourni par un élément local <map-title> enfant de l'élément <map-layer>, ou dans l'élément <map-head> d'un document MapML chargé via la valeur URL dans l'attribut src, respectivement.

Pour définir la label de <map-layer> ou mettre à jour celle-ci :

let layer = document.querySelector('map-layer');
layer.label = "Nouveau titre";

Pour obtenir la valeur de la label de <map-layer> :

let layer = document.querySelector('map-layer');
let label = layer.label;

src​

HTMLLayerElement.src reproduit l’attribut HTML src et précise l’adresse URL du document MapML de la couche. La propriété src peut ne pas être définie si la couche contient du contenu en ligne. Si la propriété src retourne une valeur, tout contenu en ligne est omis. Pour définir ou mettre à jour la src de <map-layer> :

let layer = document.querySelector('map-layer');
layer.src = "https://example.org";

Pour obtenir la valeur (adresse URL) de la src de <map-layer> :

let layer = document.querySelector('map-layer');
let url = layer.src;

opacity​

HTMLLayerElement.opacity donne accès en lecture ou en écriture à la valeur d’opacity, qui correspond dans le contrôle de couche pour chaque couche, sous "Opacité".

Pour définir ou mettre à jour l’opacité de <map-layer> :

let layer = document.querySelector('map-layer');
layer.opacity = 0.5; // les valeurs valides vont de 0.0 à 1.0

Pour obtenir la valeur de l’opacité de <map-layer> :

let layer = document.querySelector('map-layer');
let opacity = layer.opacity;

extent​

HTMLLayerElement.extent fournit un accès en LECTURE SEULE aux coordonnées en haut à gauche et en bas à droite du rectangle de délimitation minimal de la couche sous forme d'objet.

Pour obtenir la valeur de l'étendue de <map-layer> :

let layer = document.querySelector('map-layer');
let extent = layer.extent;

L'objet extent est structuré comme suit :

Cliquez pour afficher l'objet extent
{
    "projection": "CBMTILE",
    "topLeft": {
        "tcrs": [
            {
                "horizontal": 942.662039991251,
                "vertical": 1029.0945982508472
            },
/* un objet avec des propriétés "horizontal" et "vertical" pour chaque niveau de zoom dans le tableau */
            {
                "horizontal": 546743983.1949257,
                "vertical": 596874866.9854914
            }
        ],
        "tilematrix": [
            {
                "horizontal": 3.6822735937158244,
                "vertical": 4.019900774417372
            },
/* un objet avec des propriétés "horizontal" et "vertical" pour chaque niveau de zoom dans le tableau */
            {
                "horizontal": 2135718.6843551784,
                "vertical": 2331542.4491620758
            }
        ],
/* gcrs signifie "système de référence des coordonnées géographiques" */
        "gcrs": {
            "horizontal": -75.73195696514524,
            "vertical": 45.40761073808424
        },
/* pcrs signifie "système de référence des coordonnées projetées" */
        "pcrs": {
            "horizontal": 1509108.7182317898,
            "vertical": -170864.4342066869
        }
    },
    "bottomRight": {
        "tcrs": [
            {
                "horizontal": 942.7503158533199,
                "vertical": 1029.1828741129164
            },
            {
                "horizontal": 546795183.1949255,
                "vertical": 596926066.9854914
            }
        ],
        "tilematrix": [
            {
                "horizontal": 3.6826184213020308,
                "vertical": 4.0202456020035795
            },
            {
                "horizontal": 2135918.684355178,
                "vertical": 2331742.4491620758
            }
        ],
        "gcrs": {
            "horizontal": -75.67858731979081,
            "vertical": 45.387937810298354
        },
        "pcrs": {
            "horizontal": 1512495.3916717991,
            "vertical": -174251.10764670372
        }
    }
}

Méthodes​

zoomTo()​

HTMLLayerElement.zoomTo() zoom sur l'étendue de la couche dans la carte, au niveau de zoom maximum dans lequel l'étendue s'inscrit complètement.

let layer = document.querySelector('map-layer');
layer.zoomTo();

mapml2geojson(options)​

HTMLLayerElement.mapml2geojson(options) renvoie la couche au format GeoJSON.

FonctionRetoursDescription
mapml2geojson(<Object> options)Objet de collection de caractéristiques JavaScript (GeoJSON)Cette fonction transforme l’élément- enfant <feature> d’un élément <map-layer> en un objet GeoJSON FeatureCollection. Vous fournissez les options pour contrôler la transformation. Cette fonction doit servir dans un événement windows.onload.
attention

mapml2geojson doit être appelé dans un événement windows.onload pour fonctionner correctement, comme suit :

window.onload = (event) => {
  let layer = document.querySelector('map-layer');
  layer.mapml2geojson();
};

Paramètres​

ParamètreDescription
Élément <HTMLLayerElement>Élément <map-layer>
<Object> optionsVous fournissez des paramètres au moyen d’un objet d’options avec des noms d’option prédéfinis.

Options​

<Object> Ensemble de paires de clés ou de valeurs qui personnalise l’objet de sortie GeoJSON. Toutes les options sont facultatives et décrites ci-après.

OptionTypeDéfautDescription
propertyFunction<Function>n/aFonction que vous fournissez et qui mappe l’élément <map-properties> de la caractéristique à un membre GeoJSON "properties", puisque qu’il n’y a que vous qui connaît la conception du balisage dans votre valeur <map-properties>. Si vous ne fournissez pas cette option, une fonction par défaut essaiera de renverser un élément-enfant <table> de <map-properties>, comme si ce tableau était généré par la fonction d’option de propriétés par défaut de geojson2mapml.
transform<Boolean>trueTransforme des valeurs <map-coordinates> en valeurs gcrs (longitude, latitude), si elles ne le sont pas déjà. GeoJSON recommande d’utiliser les coordonnées de longitude et de latitude WGS 84, il s’agit donc là du comportement par défaut.
Remarques​

Au besoin, mapml2geojson transforme des coordonnées en gcrs par défaut avant la sérialisation. Prenez note que toutes les projections géographiques CRS (système de référence des coordonnées) ne sont pas équivalentes, et que l’interprétation de telles coordonnées n’est pas garantie conforme aux coordonnées WGS 84 ou GPS, et que, par conséquent, elles ne suivent pas nécessairement la recommandation GeoJSON, qui requiert des coordonnées de longitude et de latitude codées conformément au système géodésique WGS 84. Le moteur de projection utilisé pour mettre en œuvre cette conversion est incapable de transformer des coordonnées d’un ellipsoïde à un autre. Par conséquent, le JSON résultant DOIT (d’une manière qui reste à déterminer) être étiqueté avec la donnée qu’utilise la projection de la couche.

Événements​

Nom de l’événementDescription
changestyleDéclenché avant que la couche ne change de src parce que l’utilisateur a sélectionné un autre style au niveau du contrôle de la couche
changeprojectionDéclenché avant que la couche ne change de projection parce que la projection déclarée n’est pas égale à celle de la carte
loadedmetadataDéclenché lorsque les métadonnées d'une couche ont été chargées. L’intention est que cet événement soit analogue à l’événement loadedmetadata de l’élément média, mais avec les couches d’une carte.
map-changeDéclenché lorsque la couche est cochée ou décochée via le menu des couches (en cliquant ou en utilisant le clavier)

Exemples​

mapml2geojson​

Options par défaut​

Exemple montrant la sortie GeoJSON par défaut lorsqu’aucune option n’est fournie.

<map-layer label="Géometrie du point" checked="">
   <map-meta name="extent" content="top-left-longitude=-75.916809, top-left-latitude=45.886964, bottom-right-longitude=-75.516809,bottom-right-latitude=45.26964"></map-meta>
   <map-meta name="projection" content="OSMTILE"></map-meta>
   <map-meta name="cs" content="gcrs"></map-meta>
   <map-feature>
      <map-featurecaption>Géometrie du point</map-featurecaption>
      <map-geometry>
         <map-point>
            <map-coordinates>-75.6916809 45.4186964</map-coordinates>
         </map-point>
      </map-geometry>
      <map-properties>
         <table>
            <thead>
               <tr>
                  <th role="columnheader" scope="col">Nom de la propriété </th>
                  <th role="columnheader" scope="col">Nom de la propriété</th>
               </tr>
            </thead>
            <tbody>
               <tr>
                  <th scope="row">prop0</th>
                  <td itemprop="prop0">Ceci est un point</td>
               </tr>
            </tbody>
         </table>
      </map-properties>
   </map-feature>
</map-layer>
<script>
window.onload = (event) => {
   let layer = document.querySelector('map-layer');
   let output = layer.mapml2geojson();
};
</script>
Cliquez pour afficher la sortie GeoJSON
{
 "title": "Géométrie du point",
 "bbox": [-75.916809, 45.886964, -75.516809, 45.26964],
 "type": "FeatureCollection",
 "features": [{
     "type": "Feature",
     "geometry": {
         "type": "Point",
         "coordinates": [-75.6916809, 45.4186964]
     },
     "properties": {
         "prop0": "Ceci est un point"
     }
 }]
}

Spécifications​

Spécification
HTMLLayerElement

Exigences​

Signaler les problèmes liés à ces exigences sur GitHub

exigence amélioration peu pratique indécis en cours de discussion

SpecViewerAPI
Propriétéscompletcompletcomplet
Méthodescompletcompletcomplet