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
  • What a query is: one JavaScript expression whose value is the list of layers.
  • How a layer points at a published map: its name.
  • Where you write and run a query: in these pages, in the playground and in the Mappia editor.

Mappia shows maps that are described in text. That text is a query: a short piece of JavaScript that says which layers the map has and how each one looks. The platform reads the query and builds the map - the layer list, the legends, the controls.

Here is the smallest query that shows something: one layer, the states of Brazil.

Click the picture to run it live - nothing is saved.
Edit it in the playground
The query 9 lines · runs as is
// Your first map: the whole query is one array with one layer definition - a published map, by its name.
// A Mappia query is a single JavaScript expression; its value is the list of layers to show.
[
  {
    name: "CSR:estados", // which published map: workspace CSR, map "estados" (the states of Brazil)
    title: "States of Brazil", // what the layer list shows
    visibility: true, // drawn as soon as the map opens
  },
];

What each line does

  • [ ... ] - the query is a list (an array) of layers. This one has a single layer.
  • name: "CSR:estados" - the published map to show, written WORKSPACE:map: the map estados of the workspace CSR of the Mappia map server. This is the one property every layer needs.
  • title - the name of the layer in the menus. Without it, they show the map’s own title from the server.
  • visibility: true - the layer is drawn as soon as the map opens.

One expression, not a program

The platform does not run a query line by line: it evaluates it as one expression and keeps its value, which must be that list of layers. That is why the query above has no var and no statements - a line like var x = 1; before the list breaks the whole query, and the map opens without your layers. Step 7 shows how to add setup code and shared values the right way.

Where to run a query

  • Here: click the picture of an example. A live map opens in the page and runs the query.
  • In the playground (“Edit it in the playground”): change the text and apply it again, as many times as you like.
  • In the Mappia editor: paste a query, press Apply to see it, and Save to keep it on the server with a number of its own (step 9).

Read more