Drawable Renderer (#1570), Setting up for fill patterns.

Handle color and cull modes better.
Rename `DrawableBuilder::ColorMode` to `ColorAttrMode` to avoid confusion with `gfx::ColorMode`.

CMakeLists.txt

@@ -931,6 +931,8 @@ if(MLN_WITH_OPENGL)
             ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/drawable_background.hpp
             ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/drawable_fill.hpp
             ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/drawable_fill_outline.hpp
+            ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/drawable_fill_outline_pattern.hpp
+            ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/drawable_fill_pattern.hpp
             ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/background_pattern.hpp
             ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/circle.hpp
             ${PROJECT_SOURCE_DIR}/include/mbgl/shaders/gl/clipping_mask.hpp

include/mbgl/gfx/drawable.hpp

@@ -20,8 +20,8 @@ enum class RenderPass : uint8_t;
 
 namespace gfx {
 
+class CullFaceMode;
 enum class DepthMaskType : bool;
-
 class DrawableTweaker;
 class ShaderProgramBase;
 using ShaderProgramBasePtr = std::shared_ptr<ShaderProgramBase>;
@@ -34,7 +34,7 @@ protected:
     Drawable(std::string name);
 
 public:
-    virtual ~Drawable() = default;
+    virtual ~Drawable();
 
     const util::SimpleIdentity& getId() const { return uniqueID; }
 
@@ -91,6 +91,9 @@ public:
     DepthMaskType getDepthType() const { return depthType; }
     void setDepthType(DepthMaskType value) { depthType = value; }
 
+    const gfx::CullFaceMode& getCullFaceMode() const;
+    void setCullFaceMode(const gfx::CullFaceMode&);
+
     /// Get the number of vertexes
     std::size_t getVertexCount() const { return getVertexAttributes().getMaxCount(); }
 
@@ -103,11 +106,11 @@ public:
     virtual std::vector<std::uint16_t>& getTriangleIndexData() const = 0;
 
     /// Attach a tweaker to be run on this drawable for each frame
-    void addTweaker(DrawableTweakerPtr tweaker) { tweakers.emplace_back(std::move(tweaker)); }
+    //void addTweaker(DrawableTweakerPtr tweaker) { tweakers.emplace_back(std::move(tweaker)); }
-    template <typename TIter>
+    //template <typename TIter>
-    void addTweakers(TIter beg, TIter end) {
+    //void addTweakers(TIter beg, TIter end) {
-        tweakers.insert(tweakers.end(), beg, end);
+    //    tweakers.insert(tweakers.end(), beg, end);
-    }
+    //}
 
     /// Get the tweakers attached to this drawable
     const std::vector<DrawableTweakerPtr>& getTweakers() const { return tweakers; }
@@ -140,7 +143,10 @@ protected:
     int32_t lineWidth = 1;
     int32_t layerIndex = -1;
     int32_t subLayerIndex = 0;
-    DepthMaskType depthType; // = DepthMaskType::ReadOnly;
+    DepthMaskType depthType;// = DepthMaskType::ReadOnly;
+    
+    struct Impl;
+    std::unique_ptr<Impl> impl;
 
     std::vector<DrawableTweakerPtr> tweakers;
 };

include/mbgl/gfx/drawable_builder.hpp

@@ -72,14 +72,15 @@ public:
     const Color& getColor() const;
     void setColor(const Color& value);
 
-    enum class ColorMode {
+    /// Handling of color attributes
+    enum class ColorAttrMode {
         None,
         PerDrawable,
         PerVertex
     };
     /// Set how the color value is used
     /// This should not be changed while a build is in progress
-    void setColorMode(ColorMode mode) { colorMode = mode; }
+    void setColorAttrMode(ColorAttrMode mode) { colorAttrMode = mode; }
 
     /// Width for lines
     int32_t getLineWidth() const { return lineWidth; }
@@ -88,6 +89,9 @@ public:
     DepthMaskType getDepthType() const { return depthType; }
     void setDepthType(DepthMaskType value) { depthType = value; }
 
+    const gfx::CullFaceMode& getCullFaceMode() const;
+    void setCullFaceMode(const gfx::CullFaceMode& value);
+
     /// Which shader to use when rendering emitted drawables
     const gfx::ShaderProgramBasePtr& getShader() const { return shader; }
     void setShader(gfx::ShaderProgramBasePtr value) { shader = std::move(value); }
@@ -143,7 +147,7 @@ public:
                       std::size_t indexLength);
 
     /// Add a tweaker to be attached to each emitted drawable
-    void addTweaker(DrawableTweakerPtr tweaker) { tweakers.emplace_back(std::move(tweaker)); }
+    // void addTweaker(DrawableTweakerPtr tweaker) { tweakers.emplace_back(std::move(tweaker)); }
 
 protected:
     /// Create an instance of the appropriate drawable type
@@ -167,8 +171,7 @@ protected:
     mat4 matrix;
     UniqueDrawable currentDrawable;
     std::vector<UniqueDrawable> drawables;
-    std::vector<DrawableTweakerPtr> tweakers;
+    ColorAttrMode colorAttrMode = ColorAttrMode::PerVertex;
-    ColorMode colorMode = ColorMode::PerVertex;
     VertexAttributeArray vertexAttrs;
 
     struct Impl;

include/mbgl/shaders/gl/drawable_fill_outline_pattern.hpp

@@ -0,0 +1,149 @@
+// Generated code, do not modify this file!
+// Generated on 2023-05-23T18:10:10.798Z by timsylvester using shaders/generate_shader_code.js
+
+#pragma once
+#include <mbgl/shaders/shader_source.hpp>
+
+namespace mbgl {
+namespace shaders {
+
+template <> struct ShaderSource<BuiltIn::FillOutlinePatternShader, gfx::Backend::Type::OpenGL> {
+    static constexpr const char* name = "FillOutlinePatternShader";
+    static constexpr const char* vertex = R"(uniform mat4 u_matrix;
+uniform vec2 u_world;
+uniform vec2 u_pixel_coord_upper;
+uniform vec2 u_pixel_coord_lower;
+uniform vec4 u_scale;
+
+layout (location = 0) in vec2 a_pos;
+
+out vec2 v_pos_a;
+out vec2 v_pos_b;
+out vec2 v_pos;
+
+#ifndef HAS_UNIFORM_u_opacity
+uniform lowp float u_opacity_t;
+layout (location = 1) in lowp vec2 a_opacity;
+out lowp float opacity;
+#else
+uniform lowp float u_opacity;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_from
+uniform lowp float u_pattern_from_t;
+layout (location = 2) in lowp vec4 a_pattern_from;
+out lowp vec4 pattern_from;
+#else
+uniform lowp vec4 u_pattern_from;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_to
+uniform lowp float u_pattern_to_t;
+layout (location = 3) in lowp vec4 a_pattern_to;
+out lowp vec4 pattern_to;
+#else
+uniform lowp vec4 u_pattern_to;
+#endif
+
+void main() {
+    #ifndef HAS_UNIFORM_u_opacity
+opacity = unpack_mix_vec2(a_opacity, u_opacity_t);
+#else
+lowp float opacity = u_opacity;
+#endif
+    #ifndef HAS_UNIFORM_u_pattern_from
+pattern_from = a_pattern_from;
+#else
+mediump vec4 pattern_from = u_pattern_from;
+#endif
+    #ifndef HAS_UNIFORM_u_pattern_to
+pattern_to = a_pattern_to;
+#else
+mediump vec4 pattern_to = u_pattern_to;
+#endif
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    float pixelRatio = u_scale.x;
+    float tileRatio = u_scale.y;
+    float fromScale = u_scale.z;
+    float toScale = u_scale.w;
+
+    gl_Position = u_matrix * vec4(a_pos, 0, 1);
+
+    vec2 display_size_a = vec2((pattern_br_a.x - pattern_tl_a.x) / pixelRatio, (pattern_br_a.y - pattern_tl_a.y) / pixelRatio);
+    vec2 display_size_b = vec2((pattern_br_b.x - pattern_tl_b.x) / pixelRatio, (pattern_br_b.y - pattern_tl_b.y) / pixelRatio);
+
+    v_pos_a = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, fromScale * display_size_a, tileRatio, a_pos);
+    v_pos_b = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, toScale * display_size_b, tileRatio, a_pos);
+
+    v_pos = (gl_Position.xy / gl_Position.w + 1.0) / 2.0 * u_world;
+}
+)";
+    static constexpr const char* fragment = R"(
+uniform vec2 u_texsize;
+uniform sampler2D u_image;
+uniform float u_fade;
+
+in vec2 v_pos_a;
+in vec2 v_pos_b;
+in vec2 v_pos;
+
+#ifndef HAS_UNIFORM_u_opacity
+in lowp float opacity;
+#else
+uniform lowp float u_opacity;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_from
+in lowp vec4 pattern_from;
+#else
+uniform lowp vec4 u_pattern_from;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_to
+in lowp vec4 pattern_to;
+#else
+uniform lowp vec4 u_pattern_to;
+#endif
+
+void main() {
+    #ifdef HAS_UNIFORM_u_opacity
+lowp float opacity = u_opacity;
+#endif
+    #ifdef HAS_UNIFORM_u_pattern_from
+mediump vec4 pattern_from = u_pattern_from;
+#endif
+    #ifdef HAS_UNIFORM_u_pattern_to
+mediump vec4 pattern_to = u_pattern_to;
+#endif
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    vec2 imagecoord = mod(v_pos_a, 1.0);
+    vec2 pos = mix(pattern_tl_a / u_texsize, pattern_br_a / u_texsize, imagecoord);
+    vec4 color1 = texture(u_image, pos);
+
+    vec2 imagecoord_b = mod(v_pos_b, 1.0);
+    vec2 pos2 = mix(pattern_tl_b / u_texsize, pattern_br_b / u_texsize, imagecoord_b);
+    vec4 color2 = texture(u_image, pos2);
+
+    // find distance to outline for alpha interpolation
+
+    float dist = length(v_pos - gl_FragCoord.xy);
+    float alpha = 1.0 - smoothstep(0.0, 1.0, dist);
+
+
+    fragColor = mix(color1, color2, u_fade) * alpha * opacity;
+
+#ifdef OVERDRAW_INSPECTOR
+    fragColor = vec4(1.0);
+#endif
+}
+)";
+};
+
+} // namespace shaders
+} // namespace mbgl

