[Tilecache] TileCache Transparent Overlays. Is it possible?

[Eric Lemoine]

On 3/30/07, Rupert de Guzman Jr <rupert at mapcentral.ph> wrote:
> Hi Everybody,
>
> Has anyone ever displayed a transparent overlay using TileCache 1.4?
> It just doesn't seem to work for me..
>
> Anyhow, I have two files up for viewing. "test1.cfm" is using tilecache both
> on the baselayer (basemap) and the overlay (roads). The baselayer shows up
> without any problems. The roads shows up but the layer is not transparent..
>
> http://222.128.19.19/tilecache/test1.cfm
>
> I have added "test2.cfm" which shows transparent layers but not using TC...
>
> http://222.128.19.19/tilecache/test2.cfm
>
> tilecache.cfg http://222.128.19.19/tilecache/ (viewable)
> +++++++++++++++++++++++++++++++++++
> [basemap]
> type=WMSLayer
> url=http://127.0.0.1/cgi-bin/mapserv?map=/home/map/beijing/new/wms.map
> layers=district,greens,major_river,minor_river
> bbox=-180,-90,180,90
> #maxresolution=1.40625
> metaTile=true
> extension=png
>
> [roads]
> type=WMSLayer
> url=http://127.0.0.1/cgi-bin/mapserv?map=/home/map/beijing/new/wms.map
> #layers=road4,road4label,road3,road3label,road2,road2label,road1,road1label,
> road11,road11label
> #bbox=116.1737,39.8211,116.5640,40.0799
> #maxresolution=1.40625
> bbox=-180,-90,180,90
> layers=road1,road1label,road11,road11label
> extension=png
> metaTile=true
>
> test1.cfm
> +++++++++++++++++++++++++++++++++++++
>
>      13     <cfset request.mapserv_plain = "/cgi-bin/mapserv" />
>      14     <cfset request.mapserv_tile = "/tilecache/tilecache.py" />
>      15
>      16     <cfset request.basemap_plain =
> "district,greens,major_river,minor_river" />
>      17     <cfset request.basemap_tile = "basemap" />
>      18
>      19     <cfset request.roads_plain =
> "road4,road4label,road3,road3label,road2,road2label,road1,road1label,road11,
> road11label" />
>      20     <cfset request.roads_tile = "roads" />
>      21
>      22     <script src="/OpenLayers/lib/OpenLayers.js"></script>
>      23     <script type="text/javascript">
>      24         <!--
>      25         //var lon = 116.3842;
>      26         //var lat = 39.9150;
>      27         var lon = 116.3846;
>      28         var lat = 39.9202;
>      29         var zoom = 15;
>      30         var map;
> .....
>      36         function init(){
>      37
>      38         OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
>      39
>      40         var options = {
>      41                         controls: [new
> OpenLayers.Control.MouseDefaults()],
>      42                         'numZoomLevels': 20
>      43                       };
>      44
>      45         map = new OpenLayers.Map( $('map'), options);
>      46
>      47         var layer_base = new OpenLayers.Layer.WMS(
>      48                     "Base Layer",
>      49                     "#request.mapserv_tile#",
>      50                     {
>      51                         map: '/home/map/beijing/new/wms.map',
>      52                         layers: '#request.basemap_tile#',
>      53                         format: 'image/png', 'transparent': 'false'
>      54                     },
>      55                     {
>      56                         'numZoomLevels': 20 ,
>      57                         maxExtent: new OpenLayers.Bounds(-180, -90,
> 180, 90)
>      58                     }
>      59                     );
>      60
>      61         var layer_road = new OpenLayers.Layer.WMS(
>      62                     "Road Layer",
>      63                     "#request.mapserv_tile#",
>      64                     {
>      65                         map: '/home/map/beijing/new/wms.map',
>      66                         layers: '#request.roads_tile#',
>      67                         format: 'image/png', 'transparent': 'TRUE'
>      68                     },
>      69                     {
>      70                         'numZoomLevels': 20 ,
>      71                         maxExtent: new OpenLayers.Bounds(-180, -90,
> 180, 90),
>      72                         reproject: false
>      73                     }
>      74                     );
>      75
>      76         map.addLayer(layer_base);
>      77         layer_base.setIsBaseLayer(true);
>      78
>      79         layer_road.setIsBaseLayer(false);
>      80         map.addLayer(layer_road);
>      81
>      82
>      83         map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
>      84         map.addControl( new OpenLayers.Control.LayerSwitcher() );
>      85         map.addControl( new OpenLayers.Control.PanZoomBar());
>      86
>      87         }
>
> Appreciate it if someone could post some code snippets showing transparent
> overlays in TC..

Hi Rupert,

Have you tried adding "transparent=true" at the end of your wms url in
tilecache.cfg? C.f.
<http://docs.codehaus.org/display/GEOSDOC/TileCache+Tutorial>

Cheers,

-- 
Eric Lemoine

Camptocamp France SAS
Savoie Technolac, BP 352
73377 Le Bourget du Lac, Cedex

Tel : 00 33 4 79 44 44 96
Mail : eric.lemoine at camptocamp.com
http://www.camptocamp.com