CARTO VL

This is a DEPRECATED VERSION of CARTO VL. You can find more information about the support and the availability of the different CARTO VL versions.

CARTO VL is a JavaScript library to create custom Location Intelligence applications over vector rendering.

This library is still under support but it will not be further developed. We don’t recommend starting new projects with it as it will eventually become deprecated. Instead, learn more about our current CARTO for deck.gl library here

Glossary

Implicit cast

A implicit cast is a transformation done automatically (implicitly) by one CARTO VL expression to another one. Its purpose is to provide syntax sugar over another expression which is equivalent but more verbose and difficult.

For example, when using ramp($numericProperty, [red, blue]) the ramp expression will implicitly cast $numericProperty to linear($numericProperty), and the linear expression will implicitly cast that to linear($numericProperty, globalMin($numericProperty), globalMax($numericProperty)), which is a much larger and more verbose form, but it is semantically the same.

Variables

Variables are a way to store and reuse expressions. We use the @ notation followed by the name to declare and use the variable in the String API. The expression s.var('name') can also be used to refer to variables in the JavaScript API, that should be declared inside the variables scope. For example:

String API

1
2
3
4
const viz = new carto.Viz(`
  @size: 10
  width: @size
`);

Javascript API

1
2
3
4
5
6
7
const s = carto.expressions;
const viz = new carto.Viz({
  variables: {
    size: 10
  },
  width: s.var('size')
});

Variables can be accessed directly from the carto.Viz object. If variables do not contain dynamic (animation) or data-driven (properties) information can be also evaluated there:

1
viz.variables.size.eval();  // 10

If the variables contain Properties (Data-driven variables), they can be evaluated from the feature object in the interactivity event callbacks (see carto.Interactivity).