include/mbgl/shaders/gl/drawable_fill_pattern.hpp

@@ -0,0 +1,137 @@
+// Generated code, do not modify this file!
+// Generated on 2023-05-23T18:10:10.798Z by timsylvester using shaders/generate_shader_code.js
+
+#pragma once
+#include <mbgl/shaders/shader_source.hpp>
+
+namespace mbgl {
+namespace shaders {
+
+template <> struct ShaderSource<BuiltIn::FillPatternShader, gfx::Backend::Type::OpenGL> {
+    static constexpr const char* name = "FillPatternShader";
+    static constexpr const char* vertex = R"(uniform mat4 u_matrix;
+uniform vec2 u_pixel_coord_upper;
+uniform vec2 u_pixel_coord_lower;
+uniform vec4 u_scale;
+
+layout (location = 0) in vec2 a_pos;
+
+out vec2 v_pos_a;
+out vec2 v_pos_b;
+
+#ifndef HAS_UNIFORM_u_opacity
+uniform lowp float u_opacity_t;
+layout (location = 1) in lowp vec2 a_opacity;
+out lowp float opacity;
+#else
+uniform lowp float u_opacity;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_from
+uniform lowp float u_pattern_from_t;
+layout (location = 2) in lowp vec4 a_pattern_from;
+out lowp vec4 pattern_from;
+#else
+uniform lowp vec4 u_pattern_from;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_to
+uniform lowp float u_pattern_to_t;
+layout (location = 3) in lowp vec4 a_pattern_to;
+out lowp vec4 pattern_to;
+#else
+uniform lowp vec4 u_pattern_to;
+#endif
+
+void main() {
+    #ifndef HAS_UNIFORM_u_opacity
+opacity = unpack_mix_vec2(a_opacity, u_opacity_t);
+#else
+lowp float opacity = u_opacity;
+#endif
+    #ifndef HAS_UNIFORM_u_pattern_from
+pattern_from = a_pattern_from;
+#else
+mediump vec4 pattern_from = u_pattern_from;
+#endif
+    #ifndef HAS_UNIFORM_u_pattern_to
+pattern_to = a_pattern_to;
+#else
+mediump vec4 pattern_to = u_pattern_to;
+#endif
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    float pixelRatio = u_scale.x;
+    float tileZoomRatio = u_scale.y;
+    float fromScale = u_scale.z;
+    float toScale = u_scale.w;
+
+    vec2 display_size_a = vec2((pattern_br_a.x - pattern_tl_a.x) / pixelRatio, (pattern_br_a.y - pattern_tl_a.y) / pixelRatio);
+    vec2 display_size_b = vec2((pattern_br_b.x - pattern_tl_b.x) / pixelRatio, (pattern_br_b.y - pattern_tl_b.y) / pixelRatio);
+    gl_Position = u_matrix * vec4(a_pos, 0, 1);
+
+    v_pos_a = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, fromScale * display_size_a, tileZoomRatio, a_pos);
+    v_pos_b = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, toScale * display_size_b, tileZoomRatio, a_pos);
+}
+)";
+    static constexpr const char* fragment = R"(uniform vec2 u_texsize;
+uniform float u_fade;
+
+uniform sampler2D u_image;
+
+in vec2 v_pos_a;
+in vec2 v_pos_b;
+
+#ifndef HAS_UNIFORM_u_opacity
+in lowp float opacity;
+#else
+uniform lowp float u_opacity;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_from
+in lowp vec4 pattern_from;
+#else
+uniform lowp vec4 u_pattern_from;
+#endif
+#ifndef HAS_UNIFORM_u_pattern_to
+in lowp vec4 pattern_to;
+#else
+uniform lowp vec4 u_pattern_to;
+#endif
+
+void main() {
+    #ifdef HAS_UNIFORM_u_opacity
+lowp float opacity = u_opacity;
+#endif
+    #ifdef HAS_UNIFORM_u_pattern_from
+mediump vec4 pattern_from = u_pattern_from;
+#endif
+    #ifdef HAS_UNIFORM_u_pattern_to
+mediump vec4 pattern_to = u_pattern_to;
+#endif
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    vec2 imagecoord = mod(v_pos_a, 1.0);
+    vec2 pos = mix(pattern_tl_a / u_texsize, pattern_br_a / u_texsize, imagecoord);
+    vec4 color1 = texture(u_image, pos);
+
+    vec2 imagecoord_b = mod(v_pos_b, 1.0);
+    vec2 pos2 = mix(pattern_tl_b / u_texsize, pattern_br_b / u_texsize, imagecoord_b);
+    vec4 color2 = texture(u_image, pos2);
+
+    fragColor = mix(color1, color2, u_fade) * opacity;
+
+#ifdef OVERDRAW_INSPECTOR
+    fragColor = vec4(1.0);
+#endif
+}
+)";
+};
+
+} // namespace shaders
+} // namespace mbgl

