Skip to content

Commit 35088f2

Browse files
CommanderStormCommanderStorm
committed
chore: improve interpolation documentation and update SDK support details in v8.json
1 parent 9d60e18 commit 35088f2

File tree

2 files changed

+171
-4
lines changed

2 files changed

+171
-4
lines changed

‎build/generate-docs.ts‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -217,6 +217,26 @@ function expressionSyntaxToMarkdown(key: string, syntax: JsonExpressionSyntax) {
217217
}
218218
});
219219
}
220+
if (parameter.type === 'interpolation') {
221+
// the type is a non-basic type => we can attach further docs from v8
222+
const interpolation = v8.interpolation;
223+
markdown += ` \n ${interpolation.doc}`;
224+
const interpolation_name=v8.interpolation_name;
225+
markdown += ` \n Possible values are:`;
226+
for (const [key,val] of Object.entries(interpolation_name.values)) {
227+
markdown += ` \n - \`["${key}"`
228+
for (const param of val.syntax.overloads[0].parameters) {
229+
markdown += `, ${param}`
230+
}
231+
markdown += `]\`: ${val.doc}`;
232+
if (val.syntax.parameters) {
233+
markdown += ` \n Possible parameters are:`
234+
for (const param of val.syntax.parameters) {
235+
markdown += `\n - \`${param.name}\`: ${param.doc}`
236+
}
237+
}
238+
}
239+
}
220240
markdown += '\n';
221241
}
222242
return markdown;

‎src/reference/v8.json‎

