[mapserver-users] Mapserver layer over Google Maps

Sun May 6 18:33:26 PDT 2012

Hello list,

Using OpenLayers, I am trying to draw a Mapserver WMS layer on top of Google
Maps. I am aware of the Spherical Mercator projection and I am trying to use
the alias projection method described at the end of this link

http://docs.openlayers.org/library/spherical_mercator

The mapserver layer is in Lat/Lon WGS84 (EPSG:4326)
I have made some progress so far and I can see the label of the object at
full zoom, but as I zoom in it does not show anymore and the feature does
not show either.

Any help in finding the issue would be greatly appreciated.

This is the relevant map file code:

MAP
........
WEB
    TEMPLATE "/home/bicimapas/www/bcmpms.html"
    IMAGEPATH "/home/bicimapas/www/images/"
    IMAGEURL "/images/"    
    METADATA
    "wms_title" "BiciMapasMS"
    "wms_onlineresource"
"http://my_host/cgi-bin/mapserv?map=/home/bicimapas/mapdata/BiciMapasMS_Metr
o.map&"
    "wms_srs" "EPSG:4326 EPSG:3857"
    "wms_enable_request" "*"
    END
END

PROJECTION
    	"init=epsg:4326"
END

LAYER
    NAME "fibraoptica"
    DATA "fibraoptica"
    STATUS on
    TYPE line
    LABELCACHE on
    LABELITEM "RASGO"
    CLASSITEM "RASGO"
    METADATA
    "wms_title" "fibraoptica"
    "wms_srs" "EPSG:4326"
    "wms_include_items" "all"
    END
CLASS
        NAME "fibraoptica"
        EXPRESSION "fibra"
        #MAXSCALEDENOM 15000
        STYLE
            WIDTH 4
            COLOR 0 0 0
        END
        STYLE
            WIDTH 2
            COLOR 255 0 0
        END       
	LABEL
	    TYPE truetype
	    FONT "Arial"
	    #MAXSCALEDENOM 15000
	    ANTIALIAS true
	    SIZE 7
	    OUTLINECOLOR 255 255 255
            COLOR 0 0 0
            POSITION cc
	    	ANGLE follow
        END # label trutype
	END # class fibraoptica
END # layer fibraoptica    

END # mapfile

And the OpenLayers code is:

<html lang='en'> 
<head> 
    <meta charset='utf-8' /> 
    <script type='text/javascript' src='OpenLayers.js'></script>
	<script
src="http://maps.google.com/maps/api/js?sensor=false"></script>	
    <script type='text/javascript'>

    var map;

    function init() {
        // Setup map object
        map = new OpenLayers.Map('map_element', {});

		// Add Google Maps Layer
		var google_map_layer = new OpenLayers.Layer.Google(
			'Google Map Layer',
			{"sphericalMercator": true}
		);

     // override default epsg code
			aliasproj = new OpenLayers.Projection("EPSG:3857");
			google_map_layer.projection = aliasproj;

		// Add the Google Maps layer
		map.addLayer(google_map_layer);

		//add the mapserver layer

    		var layer3 = new OpenLayers.Layer.WMS(
		"Fibra Optica",
		"http://my_host/cgi-bin/mapserv?", 
		{map: '/home/bicimapas/mapdata/BiciMapasMS_Metro.map', 
		layers:'fibraoptica', transparent: true},
{isBaseLayer:false});

    // Add the layer
		map.addLayer(layer3);    

        // Add a layer switcher control
        map.addControl(new OpenLayers.Control.LayerSwitcher({}));

        //Zoom the map to the max extent 
		if(!map.getCenter()){
		map.zoomToMaxExtent();
		}
    }
    </script>
</head>

Thanks in advance

Alberto Najera