S'abonner à un flux RSS
Test : Différence entre versions
De Wikhydro
| Ligne 4 : | Ligne 4 : | ||
<geoportal:map | <geoportal:map | ||
instance="map1" | instance="map1" | ||
| − | width=" | + | width="400px" height="400px" |
defaultLayers="['ORTHOIMAGERY.ORTHOPHOTOS','GEOGRAPHICALGRIDSYSTEMS.MAPS']" | defaultLayers="['ORTHOIMAGERY.ORTHOPHOTOS','GEOGRAPHICALGRIDSYSTEMS.MAPS']" | ||
defaultLayersOptions="{'GEOGRAPHICALGRIDSYSTEMS.MAPS':{opacity:0.5}}" | defaultLayersOptions="{'GEOGRAPHICALGRIDSYSTEMS.MAPS':{opacity:0.5}}" | ||
| − | layerSwitcherMode=" | + | layerSwitcherMode="off" |
| − | toolboxMode=" | + | toolboxMode="off" |
| − | infoPanelMode="true" | + | infoPanelMode="false" |
| − | /> | + | mode="mini" |
| + | lon=3.1009 lat=45.77679999999998 zoom=7 | ||
| + | > | ||
| + | <html> | ||
| + | var stylePopup= new OpenLayers.StyleMap({ | ||
| + | "default": new OpenLayers.Style( | ||
| + | OpenLayers.Util.applyDefaults({ | ||
| + | 'externalGraphic': "${getUrl}", | ||
| + | 'graphicOpacity': 1.0,'graphicWidth': 21,'graphicHeight': 25 | ||
| + | }, OpenLayers.Feature.Vector.style["default"]), | ||
| + | { | ||
| + | context: { | ||
| + | getUrl: function(feature){ | ||
| + | var url=feature.attributes.pictoUrl; | ||
| + | return url; | ||
| + | } | ||
| + | } | ||
| + | } | ||
| + | ), | ||
| + | }); | ||
| + | var lPopups= new OpenLayers.Layer.Vector("Projets", { | ||
| + | styleMap:stylePopup, opacity:1.0, visibility:true | ||
| + | }); | ||
| + | map1.getMap().addLayer(lPopups); | ||
| + | |||
| + | var clickOptions= { | ||
| + | onSelect: function(f) { | ||
| + | if (f.attributes.description) { | ||
| + | f.popup= new OpenLayers.Popup.FramedCloud( | ||
| + | "id", | ||
| + | f.geometry.getBounds().getCenterLonLat(), | ||
| + | new OpenLayers.Size(50,50), | ||
| + | f.attributes.description, null, true | ||
| + | ); | ||
| + | map1.getMap().addPopup(f.popup); | ||
| + | } | ||
| + | }, | ||
| + | onUnselect: function (f) { | ||
| + | if (f.popup) { | ||
| + | map1.getMap().removePopup(f.popup); | ||
| + | delete f.popup; | ||
| + | } | ||
| + | }, | ||
| + | autoActivate: true | ||
| + | }; | ||
| + | var vectorLayers= map1.getMap().getLayersByClass('OpenLayers.Layer.Vector'); | ||
| + | var clickControl= new OpenLayers.Control.SelectFeature(vectorLayers, clickOptions); | ||
| + | map1.getMap().addControl(clickControl); | ||
| + | var pt = new OpenLayers.Geometry.Point(2.961094665796523,45.997043316548705).transform(OpenLayers.Projection.CRS84,map1.getMap().getProjection()); | ||
| + | var f = new OpenLayers.Feature.Vector(pt); | ||
| + | f.attributes.description = "test2"; | ||
| + | f.attributes.pictoUrl = "http://api.ign.fr/geoportail/api/js/2.0.3/img/marker-gold.png"; | ||
| + | lPopups.addFeatures([f]); | ||
| + | </html> | ||
| + | </geoportal:map> | ||
Version du 5 juin 2013 à 10:11
