Mapbox-gl-js: Request for example(s) of interpolation

[yoursweater]

I think it would be handy to add a few real-life examples of interpolation (and other expressions, located here) so that newer users can have an easier time understanding how some of the more complex expressions work.

For example, I've been attempting to implement the following code and I'm not sure why it's failing:

map.setPaintProperty('fullcitylayer', 'fill-color', ['interpolate', interpolation: ['linear'], input:['/', ['get', 'B19001_017'], ['/',['get', 'ALAND'],1000000]], stop_input1: 10, stop_output1: '#00adef', stop_input2: 100, stop_output2: '#212529', stop_input3: 1000, stop_output3: '#ea950b', stop_input4: 5000, stop_output4: '#e94e34'] )

To my mind, it looks like the example provided but I'm getting a syntax error. I imagine lots of others who are new to mapbox have had/are having similar issues. Maybe even just color-coding the "model" text a bit more might help.

[Scarysize]

You still have to write valid JavaScript in order to make expressions works 😉

Your issue is with lines like ['interpolation', interpolation: ['linear'], ...]. You can't "label" the array items like this, their purpose is already determined by the position in the array/expression. Expressions always take the form of [<operator>, <arg1>, <arg2>, <argN>, ...]. So your expression should look something like this:

[
  'interpolate',
  ['linear'],
  ['/', ['get', 'B19001_017'], ['/', ['get', 'ALAND'], 1000000]],
  10,
  '#00adef',
  100,
  '#212529',
  1000,
  '#ea950b',
  5000,
  '#e94e34'
];

[yoursweater]

Thanks (also thanked you over on stackoverflow, but I wanted to say it thanks again)!

I think this illustrates that it might be a good idea to have a quick, working example in the docs though. The model expression is somewhat deceptive in the way it lays its syntax out compared to Scarysize's example, which is much closer to what I had expected.

[jfirebaugh]

The style-spec could do a better job:

• Distinguishing in the reference declaration for an operator (e.g. for interpolate) between elements that are _placeholders_ that you're supposed to substitute with subexpressions or literal values, and _type annotations_ that are there as documentation indicators but not present in the expression syntax itself.
• Distinguishing between this reference declaration as a whole, and concrete examples of the expression operator in use. Both currently use the same syntax highlighting and background color.