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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
| //Clé API Géoportail
var APIkey= "g3fkg6ryrgrx16e8uwbnhtdk";
viewer= null;
var mousePositionCtrl = null; //variable pour localisation souris
//Charge l'application quand les informations de loadAPI sont chargées
function initMap() {
//Options
var options= {
mode:'normal',
territory:'FXX',
proxy:'assets/proxy.php?url='
};
viewer= new Geoportal.Viewer.Default('viewerDiv', OpenLayers.Util.extend(
options,
//Variable contenant la configuration des clefs API remplie par <Geoportal.GeoRMHandler.getConfig>
window.gGEOPORTALRIGHTSMANAGEMENT===undefined? {'apiKey':APIkey} : gGEOPORTALRIGHTSMANAGEMENT)
);
document.getElementById('viewerDiv').addEventListener('mousemove',getMousePosition);
if (!viewer) {
// problem ...
OpenLayers.Console.error(OpenLayers.i18n('new.instance.failed'));
return;
}
//
mousePositionCtrl = viewer.getMap().getControlsByClass('Geoportal.Control.MousePosition')[0];
//Style de couche
var myStyleMap = new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
'pointRadius': 10,
'strokeColor': "${getColor}",
'fillColor': '#ff0000'
},
{// Définition du contexte définissant la couleur de remplissage des ponctuels
context:{getColor: getColorFromName}
})
});
//
function getColorFromName(feature) {
if (feature.attributes.desc == 'circuit_litoral_montagne') {
return "red";
} else {
return "blue";
}
}
function getImageURL(f){
// pour les waypoints, on va chercher l'url
if(f.attributes.typeName == "wpt"){
if(f.attributes.sym == "depart"){
return "./img/depart.png"; //lien vers votre icône
}else if(f.attributes.sym == "arrivee"){
return "./img/arrivee.png"; //lien vers votre icône
}else if(f.attributes.sym == "toure"){
return "./img/toure.png"; //lien vers votre icône
}else{
return "";
}
// etc
}else{ // sinon, on retourne une chaine vide (pour les tracés ou les routes)
return "";
}
}
var myStyleMap = new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
'pointRadius': 5,
'strokeColor': "red",
'fillColor': '#ff0000',
'externalGraphic': "${getUrl}",
'graphicHeight':30,
'graphicHeight':30,
'graphicXOffset':0,
'graphicYOffset':-30,
},{
// Définition du contexte définissant les url d'images
context:{getUrl:getImageURL}
})
});
//Couches
viewer.addGeoportalLayer('GEOGRAPHICALGRIDSYSTEMS.MAPS' , {visibility:false, opacity:1});
viewer.addGeoportalLayer('GEOGRAPHICALGRIDSYSTEMS.PLANIGN' , {visibility:true, opacity:1});
//Chargement tracé test
viewer.getMap().addLayer(
'GPX',
'Trace',
'assets/TourDeFr.gpx',
{
visibility:true,
styleMap:myStyleMap,
}
);
//Centrage de la carte
viewer.getMap().setCenterAtLonLat(48.837244,2.289748,7);
}
//Fonction souris
function getMousePosition() {
var lat = parseInt(mousePositionCtrl.latInput.value);
var lon = parseInt(mousePositionCtrl.lonInput.value);
console.log('lat:'+lat+' ; lon:'+lon); //Ecriture longitude/latitude dans la console
}
//Fonction qui charge la configuration de la carte en fonction de la clé
function loadAPI() {
//On attend que les classes soient chargées
if (checkApiLoading('loadAPI();',['OpenLayers','Geoportal','Geoportal.Viewer','Geoportal.Viewer.Default'])===false) {
return;
}
Geoportal.GeoRMHandler.getConfig([APIkey], null,null, {
onContractsComplete: initMap
});
}
//Assignation de la fonction à appeler lors de la levée de l'évènement "onload"
window.onload= loadAPI; |
