Bonjour,
En utilisant l'extension pour OL3, j'essaie d'afficher 2 cartes dans une même page web.
Je constate un dysfonctionnement du widget de mesures.
Sur la seconde carte, tout va bien : les différents outils s'inactivent les uns les autres. Fonctionnement NORMAL.
Mais sur la première carte, ils ne s'annulent pas mutuellement, ce qui ne va évidemment pas.
Y a-t-il une solution ?
D'avance merci !
YD
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
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 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <!-- Library OpenLayers 3 --> <link rel="stylesheet" href="http://localhost/v3.20.1-dist/ol.css" /> <script src="http://localhost/v3.20.1-dist/ol.js"></script> <!-- Extension Géoportail pour OpenLayers 3 (avec Clé d'accès à l'API) --> <link rel="stylesheet" href="http://localhost/GpOpenLayers/GpPluginOl3.css" /> <script src="http://localhost/GpOpenLayers/GpPluginOl3.js"></script> <style type="text/css"> #map, #map01, #map02 { padding: 5px; width: 800px; height: 600px; box-shadow: 0 0 10px #999; } #info { padding: 5px; width: 100%; height: 20px; font-family : "monospace" ; font-size: 10px; } </style> </head> <body> <div id="map01"></div> <div id="info"></div> <div id="map02"></div> <div id="info"></div> <script> function go() { var photosLyr = new ol.layer.GeoportalWMTS({ layer: "ORTHOIMAGERY.ORTHOPHOTOS" }) ; var map01 = new ol.Map({ target: 'map01', layers: [ photosLyr ], view: new ol.View({ center: [288074.8449901076, 6247982.515792289], zoom: 15 }) }); var azi01 = new ol.control.MeasureAzimuth({ }); map01.addControl(azi01); var area01 = new ol.control.MeasureArea({ }); map01.addControl(area01); var length01 = new ol.control.MeasureLength({ }); map01.addControl(length01); var elep01 = new ol.control.ElevationPath({ }); map01.addControl(elep01); var ls01 = new ol.control.LayerSwitcher({}) ; map01.addControl(ls01) ; // xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx var photosLyr = new ol.layer.GeoportalWMTS({ layer: "ORTHOIMAGERY.ORTHOPHOTOS" }) ; var map02 = new ol.Map({ target: 'map02', layers: [ photosLyr ], view: new ol.View({ center: [288074.8449901076, 6247982.515792289], zoom: 15 }) }); var azi02 = new ol.control.MeasureAzimuth({ }); map02.addControl(azi02); var area02 = new ol.control.MeasureArea({ }); map02.addControl(area02); var length02 = new ol.control.MeasureLength({ }); map02.addControl(length02); var elep02 = new ol.control.ElevationPath({ }); map02.addControl(elep02); var ls02 = new ol.control.LayerSwitcher({}) ; map02.addControl(ls02) ; } Gp.Services.getConfig({ apiKey: "clé API", onSuccess: go }); var infoDiv = document.getElementById("info"); infoDiv.innerHTML = "<p> Extension OL3 version " + Gp.ol3extVersion + " (" + Gp.ol3extDate + ")</p>"; </script> </body> </html>
Partager