Le portail francophone de la géomatique

        var SHADOW_Z_INDEX = 10;
        var MARKER_Z_INDEX = 11;
        
        var DIAMETER = 200;
        var NUMBER_OF_FEATURES = 15;
            
        var map, layer;   
            
        function init() {
            map = new OpenLayers.Map("map");
            
            layer = new OpenLayers.Layer.Vector(
                "Marker Drop Shadows",
                {
                    styleMap: new OpenLayers.StyleMap({
                        // Set the external graphic and background graphic images.
                        externalGraphic: "../img/marker-gold.png",
                        backgroundGraphic: "./marker_shadow.png",
                        
                        // Makes sure the background graphic is placed correctly relative
                        // to the external graphic.
                        backgroundXOffset: 0,
                        backgroundYOffset: -7,
                        
                        // Set the z-indexes of both graphics to make sure the background
                        // graphics stay in the background (shadows on top of markers looks
                        // odd; let's not do that).
                        graphicZIndex: MARKER_Z_INDEX,
                        backgroundGraphicZIndex: SHADOW_Z_INDEX,
                        
                        pointRadius: 10
                    }),
                    isBaseLayer: true,
                    rendererOptions: {yOrdering: true}
                }
            );
            
            map.addLayers([layer]);
            
            // Add a drag feature control to move features around.
            var dragFeature = new OpenLayers.Control.DragFeature(layer);
            
            map.addControl(dragFeature);
            
            dragFeature.activate();
                        
            map.zoomToMaxExtent();
            
            drawFeatures();
        }
        
        function drawFeatures() {
            
            layer.removeFeatures(layer.features);
            
            // Create features at random around the center.
            var center = map.getViewPortPxFromLonLat(map.getCenter());
            
            // Add the ordering features. These are the gold ones that all have the same z-index
            // and succomb to y-ordering.
            var features = [];
            
            for (var index = 0; index < NUMBER_OF_FEATURES; index++) {
                // Calculate a random x/y. Subtract half the diameter to make some
                // features negative.
                var x = (parseInt(Math.random() * DIAMETER)) - (DIAMETER / 2);
                var y = (parseInt(Math.random() * DIAMETER)) - (DIAMETER / 2);
                
                var pixel = new OpenLayers.Pixel(center.x + x, center.y + y);
                
                var lonLat = map.getLonLatFromViewPortPx(pixel);
                features.push(
                    new OpenLayers.Feature.Vector(
                        new OpenLayers.Geometry.Point(lonLat.lon, lonLat.lat)
                    )
                );
            }
            
            layer.addFeatures(features);
        }

var map;

var SHADOW_Z_INDEX = 10;
var MARKER_Z_INDEX = 11;

//Init.
function init() {
    // Start position for the map (hardcoded here for simplicity, but maybe you want to get from URL params)
    var lat=46.5
    var lon=2.5
    var zoom=5
    var markers;
    var layer;
    var layerMapnik;
    var popup;

    // ICONS STYLE
    var size = new OpenLayers.Size(12,20);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);

    map = new OpenLayers.Map ("map", {
            controls:[
                new OpenLayers.Control.Navigation({zoomWheelEnabled: false}),
                new OpenLayers.Control.PanZoomBar(),
                new OpenLayers.Control.ArgParser(),
                new OpenLayers.Control.LayerSwitcher(),
                new OpenLayers.Control.ScaleLine(),
                new OpenLayers.Control.Permalink("permalink"),
                new OpenLayers.Control.MousePosition(),
                new OpenLayers.Control.Attribution()],
            numZoomLevels:6,
            projection:new OpenLayers.Projection('EPSG:4326'),
            displayProjection:new OpenLayers.Projection('EPSG:4326'),
            maxResolution: 156543.0399,
            units: 'm'
        } );

    // Define the map layer
    layerMapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik", 

                {
                    styleMap: new OpenLayers.StyleMap({
                        backgroundGraphic: "mm_20_shadow.png",
                        backgroundXOffset: 0,
                        backgroundYOffset: -7,
                        graphicZIndex: MARKER_Z_INDEX,
                        backgroundGraphicZIndex: SHADOW_Z_INDEX,
                        pointRadius: 10
                    }),
                    rendererOptions: {yOrdering: true}
                }

);
    map.addLayer(layerMapnik);

    // Center definition
    var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
    map.setCenter (lonLat, zoom);

    // GULLS OK XML
    var gullsok = new OpenLayers.Icon("mm_20_green.png", size, offset);
    var xmlgullsok = new OpenLayers.Layer.GeoRSS( 'GULL xmlisés', 'list_gulls_ok.php', {'icon':gullsok});
    xmlgullsok.popupSize = new OpenLayers.Size(150,70);
    map.addLayer(xmlgullsok);

    // GULLS NOK XML
    var gullsnok = new OpenLayers.Icon("mm_20_red.png", size, offset);
    var xmlgullsnok = new OpenLayers.Layer.GeoRSS( 'GULL non xmlisés', 'list_gulls_nok.php', {'icon':gullsnok});
    xmlgullsnok.popupSize = new OpenLayers.Size(150,70);
    map.addLayer(xmlgullsnok);

/* ONLOAD */
}
window.onload=init;

                {
                    styleMap: new OpenLayers.StyleMap({
                        backgroundGraphic: "mm_20_shadow.png",
                        backgroundXOffset: 0,
                        backgroundYOffset: -7,
                        graphicZIndex: MARKER_Z_INDEX,
                        backgroundGraphicZIndex: SHADOW_Z_INDEX,
                        pointRadius: 10
                    }),
                    rendererOptions: {yOrdering: true}
                }