2010-04-30 4 views
6

Donc, fatigué de toujours voir les polygones réguliers par défaut orange vif, j'essaie d'apprendre à style OpenLayers.Problème avec OpenLayers Styles

J'ai eu un certain succès avec:

 var layer_style = OpenLayers.Util.extend({},OpenLayers.Feature.Vector.style['default']); 
    layer_style.fillColor = "#000000"; 
layer_style.strokeColor = "#000000"; 
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer"); 
polygonLayer.style = layer_style; 

Mais sinus je dessine mes polygones avec DrawFeature, mon style ne prend effet une fois que je l'ai fini de dessiner, et le voir accrochage de l'orange vif au gris est un peu déconcertant. Alors, j'appris sur les styles temporaires et essayé:

var layer_style = new OpenLayers.Style({"default": {fillColor: "#000000"}, "temporary": {fillColor: "#000000"}}) 
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer"); 
polygonLayer.style = layer_style; 

Cela m'a fait une place toujours en orange - jusqu'à ce que je me suis arrêté dessin, quand il claqua en noir complètement opaque. J'ai pensé que je devais peut-être définir explicitement le fillOpacity ... pas de dés. Même lorsque j'ai changé les deux couleurs de remplissage pour qu'elles soient roses et bleues, respectivement, je voyais seulement du noir orange et opaque. J'ai essayé de jouer avec StyleMaps, depuis que j'ai lu que si vous ajoutez seulement un style à une carte de style, il utilise celui par défaut pour tout, y compris le style temporaire.

var layer_style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']); 
var style_map = new OpenLayers.StyleMap(layer_style); 
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer"); 
polygonLayer.style = style_map; 

Cela m'a aussi donné le carré opaque noir. (Même si ce style de calque fonctionne lorsqu'il n'est pas donné à une carte). Passer la carte à la couche elle-même comme si:

polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer", style_map); 

N'a rien obtenu du tout. Orange tout le chemin, même après dessiné.

polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer", {styleMap: style_map}); 

Est beaucoup plus de succès: Orange tout en dessin, noir translucide avec contour noir lorsqu'il est dessiné. Tout comme quand je n'ai pas utilisé de carte. Le problème est toujours pas temporaire ...

Alors, j'ai essayé d'initialiser ma carte ainsi:

var style_map = new OpenLayers.StyleMap({"default": layer_style, "temporary": layer_style}); 

Non carré opaque, mais pas de dés pour le temporaire, que ce soit ... serpentine toujours en orange au noir transparent. Même si je fais un nouveau Style (layer_style2), et que je le mets temporairement à la place, toujours pas de chance. Et pas de chance avec le réglage du style "select" non plus.

Qu'est-ce que je fais mal? Temporaire IS pour styliser des choses qui sont en train d'être esquissées, correct? Existe-t-il un autre moyen spécifique au contrôleur drawFeature?

Modifier: Réglage du extendDefault est vrai ne semble pas aider, que ce soit ...

var style_map = new OpenLayers.StyleMap({"default": layer_style, "temporary": layer_style}, {"extendDefault": "true"}); 

Répondre

12

J'ai trouvé deux solutions pour ce problème. Dans les deux solutions, vous devez modifier certains paramètres de DrawFeature pour obtenir la fonctionnalité que vous souhaitez.

1. Modifiez le style du gestionnaire de DrawFeature. Fonction drawFeature dans OpenLayers.Handler.Polygon utilise le style de paramètre du gestionnaire pour la fonction. Donc vous devez changer ce style.

Lors de la création utilisation d'entité:

var drawPolygon = new OpenLayers.Control.DrawFeature(polygonLayer, OpenLayers.Handler.Polygon, {handlerOptions:{style:myStyle}}); 

Plus tard, vous pouvez le changer par:

drawPolygon.handler.style = myStyle; 

2.Change créer un rappel de DrawFeature. Modifier le style de la fonction temporaire nouvellement créée dans créer un rappel.

var drawPolygon = new OpenLayers.Control.DrawFeature(polygonLayer, OpenLayers.Handler.Polygon, { 
     callbacks:{create: function(vertex, feature) { 
      feature.style = myStyle; 
      this.layer.events.triggerEvent("sketchstarted", {vertex:vertex,feature:feature}) 
}}}); 

De même, vous pouvez modifier le rappel plus tard.

+3

Vous, monsieur, êtes un génie. Cela me rendait fou! Quand je jetais un coup d'œil aux options de gestionnaire de drawFeature, je ne voyais aucune sorte de "style" que je pouvais transmettre, donc je pensais que ce n'était pas une option ... Tout ce que je connaissais était l'option "sides:" , et même alors, je ne pouvais pas trouver une référence à l'endroit où dans l'API ils l'ont mentionné. Merci! – Jenny

+0

En utilisant la première solution, une fois que le polygone final est confirmé par un double-clic, le style revient à la valeur par défaut, donc à la fin je dois encore utiliser un rappel pour réinitialiser le style. –

4

Si vous voulez que tous les vecteurs à un style constant, mais pas l'orange ennuyeux essayez ceci:

vecLayer = new OpenLayers.Layer.Vector(
    "Route Layer", //layer name 
    {styleMap: new OpenLayers.StyleMap({ 
     pointRadius: "6", 
     fillColor: "#666666" 
    }), 
    renderers:renderer} 
); 

Vous avez des tas de propriétés que vous pouvez déconner avec, jetez un oeil à ces pages: