#1 Wed 29 January 2014 12:22
- aGlumLieu
- Juste Inscrit !
- Date d'inscription: 24 Sep 2013
- Messages: 5
[OpenLayers] Définir la couleur d'un polygone
Bonjour à toutes/tous,
Je suis en train d'apprendre à me servir de la librairie OpenLayers depuis un ou deux jours, et me voilà confronté à un soucis que je n'arrive pas à solutionner !
Contexte:
En partant d'une carte OpenStreetMap, je souhaite pouvoir distinguer les différentes régions espagnoles en les représentant par des polygones de différentes couleurs.
Pour éviter de charger mon code inutilement, j'essaye pour commencer de représenter la région de Madrid ainsi que la région d'Extremadura.
Jusqu'ici le code est fonctionnel (voir ci dessous): je vous épargne les nombreuses lignes de coordonnées, je mets à disposition le code complet au format .html en pièce jointe.
Ma question est: Comment afficher chaque Polygone avec une couleur différentes ?
(J'essaye différentes méthodes depuis un moment sans succès...)
Je vous remercie d'avance pour votre aide, et passez une bonne journée !
aGlumLieu
Code:
<body> <h1>Hello GeoRezo</h1> <div id="map-id"></div> <div id="output-id"></div> <script> /* Partie création de la map + centrer à l'affichage */ var center = new OpenLayers.LonLat(-4, 40).transform( 'EPSG:4326', 'EPSG:3857'); var map = new OpenLayers.Map("map-id", {projection: 'EPSG:3857'}); var osm = new OpenLayers.Layer.OSM(); map.addLayer(osm); map.setCenter(center, 5); /* Partie création du layer*/ var geojson_format = new OpenLayers.Format.GeoJSON({ 'internalProjection': new OpenLayers.Projection("EPSG:900913"), 'externalProjection': new OpenLayers.Projection("EPSG:4326") }); var vector_layer = new OpenLayers.Layer.Vector(); map.addLayer(vector_layer); var featurecollection ={ "type": "FeatureCollection", "features": [{ "type": "Feature", "id": "stateMadrid", "geometry": { "type": "MultiPolygon", "coordinates": [[[[-7.5403752 [...] ]]]] } },{ "type": "Feature", "id": "stateExtremadura", "geometry": { "type": "MultiPolygon", "coordinates": [[[[-4.57900, [...] 40.629804200000002]]]] }, } ] } vector_layer.addFeatures(geojson_format.read(featurecollection)); </script>
[EDIT]: La pièce jointe ne passe pas (435Kb pourtant)
Dernière modification par aGlumLieu (Wed 29 January 2014 12:24)
"Dans chaque église, il y a toujours quelque chose qui cloche." J.Prevert
Hors ligne
#2 Wed 29 January 2014 16:36
- aGlumLieu
- Juste Inscrit !
- Date d'inscription: 24 Sep 2013
- Messages: 5
Re: [OpenLayers] Définir la couleur d'un polygone
J'ai trouvé ma solution tout seul, après plusieurs heures à écumer le web anglophone !
Au cas où quelqu'un se poserait la même question que moi, voici comment que j'ai fais grâce à la magie des StyleMap !
Code:
var style = new OpenLayers.Style( // C'est la manière de représenter les polygones par défaut { fillColor: "grey", }, // Chaque règles décrit la manière de représenter un polygones en fonction de l'attribut "name" renseigner lors de la création des polygones // du genre ==> "properties": {"name":"Paulo"} { rules: [ new OpenLayers.Rule({ // a rule contains an optional filter filter: new OpenLayers.Filter.Comparison({ type: OpenLayers.Filter.Comparison.EQUAL_TO, property: "name" value: "Paulo" }), // Si le nom du polygone est Paulo, alors j'applique la règle suivante fillColor: "blue", } }), new OpenLayers.Rule({ filter: new OpenLayers.Filter.Comparison({ type: OpenLayers.Filter.Comparison.EQUAL_TO, property: "name", value: "Georges" }), symbolizer: { fillColor: "green", } }), // Si aucune des règles n'est validée, j'applique la valeur par défaut new OpenLayers.Rule({elseFilter: true}) ] } );
Ciao
"Dans chaque église, il y a toujours quelque chose qui cloche." J.Prevert
Hors ligne