fix sprite atlas padding and icon centering

Pad each icon with one pixel on the bottom and right sides.

On top of this, extra padding is added to round the widths and heights
to multiples of four.

This then fixes the positions of the bottom and right vertices to
correctly center the icon's box around the center of the icon, not the
center of the padded icon.

js: 32ca4007699d1d21ab25bb38588b151510194030

fixes https://github.com/mapbox/mapbox-gl-js/issues/947

3 files changed, 9 insertions, 10 deletions

diff --git a/src/mbgl/geometry/sprite_atlas.cpp b/src/mbgl/geometry/sprite_atlas.cpp
index 2d6a8a7835..35365c7e4d 100644
--- a/src/mbgl/geometry/sprite_atlas.cpp
+++ b/src/mbgl/geometry/sprite_atlas.cpp
@@ -81,8 +81,8 @@ Rect<SpriteAtlas::dimension> SpriteAtlas::allocateImage(const size_t pixel_width
     // Increase to next number divisible by 4, but at least 1.
     // This is so we can scale down the texture coordinates and pack them
     // into 2 bytes rather than 4 bytes.
-    const uint16_t pack_width = pixel_width + (4 - pixel_width % 4);
-    const uint16_t pack_height = pixel_height + (4 - pixel_width % 4);
+    const uint16_t pack_width = (pixel_width + 1) + (4 - (pixel_width + 1) % 4);
+    const uint16_t pack_height = (pixel_height + 1) + (4 - (pixel_width + 1) % 4);
 
     // We have to allocate a new area in the bin, and store an empty image in it.
     // Add a 1px border around every image.
@@ -91,8 +91,8 @@ Rect<SpriteAtlas::dimension> SpriteAtlas::allocateImage(const size_t pixel_width
         return rect;
     }
 
-    rect.x += buffer;
-    rect.y += buffer;
+    rect.originalW = pixel_width;
+    rect.originalH = pixel_height;
 
     return rect;
 }
diff --git a/src/mbgl/text/placement.cpp b/src/mbgl/text/placement.cpp
index 84d4e20b2f..bc0f642c48 100644
--- a/src/mbgl/text/placement.cpp
+++ b/src/mbgl/text/placement.cpp
@@ -130,15 +130,13 @@ GlyphBox getMergedBoxes(const GlyphBoxes &glyphs, const Anchor &anchor) {
 
 Placement Placement::getIcon(Anchor &anchor, const Rect<uint16_t> &image, float boxScale,
                              const std::vector<Coordinate> &line, const StyleBucketSymbol &props) {
-    const float x = image.w / 2.0f; // No need to divide by image.pixelRatio here?
-    const float y = image.h / 2.0f; // image.pixelRatio;
 
     const float dx = props.icon.offset.x;
     const float dy = props.icon.offset.y;
-    float x1 = (dx - x);
-    float x2 = (dx + x);
-    float y1 = (dy - y);
-    float y2 = (dy + y);
+    float x1 = dx - image.originalW / 2.0f;
+    float x2 = x1 + image.w;
+    float y1 = dy - image.originalH / 2.0f;
+    float y2 = y1 + image.h;
 
     vec2<float> tl{x1, y1};
     vec2<float> tr{x2, y1};
diff --git a/src/mbgl/util/rect.hpp b/src/mbgl/util/rect.hpp
index f5c77f93d1..5cc398d821 100644
--- a/src/mbgl/util/rect.hpp
+++ b/src/mbgl/util/rect.hpp
@@ -9,6 +9,7 @@ struct Rect {
     inline Rect(T x_, T y_, T w_, T h_) : x(x_), y(y_), w(w_), h(h_) {}
     T x = 0, y = 0;
     T w = 0, h = 0;
+    T originalW = 0, originalH = 0;
 
     template <typename Number>
     Rect operator *(Number value) const {