4

So I'm making a web app with a map that combines several layers (and dynamically toggles them off & on). I've made these layers in TileMill, exported them to .mbtiles files, and I'm serving them with TileStream. The problem I'm having is that these layers can be sparse -- there places that don't have any content. This leads to the map displaying content from two zoom levels at the same time.

The cause of this is that two well-meaning features that are interacting in an undesirable way:

  • TileMill doesn't generate tiles in areas where the layer has no content
  • When a tile is missing at one zoom level, Polymaps scales in a tile from another level. (So does Wax.)

Here's a picture of the problem. In this map, the street names and the (B) marker are on their own layer. Note the duplication for the (B) marker and the label of West 4th Ave. (in the lower left).

a picture of the problem

This diagram illustrates what's happening. The layer is blank in the upper left (since there's nothing to label in the water). Since TileMill didn't generate a tile there at zoom 15, Polymaps brings in the tile from zoom 14. If the tiles had opaque backgrounds, this would be OK. But since the tiles are transparent, the zoom 14 and 15 tiles overlap.

overlapping tiles

What can I do to avoid or work around this problem? I've come up with a few possibilities, all of which have drawbacks. Are there other options I'm overlooking? I'd appreciate any feedback or suggestions.

Switching toolkits: I'm open to moving to Leaflet or OpenLayers. But before I put in the effort, I'd appreciate some assurance that I won't have the same problem with those toolkits.

Using TileMill hosting: This will composite the tiles for me, but cost is a barrier. (I'd exceed the upload limits on the standard plan.) There's also the logistical complexity of making different composites for all the different combinations of layers I have.

Hacking up the .mbtiles files: The .mbtiles file is just a database, and I could add empty PNG files in for the missing tiles. This seems extreme, though, and I keep thinking there ought to be a simpler solution.

Improve this question

1 Answer 1

Reset to default
2

What does TileStream return when there's no content? 404's? Anyway, on tile load error OpenLayers will display a “broken tile” (a.k.a. “pink tile”), which you can customize as needed. OpenLayers will never display a scaled tile from a previous zoom level when loading a tile results in an error.

Improve this answer
1
  • TileStream returns a 404 when there's no content, yes.
    – Evan
    Commented May 15, 2012 at 22:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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