Do it on the live map → This chapter is part of the interactive tutorial: one live map, your own code, each step checked as you go.
In this step you learn
  • How several layers make one map.
  • The properties you use on almost every layer: title, visibility, opacity.
  • Where to find every other property of a layer.

A map is usually several maps on top of each other - the relief, the borders, a theme. In a query, each one is a layer: one entry of the list, between { }, separated by commas.

Click the picture to run it live - nothing is saved.
Edit it in the playground
The query 22 lines · runs as is
// Several layers: three maps in one query, each with its own title, opacity and starting state.
// Every entry of the array is one layer. visibility: false keeps a layer listed but off -
// the reader turns it on in the layer list. opacity goes from 0 (invisible) to 1.
[
  {
    name: "CSR:altimetria",
    title: "Elevation",
    visibility: true,
    opacity: 0.8,
  },
  {
    name: "CSR:estados",
    title: "States",
    visibility: true,
    opacity: 0.5,
  },
  {
    name: "CSR:biomassa_baccini_bioma_am",
    title: "Forest biomass (Amazon) - turn it on",
    visibility: false,
  },
];

The properties you will use most

PropertyWhat it doesIn the example
nameThe published map (step 3 says where names come from)"CSR:altimetria" - elevation
titleThe name of the layer in the menus"Elevation"
visibilitytrue: drawn when the map opens. false: off, until the reader switches it on in the top menuThe biomass layer starts off
opacityFrom 0 (invisible) to 1 (opaque)The states at 0.5 let the relief show through

The reader decides too. The top menu lists every layer with a switch - layers that are not in a group are under Maps (step 6 makes groups) - and the panel on the left lists the layers switched on there, each with an eye button that hides it without taking it off the panel.

And the rest

A layer accepts many more properties - a thumbnail for the layer list (thumbUrl), the scale range where it is drawn (minscale, maxscale), which of its styles to use (styles). You do not need them to start. Some belong to one kind of layer only: the calculated, file and tile layers of steps 4 and 5 also get a panel of their own, with text, controls and row buttons, which a published map like these does not have. Every property is listed, with its type and an example, in the property catalogue and the API reference.

Read more