1

I am making a WebGIS application for a course and I am trying to integrate some nice base layers like OMS, Stamen, and Bing Maps with my overlay layers that are for Bolivia from a Bolivian map platform. The Bolivian layers are in EPSG:32719 but on geoserver I have reprojected them into EPSG:4326. The base layers are apparently in a different projection but whatever I have tried I cannot get the two to show up together. Using the Blue Marble base layer or the NASA global topography base layer works with the Bolivian layers but not with the nicer base layers that are apparently in EPSG:3857.

I have included the whole source code below.

Carte des risques La Paz, Bolivie

<img src="http://www.unige.ch/presse/charte/logos_unige/Centres/ise/ise70.gif"          width="150" height="88" align="right">

<h1>Risques naturels La Paz El Alto</h1>


    <script
        src="http://openlayers.org/api/OpenLayers.js">
    </script>
    <script type="text/javascript" src="http://maps.stamen.com/js/tile.stamen.js?v1.3.0">
    </script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/1.1.0/proj4js-compressed.js">
    </script>
</head>
<body style="height:73%;">
    <div style="width:100%; height:100%" id="map">
<div id="description"> Auteurs: Marina de Vasconcelos Pinheiro et Robert Marinkovic     </div>
    </div>


</div>
<script defer="defer" type="text/javascript">
        var map = new OpenLayers.Map('map');
        map.projection = "EPSG:4326";
        map.displayProjection = new OpenLayers.Projection("EPSG:4326"); 

    var bingAPIKey = "AiaY10mQjAFg_MlOyEM0SXWReMtmE1IYA_fRx3d5y5iDNISFbMxxFSJ6r5k56pPR";

    var OSM = new OpenLayers.Layer.OSM("OSM");

    var bingAerialLayer = new OpenLayers.Layer.Bing({
                name: "bing Aerial",
                key: bingAPIKey,
                type: "Aerial"}, {layers: 'basic'}, {'displayInLayerSwitcher':true});       

    var Open_Layers = new OpenLayers.Layer.WMS(
        "OpenLayers WMS",
        "http://vmap0.tiles.osgeo.org/wms/vmap0",
        {layers: 'basic'}, {'displayInLayerSwitcher':true});

    var Blue_Marble = new OpenLayers.Layer.WMS(
        "Blue Marble",
        "http://neowms.sci.gsfc.nasa.gov/wms/wms?layers=BlueMarbleNG",
        {layers: 'basic'}, {'displayInLayerSwitcher':true});

    var Global_Topography = new OpenLayers.Layer.WMS(
        "Global Topography",
        "http://neowms.sci.gsfc.nasa.gov/wms/wms?layers=SRTM_RAMP2_TOPO",
        {layers: 'basic'}, {'displayInLayerSwitcher':true});

    var Stamen_Toner = new OpenLayers.Layer.Stamen("toner", {layers: 'basic'}, {'displayInLayerSwitcher':true});    


    var BRGM = new OpenLayers.Layer.WMS("BRGM",
        "http://129.194.80.54:8080/geoserver/g2015_i/wms?layers=g2015_i:BRGM",
        {transparent:'true'}, {'displayInLayerSwitcher':true});

    var Amenazas_naturales = new OpenLayers.Layer.WMS("Risques Naturels",
        "http://129.194.80.54:8080/geoserver/g2015_i/wms?layers=g2015_i:Amenazas_naturales",
        {transparent:'true'}, {'displayInLayerSwitcher':true}); 

    var Limites_Administratives = new OpenLayers.Layer.WMS("Limites Administratives",
        "http://129.194.80.54:8080/geoserver/g2015_i/wms?layers=g2015_i:IncidenciaDePobrezaExtremaEn2001",
        {transparent:'true'}, {'displayInLayerSwitcher':true}); 

    var Rios_La_Paz_El_Alto = new OpenLayers.Layer.WMS("Rivieres La Paz El Alto",
        "http://129.194.80.54:8080/geoserver/g2015_i/wms?layers=g2015_i:Rios_La_Paz_El_Alto",
        {transparent:'true'}, {'displayInLayerSwitcher':true}); 

    var Eventos_por_zonas = new OpenLayers.Layer.WMS("Evenements par zone",
        "http://129.194.80.54:8080/geoserver/g2015_i/wms?layers=g2015_i:Eventos_por_zonas",
        {transparent:'true'}, {'displayInLayerSwitcher':true}); 

    var SAT = new OpenLayers.Layer.WMS("Stations de mesure",
        "http://129.194.80.54:8080/geoserver/g2015_i/wms?layers=g2015_i:SAT",
        {transparent:'true'}, {'displayInLayerSwitcher':true});

    var kml = new OpenLayers.Layer.Vector("Université (kml)", {
            projection: map.displayProjection,   
            strategies: [new OpenLayers.Strategy.Fixed()],
            protocol: new OpenLayers.Protocol.HTTP({
                url: "/université.kml", 
                format: new OpenLayers.Format.KML({
                    extractStyles: false,
                    extractAttributes: true,
        visibility: true,
                    maxDepth: 2 
                  })
                })
         });


    var overview = new OpenLayers.Control.OverviewMap();
    map.addControl(overview);

    var scaleline = new OpenLayers.Control.ScaleLine();
    map.addControl(scaleline);

    var layer_switcher = new OpenLayers.Control.LayerSwitcher();
    map.addControl(layer_switcher);

    var mouse_position = new OpenLayers.Control.MousePosition();
    map.addControl(mouse_position);



map.addLayers([Open_Layers,Blue_Marble,Global_Topography,BRGM,Amenazas_naturales,Limites_Administratives,Rios_La_Paz_El_Alto,Eventos_por_zonas,SAT,kml,Stamen_Toner,bingAerialLayer,OSM]);  
map.zoomToMaxExtent();
map.setCenter(new OpenLayers.LonLat(-68.2,-16.5).transform(new OpenLayers.Projection("EPSG:3857"), new OpenLayers.Projection("EPSG:4326")), 10);

</script>
</body>
</html>
1

For OSM and similar maps, the map.projection has to be

projection: new OpenLayers.Projection("EPSG:900913"),

or EPSG:3857 if you prefer.

Just changing the code number to 4326 does not reproject the tiles automatically, but places them into a wrong part of the world. Since Opnelayers can not perform the reprojection on its own, you have to follow the hints given at OpenLayers doesn't show an overlay with a different SRS than the base layer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.