include/mbgl/shaders/shader_manifest.hpp

@@ -1,5 +1,5 @@
 // Generated code, do not modify this file!
-// Generated on 2023-05-12T17:51:34.322Z by mwilsnd using shaders/generate_shader_code.js
+// Generated on 2023-05-23T18:10:10.798Z by timsylvester using shaders/generate_shader_code.js
 
 #pragma once
 #include <mbgl/shaders/shader_source.hpp>
@@ -8,6 +8,8 @@
 #include <mbgl/shaders/gl/drawable_background.hpp>
 #include <mbgl/shaders/gl/drawable_fill.hpp>
 #include <mbgl/shaders/gl/drawable_fill_outline.hpp>
+#include <mbgl/shaders/gl/drawable_fill_pattern.hpp>
+#include <mbgl/shaders/gl/drawable_fill_outline_pattern.hpp>
 #include <mbgl/shaders/gl/prelude.hpp>
 #include <mbgl/shaders/gl/background.hpp>
 #include <mbgl/shaders/gl/background_pattern.hpp>

include/mbgl/shaders/shader_source.hpp

@@ -1,5 +1,5 @@
 // Generated code, do not modify this file!
-// Generated on 2023-05-12T17:51:34.322Z by mwilsnd using shaders/generate_shader_code.js
+// Generated on 2023-05-23T18:10:10.798Z by timsylvester using shaders/generate_shader_code.js
 
 #pragma once
 #include <mbgl/gfx/backend.hpp>
@@ -14,6 +14,8 @@ enum class BuiltIn {
     BackgroundShader,
     FillShader,
     FillOutlineShader,
+    FillPatternShader,
+    FillOutlinePatternShader,
     Prelude,
     BackgroundProgram,
     BackgroundPatternProgram,

shaders/drawable.fill_outline_pattern.fragment.glsl

@@ -0,0 +1,43 @@
+
+uniform vec2 u_texsize;
+uniform sampler2D u_image;
+uniform float u_fade;
+
+in vec2 v_pos_a;
+in vec2 v_pos_b;
+in vec2 v_pos;
+
+#pragma mapbox: define lowp float opacity
+#pragma mapbox: define lowp vec4 pattern_from
+#pragma mapbox: define lowp vec4 pattern_to
+
+void main() {
+    #pragma mapbox: initialize lowp float opacity
+    #pragma mapbox: initialize mediump vec4 pattern_from
+    #pragma mapbox: initialize mediump vec4 pattern_to
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    vec2 imagecoord = mod(v_pos_a, 1.0);
+    vec2 pos = mix(pattern_tl_a / u_texsize, pattern_br_a / u_texsize, imagecoord);
+    vec4 color1 = texture(u_image, pos);
+
+    vec2 imagecoord_b = mod(v_pos_b, 1.0);
+    vec2 pos2 = mix(pattern_tl_b / u_texsize, pattern_br_b / u_texsize, imagecoord_b);
+    vec4 color2 = texture(u_image, pos2);
+
+    // find distance to outline for alpha interpolation
+
+    float dist = length(v_pos - gl_FragCoord.xy);
+    float alpha = 1.0 - smoothstep(0.0, 1.0, dist);
+
+
+    fragColor = mix(color1, color2, u_fade) * alpha * opacity;
+
+#ifdef OVERDRAW_INSPECTOR
+    fragColor = vec4(1.0);
+#endif
+}

shaders/drawable.fill_outline_pattern.vertex.glsl

@@ -0,0 +1,41 @@
+uniform mat4 u_matrix;
+uniform vec2 u_world;
+uniform vec2 u_pixel_coord_upper;
+uniform vec2 u_pixel_coord_lower;
+uniform vec4 u_scale;
+
+layout (location = 0) in vec2 a_pos;
+
+out vec2 v_pos_a;
+out vec2 v_pos_b;
+out vec2 v_pos;
+
+#pragma mapbox: define lowp float opacity
+#pragma mapbox: define lowp vec4 pattern_from
+#pragma mapbox: define lowp vec4 pattern_to
+
+void main() {
+    #pragma mapbox: initialize lowp float opacity
+    #pragma mapbox: initialize mediump vec4 pattern_from
+    #pragma mapbox: initialize mediump vec4 pattern_to
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    float pixelRatio = u_scale.x;
+    float tileRatio = u_scale.y;
+    float fromScale = u_scale.z;
+    float toScale = u_scale.w;
+
+    gl_Position = u_matrix * vec4(a_pos, 0, 1);
+
+    vec2 display_size_a = vec2((pattern_br_a.x - pattern_tl_a.x) / pixelRatio, (pattern_br_a.y - pattern_tl_a.y) / pixelRatio);
+    vec2 display_size_b = vec2((pattern_br_b.x - pattern_tl_b.x) / pixelRatio, (pattern_br_b.y - pattern_tl_b.y) / pixelRatio);
+
+    v_pos_a = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, fromScale * display_size_a, tileRatio, a_pos);
+    v_pos_b = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, toScale * display_size_b, tileRatio, a_pos);
+
+    v_pos = (gl_Position.xy / gl_Position.w + 1.0) / 2.0 * u_world;
+}

shaders/drawable.fill_pattern.fragment.glsl