Lines changed: 151 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3394,7 +3394,7 @@
33943394
}
33953395
},
33963396
"interpolate": {
3397-
"doc": "Produces continuous, smooth results by interpolating between pairs of input and output values (\"stops\"). The `input` may be any numeric expression (e.g., `[\"get\", \"population\"]`). Stop inputs must be numeric literals in strictly ascending order. The output type must be `number`, `array<number>`, `color`, `array<color>`, or `projection`.\n\nInterpolation types:\n\n- `[\"linear\"]`, or an expression returning one of those types: Interpolates linearly between the pair of stops just less than and just greater than the input.\n\n- `[\"exponential\", base]`: Interpolates exponentially between the stops just less than and just greater than the input. `base` controls the rate at which the output increases: higher values make the output increase more towards the high end of the range. With values close to 1 the output increases linearly.\n\n- `[\"cubic-bezier\", x1, y1, x2, y2]`: Interpolates using the cubic bezier curve defined by the given control points.\n\n - [Animate map camera around a point](https://maplibre.org/maplibre-gl-js/docs/examples/animate-camera-around-point/)\n\n - [Change building color based on zoom level](https://maplibre.org/maplibre-gl-js/docs/examples/change-building-color-based-on-zoom-level/)\n\n - [Create a heatmap layer](https://maplibre.org/maplibre-gl-js/docs/examples/heatmap-layer/)\n\n - [Visualize population density](https://maplibre.org/maplibre-gl-js/docs/examples/visualize-population-density/)",
3397+
"doc": "Produces continuous, smooth results by interpolating between pairs of input and output values (\"stops\"). The `input` may be any numeric expression (e.g., `[\"get\", \"population\"]`). Stop inputs must be numeric literals in strictly ascending order. The output type must be `number`, `array<number>`, `color`, `array<color>`, or `projection`.\n\n - [Animate map camera around a point](https://maplibre.org/maplibre-gl-js/docs/examples/animate-camera-around-point/)\n\n - [Change building color based on zoom level](https://maplibre.org/maplibre-gl-js/docs/examples/change-building-color-based-on-zoom-level/)\n\n - [Create a heatmap layer](https://maplibre.org/maplibre-gl-js/docs/examples/heatmap-layer/)\n\n - [Visualize population density](https://maplibre.org/maplibre-gl-js/docs/examples/visualize-population-density/)",
33983398
"syntax": {
33993399
"overloads": [
34003400
{
@@ -3405,7 +3405,7 @@
34053405
"parameters": [
34063406
{
34073407
"name": "interpolation_type",
3408-
"type": ["[\"linear\"]", "[\"exponential\", base]", "[\"cubic-bezier\", x1, y1, x2, y2]"],
3408+
"type": "interpolation",
34093409
"doc": "The interpolation type."
34103410
},
34113411
{
@@ -3447,7 +3447,8 @@
34473447
"parameters": [
34483448
{
34493449
"name": "interpolation_type",
3450-
"type": ["[\"linear\"]", "[\"exponential\", base]", "[\"cubic-bezier\", x1, y1, x2, y2]"]
3450+
"type": "interpolation",
3451+
"doc": "The interpolation type."
34513452
},
34523453
{
34533454
"name": "input",
@@ -3485,7 +3486,8 @@
34853486
"parameters": [
34863487
{
34873488
"name": "interpolation_type",
3488-
"type": ["[\"linear\"]", "[\"exponential\", base]", "[\"cubic-bezier\", x1, y1, x2, y2]"]
3489+
"type": "interpolation",
3490+
"doc": "The interpolation type."
34893491
},
34903492
{
34913493
"name": "input",
@@ -7992,5 +7994,150 @@
79927994
"type": "string",
79937995
"doc": "A name of a feature property to use as ID for feature state."
79947996
}
7997+
},
7998+
"interpolation": {
7999+
"type": "array",
8000+
"value": "interpolation_name",
8001+
"minimum": 1,
8002+
"doc": "An interpolation defines a function that can be used for transitioning between style properties or feature filters. The first element of an interpolation array is a string naming the interpolation operator, e.g. `\\\"linear\\\"` or `\\\"exponential\\\"`. Elements that follow (if any) are the _arguments_ to the interpolation."
8003+
},
8004+
"interpolation_name": {
8005+
"doc": "First element in an interpolation array. May be followed by a number of arguments.",
8006+
"type": "enum",
8007+
"values": {
8008+
"linear": {
8009+
"doc": "Interpolates linearly between the pair of stops just less than and just greater than the input",
8010+
"syntax": {
8011+
"overloads": [
8012+
{
8013+
"parameters": [],
8014+
"output-type": "interpolation"
8015+
}
8016+
],
8017+
"parameters": []
8018+
},
8019+
"example": ["linear"],
8020+
"sdk-support": {
8021+
"interpolate": {
8022+
"js": "0.42.0",
8023+
"android": "6.0.0",
8024+
"ios": "4.0.0"
8025+
},
8026+
"interpolate-hcl": {
8027+
"js": "0.49.0",
8028+
"ios": "https://github.com/maplibre/maplibre-native/issues/2784",
8029+
"android": "https://github.com/maplibre/maplibre-native/issues/2784"
8030+
},
8031+
"interpolate-lab":{
8032+
"js": "0.49.0",
8033+
"ios": "https://github.com/maplibre/maplibre-native/issues/2784",
8034+
"android": "https://github.com/maplibre/maplibre-native/issues/2784"
8035+
}
8036+
}
8037+
},
8038+
"exponential": {
8039+
"doc": "Interpolates exponentially between the stops just less than and just greater than the input.",
8040+
"syntax": {
8041+
"overloads": [
8042+
{
8043+
"parameters": [
8044+
"base"
8045+
],
8046+
"output-type": "interpolation"
8047+
}
8048+
],
8049+
"parameters": [
8050+
{
8051+
"name": "base",
8052+
"type": "number literal",
8053+
"doc": "controls the rate at which the output increases: higher values make the output increase more towards the high end of the range. With values close to 1 the output increases linearly"
8054+
}
8055+
]
8056+
},
8057+
"example": [
8058+
"exponential",
8059+
2
8060+
],
8061+
"sdk-support": {
8062+
"interpolate": {
8063+
"js": "0.42.0",
8064+
"android": "6.0.0",
8065+
"ios": "4.0.0"
8066+
},
8067+
"interpolate-hcl": {
8068+
"js": "0.49.0",
8069+
"ios": "https://github.com/maplibre/maplibre-native/issues/2784",
8070+
"android": "https://github.com/maplibre/maplibre-native/issues/2784"
8071+
},
8072+
"interpolate-lab":{
8073+
"js": "0.49.0",
8074+
"ios": "https://github.com/maplibre/maplibre-native/issues/2784",
8075+
"android": "https://github.com/maplibre/maplibre-native/issues/2784"
8076+
}
8077+
}
8078+
},
8079+
"cubic-bezier": {
8080+
"doc": "Interpolates using the cubic bezier curve defined by the given control points.",
8081+
"syntax": {
8082+
"overloads": [
8083+
{
8084+
"parameters": [
8085+
"x1",
8086+
"y1",
8087+
"x2",
8088+
"y2"
8089+
],
8090+
"output-type": "interpolation"
8091+
}
8092+
],
8093+
"parameters": [
8094+
{
8095+
"name": "x1",
8096+
"type": "number literal",
8097+
"doc": "X-coordinate of the first control point (P1). Must be between 0 and 1 for a valid monotonic easing curve. Controls how quickly the curve accelerates at the beginning."
8098+
},
8099+
{
8100+
"name": "y1",
8101+
"type": "number literal",
8102+
"doc": "Y-coordinate of the first control point (P1). Typically between 0 and 1, but may exceed this range for overshoot effects. Influences the starting slope of the curve."
8103+
},
8104+
{
8105+
"name": "x2",
8106+
"type": "number literal",
8107+
"doc": "X-coordinate of the second control point (P2). Must be between 0 and 1 for a valid monotonic easing curve. Controls when the curve begins to decelerate toward the end."
8108+
},
8109+
{
8110+
"name": "y2",
8111+
"type": "number literal",
8112+
"doc": "Y-coordinate of the second control point (P2). Typically between 0 and 1, but may exceed this range for overshoot effects. Influences the ending slope of the curve."
8113+
}
8114+
]
8115+
},
8116+
"example": [
8117+
"cubic-bezier",
8118+
2,
8119+
3,
8120+
2,
8121+
3
8122+
],
8123+
"sdk-support": {
8124+
"interpolate": {
8125+
"js": "0.42.0",
8126+
"android": "6.0.0",
8127+
"ios": "4.0.0"
8128+
},
8129+
"interpolate-hcl": {
8130+
"js": "0.49.0",
8131+
"ios": "https://github.com/maplibre/maplibre-native/issues/2784",
8132+
"android": "https://github.com/maplibre/maplibre-native/issues/2784"
8133+
},
8134+
"interpolate-lab":{
8135+
"js": "0.49.0",
8136+
"ios": "https://github.com/maplibre/maplibre-native/issues/2784",
8137+
"android": "https://github.com/maplibre/maplibre-native/issues/2784"
8138+
}
8139+
}
8140+
}
8141+
}
79958142
}
79968143
}

0 commit comments

Comments
 (0)