function returning a string not working for width

[meetar]

trafficstars

Functions such as width: function() { return '10px'; } don't seem to be… functioning.

TO REPRODUCE THE ISSUE, FOLLOW THESE STEPS:

• open https://mapzen.com/tangram/play/?lines=14%2C16&scene=https%3A%2F%2Fapi.github.com%2Fgists%2F7fbba4a3d40760496485844eff369357#1.2396/33.0/-135.9
• uncomment either of the highlighted lines

RESULT:

No lines are drawn.

[bcamper]

This is actually by design currently -- a function for width must return a raw number in mercator meters.

color values also used to work this way, requiring a an RGB or RGBA array to be returned, instead of a string color. We expanded support for string return values for color based on user feedback, but haven't done the same thing for width. It would be easy to add, though there's an overhead having to apply unit conversion checking to every feature, since functions are evaluated per-feature, whereas with "static" rules like width: 5px we can do the conversion once (per zoom).

@tallytalwar can you let us know what the treatment of this case is in ES, and more generally which style parameters in ES allow functions and/or unit conversion (it's essentially white-listed in JS)?

[tallytalwar]

Sorry for a late reply here... completely lost this issue somewhere.

Anyways, in ES, js functions will work for Width (or other width like parameters) when the function evaluates to a string (number with a unit). So the above case pointed in the issue description works in ES.

With respect to what parameters work with js functions:

1. Any js function which evaluates to a string ... passes that evaluated string along with the key of the parameter to styleParam evaluation. So it will behave as if param: "stringValue" set.
2. Following are explicitly defined for js function evaluation:

• Boolean return type: interactive, text:interactive, visible, extrude`
• Array return type: extrude, color, outline:color, fill, stroke:color
• numeric return type: extrude, placement_spacing, width, outline:width, stroke:width, placement_min_length_ratio, order, outline:order, priority, color, outline:color, fill, stroke:color