What to do with Mbutil Export for TileMill and Mapbox

Question

Hey all. Im just trying to figure out how to use my mbtile directory export. My files are located in a local directory "/mytiles". How can I configure this to use my custom layer?

  <head>
    <script src="http://www.openlayers.org/dev/OpenLayers.js"></script>
    <script type="text/javascript">

      var map;
      OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
      OpenLayers.ImgPath = "http://js.mapbox.com/theme/dark/";
      function init(){

        // Customize the values below to change the tileset.
        // This information is available on each tileset page.
        var layername = 'world-light';
        var file_extension = 'png';

        // Build the map
        var options = {
          projection: new OpenLayers.Projection("EPSG:900913"),
          displayProjection: new OpenLayers.Projection("EPSG:4326"),
          units: "m",
          numZoomLevels: 12,
          maxResolution: 156543.0339,
          maxExtent: new OpenLayers.Bounds(
            -20037500,
            -20037500,
            20037500,
            20037500
          )
        };
        map = new OpenLayers.Map('map', options);

        // Layer definitions
        var layer = new OpenLayers.Layer.TMS(
          "MapBox Layer",
          [ "http://a.tile.mapbox.com/","http://b.tile.mapbox.com/",
            "http://c.tile.mapbox.com/","http://d.tile.mapbox.com/" ],
          { 'layername': layername, 'type': file_extension }
        );

        // Add layers to the map
        map.addLayers([ layer ]);

        // Set the map's initial center point
        map.setCenter(new OpenLayers.LonLat(0, 0), 1);
      }

    </script>
  </head>
  <body onload="init()">
    <div id="map" style="width: 500px; height: 300px"></div>
  </body>

score 2 · Accepted Answer · answered Apr 12 '11 at 03:33

First, see the part of the code that includes http://a.tile.mapbox.com/. Replace that with the hostname or local name of your computer - this might be http://localhost/ or http://mycomputer.com/, etc. Then replace layername with the name of your layer.

Since this is using a TMS layer, you'll need to create a directory named 1.0.0 that'll lie in between these two things - you'll need to move your tiles there, if they're in a directory called mydirectory. The result would be like http://localhost/1.0.0/mydirectory.

So, if the URL of a tile is http://localhost/1.0.0/mydirectory/0/0/0.png, you'd have

var layer = new OpenLayers.Layer.TMS(
  "MapBox Layer",
  [ "http://localhost/" ],
  { 'layername': 'mydirectory', 'type': 'png' }
);

You can consult OpenLayers.org TMS for complete documentation of the layer type.

I'm having trouble making this work by your suggested method. I was under the impression that "layername" and "file_extension" were variables taken from earlier in the code. You've replaced the "layername" variable with a directory name. I'd love to make this work with data served by my own tilestream host. What am I missing? — Paul, May 16 '11 at 20:51

What to do with Mbutil Export for TileMill and Mapbox

1 Answers1