[GIS] TileStache + OpenLayers TMS – Tiles are rendered disorderly

coordinate systemmapnikopenlayers-2tilestilestache

I newly turned to TileStache to render Mapnik tiles because of the caching option. Before, I was using Mapnik python bindings only and it was working perfectly. Now that I use TileStache, the tiles are rendered randomly at wrong position in wrong order, just like pieces of a puzzle. Only at zoom 0 the features are on the right spot on the map.

enter image description here

This make me think that the problem could be with the row (y) and column (x) used to generate the tiles with coord = ModestMaps.Core.Coordinate(y, x, zoom) or with the projection wich is EPSG 900913.

I use OpenLayers.Layer.TMS for the mapping.

Here some codes:

Tiling script:

def tile(request, version, shapefile, zoom, x, y):
        config = {
            "cache": {
            "name": "Disk",
             "path": "/mygeosite/stache",
             "umask": "0000"},
          "layers": {
            shapefile.filename: {
                "provider": {"name": "mapnik", "mapfile": "c:\\mygeosite\\geodjango\\test.xml"},
                "projection": "spherical mercator"
            }
          }
        }

        # like http://tile.openstreetmap.org/1/0/0.png
        # x = row , y = column , zoom = zoom level
        coord = ModestMaps.Core.Coordinate(y, x, zoom)
        config = TileStache.Config.buildConfiguration(config)
        bytes = TileStache.getTile(config.layers[shapefile.filename], coord, 'png')
        return HttpResponse(bytes[2], mimetype="image/png")

mapnik.xml

<?xml version="1.0" encoding="utf-8"?>
<Map srs="+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs +over" background-color="rgb(115,145,173)">
    <Style name="featureLayerStyle">
        <Rule>
            <PolygonSymbolizer fill="rgb(247,237,238)"/>
            <LineSymbolizer stroke-width="0.5"/>
        </Rule>
    </Style>
    <Layer name="featureLayer" srs="+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs +over">
        <StyleName>featureLayerStyle</StyleName>
        <Datasource>
            <Parameter name="dbname">ezmapping</Parameter>
            <Parameter name="geometry_field">geom_multipolygon</Parameter>
            <Parameter name="geometry_table">&quot;shapefile_feature&quot;</Parameter>
            <Parameter name="password">ogrant22</Parameter>
            <Parameter name="simplify_geometries">1</Parameter>
            <Parameter name="srid">900913</Parameter>
            <Parameter name="table">(select geom_multipolygon, id from &quot;shapefile_feature&quot; where shapefile_id=68) as geom</Parameter>
            <Parameter name="type">postgis</Parameter>
            <Parameter name="user">postgres</Parameter>
        </Datasource>
    </Layer>
</Map>

OpenLayers.js:

map = new OpenLayers.Map('map',
          {maxResolution: 156543.0399,
            projection: new OpenLayers.Projection("EPSG:3857"),
            units: 'm',
            maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
            numZoomLevels: 21});
tiledLayer = new OpenLayers.Layer.TMS('TMS',
                "{{ tmsURL }}",
                {serviceVersion: "1.0",
                layername: "{{ shapefile.id }}",
                type: 'png'});
map.addLayer(tiledLayer);

Best Answer

Use OpenLayers.Layer.XYZ instead. TMS is just XYZ with the Y flipped for historical non-reasons.