Open Layers Styling dessiner l'interaction en mode polygone

Question

J'essaie de modifier le style par défaut pour l'interaction polygone de dessin. Actuellement, il dessine une ligne de lignes bleues et remplit le polygone jusqu'à présent avec un remplissage semi-transparent. Cependant, si je le change, il connecte toujours le point actuel au premier point.

Quelqu'un peut-il me guider sur la façon dont cela a été réalisé?

Answer 1

Vous devez définir le style pour les deux, Layer et Interaction.

En définissant le style dans l'élément Draw, vous allez changer le style du polygone pendant que vous dessinez il:

var draw = new ol.interaction.Draw({ 
    source: source, 
    type: 'Polygon', 
    style: new ol.style.Style({ 
     fill: new ol.style.Fill({ 
      color: 'rgba(255, 255, 255, 0.5)' 
     }) 
    }) 
}); 

Et changer le style de la couche de vecteur qui partage la source avec le tirage au sort élément, vous allez modifier le style du polygone une fois qu'il est établi:

var vector = new ol.layer.Vector({ 
    source: source, 
    style: new ol.style.Style({ 
     fill: new ol.style.Fill({ 
      color: 'rgba(255, 255, 255, 0.9)' 
     }) 
    }) 
}); 

J'ai créé un jsfiddle