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>