@@ -0,0 +1,36 @@
+uniform vec2 u_texsize;
+uniform float u_fade;
+
+uniform sampler2D u_image;
+
+in vec2 v_pos_a;
+in vec2 v_pos_b;
+
+#pragma mapbox: define lowp float opacity
+#pragma mapbox: define lowp vec4 pattern_from
+#pragma mapbox: define lowp vec4 pattern_to
+
+void main() {
+    #pragma mapbox: initialize lowp float opacity
+    #pragma mapbox: initialize mediump vec4 pattern_from
+    #pragma mapbox: initialize mediump vec4 pattern_to
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    vec2 imagecoord = mod(v_pos_a, 1.0);
+    vec2 pos = mix(pattern_tl_a / u_texsize, pattern_br_a / u_texsize, imagecoord);
+    vec4 color1 = texture(u_image, pos);
+
+    vec2 imagecoord_b = mod(v_pos_b, 1.0);
+    vec2 pos2 = mix(pattern_tl_b / u_texsize, pattern_br_b / u_texsize, imagecoord_b);
+    vec4 color2 = texture(u_image, pos2);
+
+    fragColor = mix(color1, color2, u_fade) * opacity;
+
+#ifdef OVERDRAW_INSPECTOR
+    fragColor = vec4(1.0);
+#endif
+}

shaders/drawable.fill_pattern.vertex.glsl

@@ -0,0 +1,36 @@
+uniform mat4 u_matrix;
+uniform vec2 u_pixel_coord_upper;
+uniform vec2 u_pixel_coord_lower;
+uniform vec4 u_scale;
+
+layout (location = 0) in vec2 a_pos;
+
+out vec2 v_pos_a;
+out vec2 v_pos_b;
+
+#pragma mapbox: define lowp float opacity
+#pragma mapbox: define lowp vec4 pattern_from
+#pragma mapbox: define lowp vec4 pattern_to
+
+void main() {
+    #pragma mapbox: initialize lowp float opacity
+    #pragma mapbox: initialize mediump vec4 pattern_from
+    #pragma mapbox: initialize mediump vec4 pattern_to
+
+    vec2 pattern_tl_a = pattern_from.xy;
+    vec2 pattern_br_a = pattern_from.zw;
+    vec2 pattern_tl_b = pattern_to.xy;
+    vec2 pattern_br_b = pattern_to.zw;
+
+    float pixelRatio = u_scale.x;
+    float tileZoomRatio = u_scale.y;
+    float fromScale = u_scale.z;
+    float toScale = u_scale.w;
+
+    vec2 display_size_a = vec2((pattern_br_a.x - pattern_tl_a.x) / pixelRatio, (pattern_br_a.y - pattern_tl_a.y) / pixelRatio);
+    vec2 display_size_b = vec2((pattern_br_b.x - pattern_tl_b.x) / pixelRatio, (pattern_br_b.y - pattern_tl_b.y) / pixelRatio);
+    gl_Position = u_matrix * vec4(a_pos, 0, 1);
+
+    v_pos_a = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, fromScale * display_size_a, tileZoomRatio, a_pos);
+    v_pos_b = get_pattern_pos(u_pixel_coord_upper, u_pixel_coord_lower, toScale * display_size_b, tileZoomRatio, a_pos);
+}

shaders/manifest.json

@@ -20,6 +20,20 @@
         "glsl_frag": "drawable.fill_outline.fragment.glsl",
         "uses_ubos": false 
     },
