Enable property functions for text-field, text-transform

js/data/bucket/symbol_bucket.js

@@ -119,11 +119,10 @@ class SymbolBucket {
 
     populate(features, options) {
         const layout = this.layers[0].layout;
-        const textField = layout['text-field'];
         const textFont = layout['text-font'];
         const iconImage = layout['icon-image'];
 
-        const hasText = textField && textFont;
+        const hasText = layout['text-field'] && textFont;
         const hasIcon = iconImage;
 
         this.features = [];
@@ -144,10 +143,9 @@ class SymbolBucket {
 
             let text;
             if (hasText) {
+                text = resolveText(this.layers[0], {zoom: this.zoom}, feature.properties);
                 if (rtlTextPlugin.applyArabicShaping) {
-                    text = rtlTextPlugin.applyArabicShaping(resolveText(feature, layout));
-                } else {
-                    text = resolveText(feature, layout);
+                    text = rtlTextPlugin.applyArabicShaping(text);
                 }
             }
 

js/style-spec/reference/v8.json

@@ -1082,9 +1082,10 @@
       "type": "string",
       "function": "piecewise-constant",
       "zoom-function": true,
+      "property-function": true,
       "default": "",
       "tokens": true,
-      "doc": "Value to use for a text label. Feature properties are specified using tokens like {field_name}.",
+      "doc": "Value to use for a text label. Feature properties are specified using tokens like {field_name}.  (Token replacement is only supported for literal text-field values--not for data-driven property functions.)",
       "sdk-support": {
         "basic functionality": {
           "js": "0.10.0",
@@ -1369,6 +1370,7 @@
       "type": "enum",
       "function": "piecewise-constant",
       "zoom-function": true,
+      "property-function": true,
       "values": {
         "none": {
             "doc": "The text is not altered."

js/symbol/resolve_text.js

@@ -2,14 +2,17 @@
 
 const resolveTokens = require('../util/token');
 
-module.exports = function resolveText(feature, layout) {
-    let text = resolveTokens(feature.properties, layout['text-field']);
+module.exports = function resolveText(layer, globalProperties, featureProperties) {
+    let text = layer.getLayoutValue('text-field', globalProperties, featureProperties);
+    if (layer.isLayoutValueFeatureConstant('text-field')) {
+        text = resolveTokens(featureProperties, text);
+    }
     if (!text) {
         return;
     }
     text = text.toString();
 
-    const transform = layout['text-transform'];
+    const transform = layer.getLayoutValue('text-transform', globalProperties, featureProperties);
     if (transform === 'uppercase') {
         text = text.toLocaleUpperCase();
     } else if (transform === 'lowercase') {

test/integration/render-tests/text-field/literal/style.json

@@ -0,0 +1,56 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "height": 256
+    }
+  },
+  "center": [
+    13.418056,
+    52.499167
+  ],
+  "zoom": 14,
+  "sources": {
+    "point": {
+      "type": "geojson",
+      "data": {
+        "type": "FeatureCollection",
+        "features": [
+          {
+            "type": "Feature",
+            "properties": {},
+            "geometry": {
+              "type": "Point",
+              "coordinates": [
+                13.418056,
+                52.499167
+              ]
+            }
+          }
+        ]
+      }
+    }
+  },
+  "glyphs": "local://glyphs/{fontstack}/{range}.pbf",
+  "layers": [
+    {
+      "id": "background",
+      "type": "background",
+      "paint": {
+        "background-color": "white"
+      }
+    },
+    {
+      "id": "text",
+      "type": "symbol",
+      "source": "point",
+      "layout": {
+        "text-field": "Test",
+        "text-font": [
+          "Open Sans Semibold",
+          "Arial Unicode MS Bold"
+        ]
+      }
+    }
+  ]
+}

test/integration/render-tests/text-field/property-function/style.json

@@ -0,0 +1,77 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "height": 256,
+      "skipped": {
+        "native": "needs issue"
+      }
+    }
+  },
+  "center": [
+    13.418056,
+    52.499167
+  ],
+  "zoom": 14,
+  "sources": {
+    "point": {
+      "type": "geojson",
+      "data": {
+        "type": "FeatureCollection",
+        "features": [
+          {
+            "type": "Feature",
+            "properties": { "x": 1 },
+            "geometry": {
+              "type": "Point",
+              "coordinates": [
+                13.413056,
+                52.499167
+              ]
+            }
+          },
+          {
+            "type": "Feature",
+            "properties": { "x": 0 },
+            "geometry": {
+              "type": "Point",
+              "coordinates": [
+                13.423056,
+                52.499167
+              ]
+            }
+          }
+        ]
+      }
+    }
+  },
+  "glyphs": "local://glyphs/{fontstack}/{range}.pbf",
+  "layers": [
+    {
+      "id": "background",
+      "type": "background",
+      "paint": {
+        "background-color": "white"
+      }
+    },
+    {
+      "id": "text",
+      "type": "symbol",
+      "source": "point",
+      "layout": {
+        "text-field": {
+          "type": "categorical",
+          "property": "x",
+          "stops": [
+            [0, "Zero"],
+            [1, "One"]
+          ]
+        },
+        "text-font": [
+          "Open Sans Semibold",
+          "Arial Unicode MS Bold"
+        ]
+      }
+    }
+  ]
+}

test/integration/render-tests/text-field/token/style.json

@@ -0,0 +1,67 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "height": 256
+    }
+  },
+  "center": [
+    13.418056,
+    52.499167
+  ],
+  "zoom": 14,
+  "sources": {
+    "point": {
+      "type": "geojson",
+      "data": {
+        "type": "FeatureCollection",
+        "features": [
+          {
+            "type": "Feature",
+            "properties": { "x": 1 },
+            "geometry": {
+              "type": "Point",
+              "coordinates": [
+                13.413056,
+                52.499167
+              ]
+            }
+          },
+          {
+            "type": "Feature",
+            "properties": { "x": 0 },
+            "geometry": {
+              "type": "Point",
+              "coordinates": [
+                13.423056,
+                52.499167
+              ]
+            }
+          }
+        ]
+      }
+    }
+  },
+  "glyphs": "local://glyphs/{fontstack}/{range}.pbf",
+  "layers": [
+    {
+      "id": "background",
+      "type": "background",
+      "paint": {
+        "background-color": "white"
+      }
+    },
+    {
+      "id": "text",
+      "type": "symbol",
+      "source": "point",
+      "layout": {
+        "text-field": "Test {x}",
+        "text-font": [
+          "Open Sans Semibold",
+          "Arial Unicode MS Bold"
+        ]
+      }
+    }
+  ]
+}

test/integration/render-tests/text-transform/property-function/style.json

@@ -0,0 +1,78 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "height": 256,
+      "skipped": {
+        "native": "needs issue"
+      }
+    }
+  },
+  "center": [
+    13.418056,
+    52.499167
+  ],
+  "zoom": 14,
+  "sources": {
+    "point": {
+      "type": "geojson",
+      "data": {
+        "type": "FeatureCollection",
+        "features": [
+          {
+            "type": "Feature",
+            "properties": { "x": 0 },
+            "geometry": {
+              "type": "Point",
+              "coordinates": [
+                13.413056,
+                52.499167
+              ]
+            }
+          },
+          {
+            "type": "Feature",
+            "properties": { "x": 1 },
+            "geometry": {
+              "type": "Point",
+              "coordinates": [
+                13.423056,
+                52.499167
+              ]
+            }
+          }
+        ]
+      }
+    }
+  },
+  "glyphs": "local://glyphs/{fontstack}/{range}.pbf",
+  "layers": [
+    {
+      "id": "background",
+      "type": "background",
+      "paint": {
+        "background-color": "white"
+      }
+    },
+    {
+      "id": "text",
+      "type": "symbol",
+      "source": "point",
+      "layout": {
+        "text-field": "hello",
+        "text-transform": {
+          "type": "categorical",
+          "property": "x",
+          "stops": [
+            [0, "uppercase"],
+            [1, "lowercase"]
+          ]
+        },
+        "text-font": [
+          "Open Sans Semibold",
+          "Arial Unicode MS Bold"
+        ]
+      }
+    }
+  ]
+}