Mapbox Studio’s print export tool makes it possible to create high-resolution prints of any map style. Naturally, we were first in line to try the feature out, printing the amazingly loud and colorful “Wheatpaste” map for our Mapbox DC Garage. It’s a default map style that comes with Studio, designed by Ian Villeda, who was inspired by posters, flyers, and, of course, wheatpaste.

Here’s how we did it.

High-Resolution Printing with Mapbox Studio

Step 1. Design

If your map uses background images, make sure that they are high quality. Use .png or .svg files to ensure that they will scale up well for printing. Do a few test prints by downloading samples and printing them off to see how they look. Check out this Foundations article for tips on styling polygons with patterns and texture images.

In CartoCSS, Ian used the land paper texture: background-image: url(img/land_paper.png); and the water paper texture: polygon-pattern-file: url(img/water_paper.png); to add land and water texture to his design.

Ian styled the hillshades with the full_highlight.png, medium_highlight.png, full_shadow.png and medium_shadow.png files.

The test prints of the map looked good so I was ready to export the map.

Step 2. Export

To export the maximum quality image, set the image format to 24-bit .png in Studio’s Settings panel. Although .png files are meant for web, not print, they use lossless compression, unlike .jpeg files which use lossy compression. Lossless compression images render solid quality backgrounds, leaving no visible artifacts, and they convert well into CMYK.

Next, I opened the Export Image panel by clicking the image icon in the top right corner of Studio. I found that the final image was too large (96" x 59") to export in one piece. So I figured out the maximum size that I could export at my chosen zoom level of 13 and divided the image evenly into three image exports at 32" x 59" each.

To properly crop and export tileable images, I used Mapbox Studio to calculate my bounding box coordinates for each image section.

I started with the middle section. As illustrated in the diagram below, I centered my crop over Washington, DC and then set my crop size to 32" wide and 59" high, marked here in red. That gave me both the center latitude and longitude points (38.9048, -77.0403) and the W, S, E, N coordinates for the center export, marked here in blue.

Since the left and right export sections have the same dimensions as the center section, I only needed to change the longitude values. The outer W, E values from the center section became the inner E, W values , respectively, for the left and right sections. Given the crop size, then, Mapbox Studio automatically determined the correct outer longitude values, marked in purple.

Remember to use the center button and make sure that your W, S, E, N values stay the same. These values will jump around a bit as you re-adjust the bounding box.

After you have prepared your exports, jot down your final coordinates and download each image section as a .png with 300 ppi resolution.

Step 3. Print

In Photoshop, or an image editor of your choice, reassemble the map. You will also need to change the image color mode from indexed color to RGB and change the resolution from 72 to 300 ppi.

Working closely with our printer, Printmoz.com, I added crop marks with a 3" bleed around all sides of the map to ensure a proper and accurate final print.

Map delivery

The final massive printed canvas arrived on a truck last week.

The map looks incredible on canvas. If you ever stop by the Mapbox Garage in DC, ask to visit the room with the “Wheatpaste” canvas map.