+    {
+        "name": "FillPatternShader",
+        "header": "drawable_fill_pattern",
+        "glsl_vert": "drawable.fill_pattern.vertex.glsl",
+        "glsl_frag": "drawable.fill_pattern.fragment.glsl",
+        "uses_ubos": false 
+    },
+    {
+        "name": "FillOutlinePatternShader",
+        "header": "drawable_fill_outline_pattern",
+        "glsl_vert": "drawable.fill_outline_pattern.vertex.glsl",
+        "glsl_frag": "drawable.fill_outline_pattern.fragment.glsl",
+        "uses_ubos": false 
+    },
 
     {
         "name": "Prelude",

src/mbgl/gfx/drawable.cpp

@@ -1,4 +1,6 @@
 #include <mbgl/gfx/drawable.hpp>
+
+#include <mbgl/gfx/cull_face_mode.hpp>
 #include <mbgl/gfx/types.hpp>
 #include <mbgl/renderer/render_pass.hpp>
 #include <mbgl/util/mat4.hpp>
@@ -6,11 +8,26 @@
 namespace mbgl {
 namespace gfx {
 
+struct Drawable::Impl {
+    gfx::CullFaceMode cullFaceMode = gfx::CullFaceMode::disabled();
+};
+
 Drawable::Drawable(std::string name_)
     : name(name_),
       renderPass(RenderPass::Opaque),
       matrix(matrix::identity4()),
-      depthType(DepthMaskType::ReadOnly) {}
+      depthType(DepthMaskType::ReadOnly),
+      impl(std::make_unique<Impl>()) {}
+
+Drawable::~Drawable() = default;
+
+const gfx::CullFaceMode& Drawable::getCullFaceMode() const {
+    return impl->cullFaceMode;
+}
+
+void Drawable::setCullFaceMode(const gfx::CullFaceMode& value) {
+    impl->cullFaceMode = value;
+}
 
 } // namespace gfx
 } // namespace mbgl

src/mbgl/gfx/drawable_builder.cpp

@@ -23,6 +23,13 @@ void DrawableBuilder::setColor(const Color& value) {
     impl->currentColor = value;
 }
 
+const gfx::CullFaceMode& DrawableBuilder::getCullFaceMode() const {
+    return impl->cullFaceMode;
+}
+void DrawableBuilder::setCullFaceMode(const gfx::CullFaceMode& value) {
+    impl->cullFaceMode = value;
+}
+
 const UniqueDrawable& DrawableBuilder::getCurrentDrawable(bool createIfNone) {
     if (!currentDrawable && createIfNone) {
         currentDrawable = createDrawable();
@@ -39,9 +46,9 @@ void DrawableBuilder::flush() {
         draw->setLayerIndex(layerIndex);
         draw->setSubLayerIndex(subLayerIndex);
         draw->setDepthType(depthType);
+        draw->setCullFaceMode(impl->cullFaceMode);
         draw->setShader(shader);
         draw->setMatrix(matrix);
-        draw->addTweakers(tweakers.begin(), tweakers.end());
 
         if (auto drawAttrs = getVertexAttributes().clone()) {
             vertexAttrs.observeAttributes([&](const std::string& iName, const VertexAttribute& iAttr) {
@@ -100,7 +107,7 @@ void DrawableBuilder::addTriangle(int16_t x0, int16_t y0, int16_t x1, int16_t y1
     impl->vertices.emplace_back(Impl::VT({{{x1, y1}}}));
     impl->vertices.emplace_back(Impl::VT({{{x2, y2}}}));
     impl->triangleIndexes.emplace_back(n, n + 1, n + 2);
-    if (colorMode == ColorMode::PerVertex) {
+    if (colorAttrMode == ColorAttrMode::PerVertex) {
         impl->colors.insert(impl->colors.end(), 3, impl->currentColor);
     }
 }
@@ -109,7 +116,7 @@ void DrawableBuilder::appendTriangle(int16_t x0, int16_t y0) {
     const auto n = (uint16_t)impl->vertices.elements();
     impl->vertices.emplace_back(Impl::VT({{{x0, y0}}}));
     impl->triangleIndexes.emplace_back(n - 2, n - 1, n);
-    if (colorMode == ColorMode::PerVertex) {
+    if (colorAttrMode == ColorAttrMode::PerVertex) {
         impl->colors.emplace_back(impl->currentColor);
     }
 }
@@ -134,7 +141,7 @@ std::size_t DrawableBuilder::addVertices(const std::vector<std::array<int16_t, 2
     std::for_each(std::next(vertices.begin(), vertexOffset),
                   std::next(vertices.begin(), vertexOffset + vertexLength),
                   [&](const std::array<int16_t, 2>& x) { impl->vertices.emplace_back(Impl::VT({{x}})); });
-    if (colorMode == ColorMode::PerVertex) {
+    if (colorAttrMode == ColorAttrMode::PerVertex) {
         for (size_t i = 0; i < vertexLength; ++i) {
             impl->colors.emplace_back(impl->currentColor);
         }

src/mbgl/gfx/drawable_builder_impl.hpp

@@ -1,4 +1,5 @@
 #include <mbgl/gfx/attribute.hpp>
+#include <mbgl/gfx/cull_face_mode.hpp>
 #include <mbgl/gfx/index_vector.hpp>
 #include <mbgl/gfx/vertex_vector.hpp>
 #include <mbgl/programs/segment.hpp>
@@ -16,6 +17,7 @@ struct DrawableBuilder::Impl {
     gfx::IndexVector<gfx::Lines> lineIndexes;
     Color currentColor = Color::white();
     std::vector<Color> colors;
+    gfx::CullFaceMode cullFaceMode = gfx::CullFaceMode::disabled();
 };
 
 } // namespace gfx

src/mbgl/gl/context.cpp

@@ -477,7 +477,7 @@ bool Context::setupDraw(const PaintParameters& parameters, const gfx::Drawable&
         setStencilMode(gfx::StencilMode::disabled());
     }
 
-    setColorMode(gfx::ColorMode::alphaBlended());
+    setColorMode(parameters.colorModeForRenderPass());
     setCullFaceMode(gfx::CullFaceMode::disabled());
 
     auto& drawableGL = static_cast<const DrawableGL&>(drawable);

src/mbgl/gl/drawable_gl_builder.cpp

@@ -21,7 +21,7 @@ void DrawableGLBuilder::init() {
             posAttr->set(index++, gfx::VertexAttribute::int2{vert.a1[0], vert.a1[1]});
         }
     }
-    if (colorMode != ColorMode::None && !colorAttrName.empty()) {
+    if (colorAttrMode != ColorAttrMode::None && !colorAttrName.empty()) {
         if (const auto& colorAttr = attrs.getOrAdd(colorAttrName)) {
             // We should have either a single color or one per vertex.  Otherwise,
             // the color mode was probably changed after vertexes were added.

src/mbgl/gl/renderer_backend.cpp

@@ -95,7 +95,9 @@ void registerTypes(gfx::ShaderRegistry& registry, gl::Context& glContext, const
 void RendererBackend::initShaders(gfx::ShaderRegistry& shaders, const ProgramParameters& programParameters) {
     registerTypes<shaders::BuiltIn::BackgroundShader,
                   shaders::BuiltIn::FillShader,
-                  shaders::BuiltIn::FillOutlineShader>(shaders, static_cast<gl::Context&>(*context), programParameters);
+                  shaders::BuiltIn::FillOutlineShader,
+                  shaders::BuiltIn::FillOutlinePatternShader,
+                  shaders::BuiltIn::FillPatternShader>(shaders, static_cast<gl::Context&>(*context), programParameters);
 }
 
 } // namespace gl

src/mbgl/renderer/layers/render_background_layer.cpp

@@ -315,8 +315,7 @@ void RenderBackgroundLayer::update(const int32_t layerIndex,
                 builder = context.createDrawableBuilder("background");
                 builder->setRenderPass(drawPasses);
                 builder->setShader(shader);
-                builder->addTweaker(context.createDrawableTweaker());
+                builder->setColorAttrMode(gfx::DrawableBuilder::ColorAttrMode::PerDrawable);
-                builder->setColorMode(gfx::DrawableBuilder::ColorMode::PerDrawable);
                 builder->setDepthType(gfx::DepthMaskType::ReadWrite);
                 builder->setLayerIndex(layerIndex);
             }
@@ -336,8 +335,6 @@ void RenderBackgroundLayer::update(const int32_t layerIndex,
                 drawable->mutableUniformBuffers().addOrReplace("BackgroundLayerUBO", uniformBuffer);
                 tileLayerGroup->addDrawable(renderPass, tileID, std::move(drawable));
                 ++stats.tileDrawablesAdded;
-                // Log::Warning(Event::General, "Adding drawable for " + util::toString(tileID) + " total " +
-                // std::to_string(stats.tileDrawablesAdded+1));
             }
         }
     }

src/mbgl/renderer/layers/render_fill_layer.cpp

@@ -278,6 +278,10 @@ void RenderFillLayer::layerRemoved(UniqueChangeRequestVec& changes) {
     }
 }
 
+void RenderFillLayer::removeTile(RenderPass renderPass, const OverscaledTileID& tileID) {
+    stats.tileDrawablesRemoved += tileLayerGroup->removeDrawables(renderPass, tileID).size();
+}
+
 void RenderFillLayer::update(const int32_t layerIndex,
                              gfx::ShaderRegistry& shaders,
                              gfx::Context& context,
@@ -285,14 +289,7 @@ void RenderFillLayer::update(const int32_t layerIndex,
                              UniqueChangeRequestVec& changes) {
     std::unique_lock<std::mutex> guard(mutex);
 
-    if (!fillShader) {
+    if (!renderTiles || renderTiles->empty()) {
-        fillShader = context.getGenericShader(shaders, "FillShader");
-    }
-    if (!outlineShader) {
-        outlineShader = context.getGenericShader(shaders, "FillOutlineShader");
-    }
-
-    if (!fillShader || !outlineShader || !renderTiles || renderTiles->empty()) {
         if (tileLayerGroup) {
             stats.tileDrawablesRemoved += tileLayerGroup->getDrawableCount();
             tileLayerGroup->clearDrawables();
@@ -309,6 +306,19 @@ void RenderFillLayer::update(const int32_t layerIndex,
         changes.emplace_back(std::make_unique<AddLayerGroupRequest>(tileLayerGroup, /*canReplace=*/true));
     }
 
+    if (!fillShader) {
+        fillShader = context.getGenericShader(shaders, "FillShader");
+    }
+    if (!outlineShader) {
+        outlineShader = context.getGenericShader(shaders, "FillOutlineShader");
+    }
+    if (!patternShader) {
+        patternShader = context.getGenericShader(shaders, "FillPatternShader");
+    }
+    if (!outlinePatternShader) {
+        outlinePatternShader = context.getGenericShader(shaders, "FillOutlinePatternShader");
+    }
+
     std::unordered_set<OverscaledTileID> newTileIDs(renderTiles->size());
     std::transform(renderTiles->begin(),
                    renderTiles->end(),
@@ -317,6 +327,8 @@ void RenderFillLayer::update(const int32_t layerIndex,
 
     std::unique_ptr<gfx::DrawableBuilder> fillBuilder;
     std::unique_ptr<gfx::DrawableBuilder> outlineBuilder;
+    std::unique_ptr<gfx::DrawableBuilder> patternBuilder;
+    std::unique_ptr<gfx::DrawableBuilder> outlinePatternBuilder;
     std::vector<gfx::DrawablePtr> newTiles;
     gfx::VertexAttributeArray fillVertexAttrs;
     gfx::VertexAttributeArray outlineVertexAttrs;
@@ -336,29 +348,38 @@ void RenderFillLayer::update(const int32_t layerIndex,
             }
         });
 
-        if (unevaluated.get<FillPattern>().isUndefined()) {
+        // parameters.renderTileClippingMasks(renderTiles);
-            // parameters.renderTileClippingMasks(renderTiles);
-            for (const RenderTile& tile : *renderTiles) {
-                const auto& tileID = tile.getOverscaledTileID();
 
-                auto& tileDrawable = tileLayerGroup->getDrawable(renderPass, tileID);
+        for (const RenderTile& tile : *renderTiles) {
+            const auto& tileID = tile.getOverscaledTileID();
 
-                const auto removeTile = [&]() {
+            auto& tileDrawable = tileLayerGroup->getDrawable(renderPass, tileID);
-                    if (tileDrawable) {
-                        // Remove and discard all drawables for the tile
-                        tileLayerGroup->removeDrawables(renderPass, tileID);
-                        ++stats.tileDrawablesRemoved;
-                    }
-                };
 
-                const LayerRenderData* renderData = getRenderDataForPass(tile, renderPass);
+            const LayerRenderData* renderData = getRenderDataForPass(tile, renderPass);
-                if (!renderData) {
+            if (!renderData) {
-                    removeTile();
+                removeTile(renderPass, tileID);
-                    continue;
+                continue;
+            }
+
+            auto& bucket = static_cast<FillBucket&>(*renderData->bucket);
+            const auto& evaluated = getEvaluated<FillLayerProperties>(renderData->layerProperties);
+
+            std::vector<std::array<int16_t, 2>> rawVerts;
+            const auto buildVertices = [&](){
+                const std::vector<gfx::VertexVector<gfx::detail::VertexType<gfx::AttributeType<int16_t, 2>>>::Vertex>&
+                    verts = bucket.vertices.vector();
+                if (rawVerts.size() < verts.size()) {
+                    rawVerts.resize(verts.size());
+                    std::transform(verts.begin(), verts.end(), rawVerts.begin(), [](const auto& x) { return x.a1; });
                 }
+            };
+            
+            fillVertexAttrs.clear();
+            outlineVertexAttrs.clear();
 
-                auto& bucket = static_cast<FillBucket&>(*renderData->bucket);
+            const auto& paintPropertyBinders = bucket.paintPropertyBinders.at(getID());
-                const auto& evaluated = getEvaluated<FillLayerProperties>(renderData->layerProperties);
+
+            if (unevaluated.get<FillPattern>().isUndefined()) {
                 const auto evalColor = evaluated.get<FillColor>().constantOr(Color());
                 const auto fillOpacity = evaluated.get<FillOpacity>().constantOr(0);
                 const auto fillColor = evalColor * (fillOpacity > 0.0f ? fillOpacity : 1.0f);
@@ -370,15 +391,10 @@ void RenderFillLayer::update(const int32_t layerIndex,
                 const auto doOutline = evaluated.get<FillAntialias>() && renderPass == RenderPass::Translucent;
 
                 if (!doFill && !doOutline) {
-                    removeTile();
+                    removeTile(renderPass, tileID);
                     continue;
                 }
 
-                fillVertexAttrs.clear();
-                outlineVertexAttrs.clear();
-
-                const auto& paintPropertyBinders = bucket.paintPropertyBinders.at(getID());
-
                 if (doFill) {
                     if (auto& binder = paintPropertyBinders.get<FillColor>()) {
                         const auto count = binder->getVertexCount();
@@ -439,23 +455,23 @@ void RenderFillLayer::update(const int32_t layerIndex,
                     continue;
                 }
 
-                if (doFill && !fillBuilder) {
+                if (doFill && !fillBuilder && fillShader) {
                     fillBuilder = context.createDrawableBuilder("fill");
                     fillBuilder->setShader(fillShader);
-                    // fillBuilder->addTweaker(context.createDrawableTweaker());
+                    fillBuilder->setColorAttrMode(gfx::DrawableBuilder::ColorAttrMode::None);
-                    fillBuilder->setColorMode(gfx::DrawableBuilder::ColorMode::None);
                     fillBuilder->setDepthType((renderPass == RenderPass::Opaque) ? gfx::DepthMaskType::ReadWrite
                                                                                  : gfx::DepthMaskType::ReadOnly);
+                    fillBuilder->setCullFaceMode(gfx::CullFaceMode::disabled());
                     fillBuilder->setDepthType(gfx::DepthMaskType::ReadWrite);
                     fillBuilder->setLayerIndex(layerIndex);
                 }
-                if (doOutline && !outlineBuilder) {
+                if (doOutline && !outlineBuilder && outlineShader) {
                     outlineBuilder = context.createDrawableBuilder("fill-outline");
                     outlineBuilder->setShader(outlineShader);
-                    // outlineBuilder->addTweaker(context.createDrawableTweaker());
+                    outlineBuilder->setColorAttrMode(gfx::DrawableBuilder::ColorAttrMode::None);
-                    outlineBuilder->setColorMode(gfx::DrawableBuilder::ColorMode::None);
                     outlineBuilder->setLineWidth(2);
                     outlineBuilder->setDepthType(gfx::DepthMaskType::ReadOnly);
+                    outlineBuilder->setCullFaceMode(gfx::CullFaceMode::disabled());
                     outlineBuilder->setLayerIndex(layerIndex);
                     outlineBuilder->setSubLayerIndex(unevaluated.get<FillOutlineColor>().isUndefined() ? 2 : 0);
                 }
@@ -490,12 +506,8 @@ void RenderFillLayer::update(const int32_t layerIndex,
                     outlineBuilder->setVertexAttributes(outlineVertexAttrs);
                 }
 
-                const std::vector<gfx::VertexVector<gfx::detail::VertexType<gfx::AttributeType<int16_t, 2>>>::Vertex>&
-                    verts = bucket.vertices.vector();
-                std::vector<std::array<int16_t, 2>> rawVerts(verts.size());
-                std::transform(verts.begin(), verts.end(), rawVerts.begin(), [](const auto& x) { return x.a1; });
-
                 if (fillBuilder) {
+                    buildVertices();
                     fillBuilder->addVertices(rawVerts, 0, rawVerts.size());
 
                     for (const auto& seg : bucket.triangleSegments) {
@@ -507,11 +519,12 @@ void RenderFillLayer::update(const int32_t layerIndex,
                     for (auto& drawable : fillBuilder->clearDrawables()) {
                         drawable->setTileID(tileID);
 
-                        // tileLayerGroup->addDrawable(renderPass, tileID, std::move(drawable));
+                        tileLayerGroup->addDrawable(renderPass, tileID, std::move(drawable));
                         ++stats.tileDrawablesAdded;
                     }
                 }
                 if (outlineBuilder) {
+                    buildVertices();
                     outlineBuilder->addVertices(rawVerts, 0, rawVerts.size());
 
                     for (const auto& seg : bucket.lineSegments) {
@@ -527,94 +540,143 @@ void RenderFillLayer::update(const int32_t layerIndex,
                         ++stats.tileDrawablesAdded;
                     }
                 }
+            } else { // FillPattern is defined
+                if (renderPass != RenderPass::Translucent) {
+                    continue;
+                }
+
+                const auto& crossfade = getCrossfade<FillLayerProperties>(renderData->layerProperties);
+                const auto doOutline = evaluated.get<FillAntialias>() && unevaluated.get<FillOutlineColor>().isUndefined();
+                const auto& fillPatternValue =
+                    evaluated.get<FillPattern>().constantOr(Faded<expression::Image>{"", ""});
+                const auto patternPosA = tile.getPattern(fillPatternValue.from.id());
+                const auto patternPosB = tile.getPattern(fillPatternValue.to.id());
+
+                paintPropertyBinders.setPatternParameters(patternPosA, patternPosB, crossfade);
+
+                if (!patternBuilder && patternShader) {
+                    patternBuilder = context.createDrawableBuilder("fill-pattern");
+                    patternBuilder->setShader(fillShader);
+                    patternBuilder->setColorAttrMode(gfx::DrawableBuilder::ColorAttrMode::None);
+                    patternBuilder->setDepthType(gfx::DepthMaskType::ReadWrite);
+                    patternBuilder->setCullFaceMode(gfx::CullFaceMode::disabled());
+                    patternBuilder->setLayerIndex(layerIndex);
+                    outlinePatternBuilder->setSubLayerIndex(1);
+                }
+                if (doOutline && !outlinePatternBuilder && outlinePatternShader) {
+                    outlinePatternBuilder = context.createDrawableBuilder("fill-outline-pattern");
+                    outlinePatternBuilder->setShader(outlineShader);
+                    outlinePatternBuilder->setColorAttrMode(gfx::DrawableBuilder::ColorAttrMode::None);
+                    outlinePatternBuilder->setLineWidth(2);
+                    outlinePatternBuilder->setDepthType(gfx::DepthMaskType::ReadOnly);
+                    outlinePatternBuilder->setCullFaceMode(gfx::CullFaceMode::disabled());
+                    outlinePatternBuilder->setLayerIndex(layerIndex);
+                    outlinePatternBuilder->setSubLayerIndex(2);
+                }
+
+                //                             parameters.stencilModeForClipping(tile.id),
+                //                             parameters.colorModeForRenderPass(),
+                //                             gfx::CullFaceMode::disabled(),
+                //                             std::forward<decltype(textureBindings)>(textureBindings),
+
+                if (patternBuilder) {
+                    patternBuilder->setRenderPass(renderPass);
+                    //patternBuilder->setVertexAttributes(fillVertexAttrs);
+                }
+                if (outlinePatternBuilder) {
+                    outlinePatternBuilder->setRenderPass(renderPass);
+                    //outlinePatternBuilder->setVertexAttributes(outlineVertexAttrs);
+                }
+
+                if (patternBuilder) {
+                    buildVertices();
+                    patternBuilder->addVertices(rawVerts, 0, rawVerts.size());
+
+                    for (const auto& seg : bucket.triangleSegments) {
+                        patternBuilder->addTriangles(bucket.triangles.vector(), seg.indexOffset, seg.indexLength);
+                    }
+
+                    patternBuilder->flush();
+
+                    for (auto& drawable : patternBuilder->clearDrawables()) {
+                        drawable->setTileID(tileID);
+
+                        //tileLayerGroup->addDrawable(renderPass, tileID, std::move(drawable));
+                        ++stats.tileDrawablesAdded;
+                    }
+                }
+                if (outlinePatternBuilder) {
+                    buildVertices();
+                    outlinePatternBuilder->addVertices(rawVerts, 0, rawVerts.size());
+
+                    for (const auto& seg : bucket.lineSegments) {
+                        outlinePatternBuilder->addLines(bucket.lines.vector(), seg.indexOffset, seg.indexLength);
+                    }
+
+                    outlinePatternBuilder->flush();
+
+                    for (auto& drawable : outlinePatternBuilder->clearDrawables()) {
+                        drawable->setTileID(tileID);
+
+                        //tileLayerGroup->addDrawable(renderPass, tileID, std::move(drawable));
+                        ++stats.tileDrawablesAdded;
+                    }
+                }
+
+                //    auto draw = [&](auto& programInstance,
+                //                    const auto& drawMode,
+                //                    const auto& depthMode,
+                //                    const auto& indexBuffer,
+                //                    const auto& segments,
+                //                    auto&& textureBindings) {
+                //        const auto& paintPropertyBinders = bucket.paintPropertyBinders.at(getID());
+                //        paintPropertyBinders.setPatternParameters(patternPosA, patternPosB, crossfade);
+                //
+                //        const auto allUniformValues = programInstance.computeAllUniformValues(
+                //            FillPatternProgram::layoutUniformValues(
+                //                tile.translatedMatrix(
+                //                    evaluated.get<FillTranslate>(), evaluated.get<FillTranslateAnchor>(),
+                //                    parameters.state),
+                //                parameters.backend.getDefaultRenderable().getSize(),
+                //                tile.getIconAtlasTexture().size,
+                //                crossfade,
+                //                tile.id,
+                //                parameters.state,
+                //                parameters.pixelRatio),
+                //            paintPropertyBinders,
+                //            evaluated,
+                //            static_cast<float>(parameters.state.getZoom()));
+                //        const auto allAttributeBindings = programInstance.computeAllAttributeBindings(
+                //            *bucket.vertexBuffer, paintPropertyBinders, evaluated);
+                //
+                //        checkRenderability(parameters, programInstance.activeBindingCount(allAttributeBindings));
+                //
+                //    };
+                //
+                //    if (bucket.triangleIndexBuffer) {
+                //        draw(*fillPatternProgram,
+                //             gfx::Triangles(),
+                //             parameters.depthModeForSublayer(1, gfx::DepthMaskType::ReadWrite),
+                //             *bucket.triangleIndexBuffer,
+                //             bucket.triangleSegments,
+                //             FillPatternProgram::TextureBindings{
+                //                 textures::image::Value{tile.getIconAtlasTexture().getResource(),
+                //                                        gfx::TextureFilterType::Linear},
+                //             });
+                //    }
+                //    if (evaluated.get<FillAntialias>() && unevaluated.get<FillOutlineColor>().isUndefined()) {
+                //        draw(*fillOutlinePatternProgram,
+                //             gfx::Lines{2.0f},
+                //             parameters.depthModeForSublayer(2, gfx::DepthMaskType::ReadOnly),
+                //             *bucket.lineIndexBuffer,
+                //             bucket.lineSegments,
+                //             FillOutlinePatternProgram::TextureBindings{
+                //                 textures::image::Value{tile.getIconAtlasTexture().getResource(),
+                //                                        gfx::TextureFilterType::Linear},
+                //             });
+                //    }
+                //}
             }
-        } else { // FillPattern is defined
-            //        if (parameters.pass != RenderPass::Translucent) {
-            //            return;
-            //        }
-            //
-            //        parameters.renderTileClippingMasks(renderTiles);
-            //
-            //        for (const RenderTile& tile : *renderTiles) {
-            //            const LayerRenderData* renderData = getRenderDataForPass(tile, parameters.pass);
-            //            if (!renderData) {
-            //                continue;
-            //            }
-            //            auto& bucket = static_cast<FillBucket&>(*renderData->bucket);
-            //            const auto& evaluated = getEvaluated<FillLayerProperties>(renderData->layerProperties);
-            //            const auto& crossfade = getCrossfade<FillLayerProperties>(renderData->layerProperties);
-            //
-            //            const auto& fillPatternValue =
-            //            evaluated.get<FillPattern>().constantOr(Faded<expression::Image>{"", ""});
-            //            std::optional<ImagePosition> patternPosA = tile.getPattern(fillPatternValue.from.id());
-            //            std::optional<ImagePosition> patternPosB = tile.getPattern(fillPatternValue.to.id());
-            //
-            //            auto draw = [&](auto& programInstance,
-            //                            const auto& drawMode,
-            //                            const auto& depthMode,
-            //                            const auto& indexBuffer,
-            //                            const auto& segments,
-            //                            auto&& textureBindings) {
-            //                const auto& paintPropertyBinders = bucket.paintPropertyBinders.at(getID());
-            //                paintPropertyBinders.setPatternParameters(patternPosA, patternPosB, crossfade);
-            //
-            //                const auto allUniformValues = programInstance.computeAllUniformValues(
-            //                    FillPatternProgram::layoutUniformValues(
-            //                        tile.translatedMatrix(
-            //                            evaluated.get<FillTranslate>(), evaluated.get<FillTranslateAnchor>(),
-            //                            parameters.state),
-            //                        parameters.backend.getDefaultRenderable().getSize(),
-            //                        tile.getIconAtlasTexture().size,
-            //                        crossfade,
-            //                        tile.id,
-            //                        parameters.state,
-            //                        parameters.pixelRatio),
-            //                    paintPropertyBinders,
-            //                    evaluated,
-            //                    static_cast<float>(parameters.state.getZoom()));
-            //                const auto allAttributeBindings = programInstance.computeAllAttributeBindings(
-            //                    *bucket.vertexBuffer, paintPropertyBinders, evaluated);
-            //
-            //                checkRenderability(parameters, programInstance.activeBindingCount(allAttributeBindings));
-            //
-            //                programInstance.draw(parameters.context,
-            //                                     *parameters.renderPass,
-            //                                     drawMode,
-            //                                     depthMode,
-            //                                     parameters.stencilModeForClipping(tile.id),
-            //                                     parameters.colorModeForRenderPass(),
-            //                                     gfx::CullFaceMode::disabled(),
-            //                                     indexBuffer,
-            //                                     segments,
-            //                                     allUniformValues,
-            //                                     allAttributeBindings,
-            //                                     std::forward<decltype(textureBindings)>(textureBindings),
-            //                                     getID());
-            //            };
-            //
-            //            if (bucket.triangleIndexBuffer) {
-            //                draw(*fillPatternProgram,
-            //                     gfx::Triangles(),
-            //                     parameters.depthModeForSublayer(1, gfx::DepthMaskType::ReadWrite),
-            //                     *bucket.triangleIndexBuffer,
-            //                     bucket.triangleSegments,
-            //                     FillPatternProgram::TextureBindings{
-            //                         textures::image::Value{tile.getIconAtlasTexture().getResource(),
-            //                                                gfx::TextureFilterType::Linear},
-            //                     });
-            //            }
-            //            if (evaluated.get<FillAntialias>() && unevaluated.get<FillOutlineColor>().isUndefined()) {
-            //                draw(*fillOutlinePatternProgram,
-            //                     gfx::Lines{2.0f},
-            //                     parameters.depthModeForSublayer(2, gfx::DepthMaskType::ReadOnly),
-            //                     *bucket.lineIndexBuffer,
-            //                     bucket.lineSegments,
-            //                     FillOutlinePatternProgram::TextureBindings{
-            //                         textures::image::Value{tile.getIconAtlasTexture().getResource(),
-            //                                                gfx::TextureFilterType::Linear},
-            //                     });
-            //            }
-            //        }
         }
     }
 }

src/mbgl/renderer/layers/render_fill_layer.hpp

@@ -46,6 +46,9 @@ private:
                                 const mat4&,
                                 const FeatureState&) const override;
 
+    /// Remove all drawables for the tile from the layer group
+    void removeTile(RenderPass, const OverscaledTileID&);
+
     // Paint properties
     style::FillPaintProperties::Unevaluated unevaluated;
 
@@ -57,6 +60,8 @@ private:
 
     gfx::ShaderProgramBasePtr fillShader;
     gfx::ShaderProgramBasePtr outlineShader;
+    gfx::ShaderProgramBasePtr patternShader;
+    gfx::ShaderProgramBasePtr outlinePatternShader;
 };
 
 } // namespace mbgl