Discussion :

[superpoi]

Bonjour,

Je suis en train de refaire mon site pour passer sur OL3 via le SDK et je n'arrive pas à reporter le code suivant
qui me permettait d'ajouter une couche contenant une image positionnée sur un point de la carte.

// Création du POI à partir du point
stylepoi = {externalGraphic:'../Img/fc2.png', graphicWidth:42, graphicHeight:50 };
var mon_poi = new OpenLayers.Feature.Vector(point, {id: 1}, stylepoi);
vector_layer = new OpenLayers.Layer.Vector("POI");
// Ajout du POI à la couche créée et affichage de la couche
vector_layer.addFeatures([mon_poi]);
// Ajout de la couche à la carte
viewer.getMap().addLayer(vector_layer);

Je suis arrivé a traduire la partie Openlayer en OL3 :

stylepoi = {externalGraphic:'../Img/fc2.png', graphicWidth:42, graphicHeight:50 };
var mon_poi = new ol.Feature(point, {id: 1}, stylepoi);

var vectorSource = new ol.source.Vector({
features: [mon_poi]
});
var vector = new ol.layer.Vector({
source: vectorSource
});

Mais comment ajouter cette couche à ma map créée par le SDK ?
je n'arrive à rien avec map.addLayers (...).

Merci d'avance

[lboulanger]

Bonjour,

Il vous manque encore quelques éléments à traduire pour pouvoir ajouter une couche vectorielle à la carte.

• Pour le style : utiliser un constructeur de type ol.style.Style (http://openlayers.org/en/latest/apid...yle.Style.html)
• Pour la géométrie du point (ol.Feature) : voir les paramètres de ol.Feature (http://openlayers.org/en/latest/apidoc/ol.Feature.html) et de la géométrie d'un point (http://openlayers.org/en/latest/apid...eom.Point.html)
• Pour l'ajout à la carte, il faut utiliser la méthode addLayer d'OpenLayers, donc récupérer l'objet ol.Map avec la méthode map.getLibMap() (https://ignf.github.io/geoportal-sdk...html#getLibMap)
• Pour finir, il faut attendre que la carte soit complètement chargée avant de lui ajouter votre nouvelle couche (https://github.com/IGNF/geoportal-sd...-avec-la-carte)

Ce qui donne par exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
var map = Gp.Map.load(
	"map", // html div
	{
		// Votre clé de contrat
		apiKey: "CLE_A_INSERER",
		// map center (ici en longitude / latitude, en EPSG:4326. Plus d'options ici : https://ignf.github.io/geoportal-sdk/latest/jsdoc/Gp.Center.html)
		center : {
			x : 2,
			y : 48,
			projection : "EPSG:4326"
		},
		// map zoom level
		zoom : 10,
		// Couches à afficher. Plus d'options ici : https://ignf.github.io/geoportal-sdk/latest/jsdoc/Gp.LayerOptions.html
		layersOptions : {
			 // Cartes IGN
			"GEOGRAPHICALGRIDSYSTEMS.MAPS.SCAN-EXPRESS.STANDARD" : {}
		},
		mapEventsOptions : {
			// fonction déclenchée à la fin de l'initialisation de la carte
			"mapLoaded" : function(evt) {
				var coordinates = ol.proj.fromLonLat([2,48]);
				var point = new ol.geom.Point(coordinates);
				var mon_poi = new ol.Feature(point);
				var vectorSource = new ol.source.Vector({
					features : [mon_poi]
				});
				var stylepoi = new ol.style.Style({
					image : new ol.style.Icon({
						src : "../Img/fc2.png"
					})
				});
				var vectorLayer = new ol.layer.Vector({
					source: vectorSource,
					style : stylepoi
				});
				map.getLibMap().addLayer(vectorLayer);
			}
		}
	}
) ;

[superpoi]

Bonjour,
Merci beaucoup pour votre aide, c'est exactement ce qu'il me fallait.
Il me reste simplement un problème tout bête pour lequel je n'arrive pas à trouver la solution ...
Je veux simplement donner un nom à mon vector layer, ce qui apparament ce fait avec title :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
					var vectorLayer = new ol.layer.Vector({
						title: 'POI',
						source: vectorSource,
						style : stylepoi
						
					});

Mais lorsque je regarde dans le layer switcher je n'ai pas le nom que j'ai défini mais un nombre.
Est ce que j'ai oublié quelques chose ?
Merci d'avance

[lboulanger]

La propriété "title" est une option des couches ajoutées directement avec le SDK (dans layersOptions par exemple). Comme le SDK ne supporte qu'un certain nombre de formats pour les couches à ajouter, la couche vecteur a été ajoutée directement avec OpenLayers (dans le code précédent).
Vous avez probablement ajouté le layerSwitcher directement avec le SDK (dans controlsOptions par exemple), il ne prend donc en compte par défaut que la configuration des couches ajoutées via layersOptions.

Vous pouvez utiliser la fonction suivante pour ajouter un titre à votre couche :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
map.getLibMap().addLayer(vectorLayer);
map._addLayerConfToLayerSwitcher(vectorLayer, {title : "Mon titre perso"});

[superpoi]

Merci c'est parfait