Data-defined styles in Mapbox vector tiles

Question

Is it possible to style Mapbox vector tiles (Mapbox GL JS) using a feature's attributes? Assuming each feature has an attribute color which is a hex color string, I tried

"paint": {
    "fill-color": function(d) { return d.color } 
}

but received an error saying that a string was expected, not a function. Looking through some examples it seems that features of similar styles needed to be grouped into their own layers, but that seems a bit unwieldy in the event of a single layer with hundreds of possible styles.

What is the best way to style polygons based on a feature's attributes?

Answer 1

We're currently working on implementing this feature (called data-driven styles) and it's an extremely challenging technical problem in GL which requires rearchitecting the whole library. We'll get it eventually, but meanwhile there are some hacks like http://anand.codes/2015/09/21/interative-data-driven-styles-with-mapbox-gl-js/

Answer 2

This is now possible, as of Mapbox-GL-JS v0.17.0

https://www.mapbox.com/blog/data-driven-styling/

The syntax looks like this:

'circle-color': {
    property: 'sqrt',
    stops: [
        [0, '#f1f075'],
        [250, '#e55e5e']
    ]
}