DATTA BI — Map visuals (OpenStreetMap and Google Maps)
Data with latitude and longitude deserves more than a table. DATTA BI ships two ready-made map visuals in the gallery — Mapa OSM and Google Maps — so you can plot service records, incidents or facilities on the territory with a single drag, and still filter the rest of the dashboard by clicking a marker.
The "Google Cloud APIs required by the key" section applies to the whole platform, not just DATTA BI: the same
GOOGLE_MAPS_API_KEYalso serves the Chat map and the Investigar page.
Which of the two to use
| Scenario | Visual | Why |
|---|---|---|
| Installation without internet or without a Google key | Mapa OSM | Requires no API key at all |
| You want to start fast, without depending on the administrator | Mapa OSM | Drag it in and you are done |
| You need Google's cartographic base and level of detail | Google Maps | Depends on a key configured at installation |
Mapa OSM (type: 'map')
- No API key. Tiles come from
tile.openstreetmap.orgvia maplibre-gl. - A good choice for a local installation (Project Guidelines §6): it works in an environment fully isolated from the internet, as long as you mirror the tiles internally.
Google Maps (type: 'map-google')
- Requires the
GOOGLE_MAPS_API_KEYconfigured by the administrator at installation, through one of two paths:- the
googleMaps.apiKeyvalue in the installation configuration (overridable on the command line or by a secret), or - the dedicated
datta-google-maps-secretsecret, under theGOOGLE_MAPS_API_KEYkey.
- the
- The interface fetches the key at runtime through a platform configuration endpoint — see the API reference.
- With no key configured, nothing breaks: the card falls back to a placeholder.
Google Cloud APIs required by the key
The GOOGLE_MAPS_API_KEY is a single key shared across the whole platform — the same configuration endpoint serves DATTA BI, the Investigar page and the Chat map. Each consumer requires different APIs enabled in the key's Google Cloud project:
| Consumer | Feature used | API that must be enabled |
|---|---|---|
DATTA BI (map-google visual) | map tiles | Maps JavaScript API |
| Chat — Localização modal | Geocoder, Street View | Maps JavaScript API, Geocoding API |
| Investigar — postal code map | Geocoder | Maps JavaScript API, Geocoding API |
| Investigar — nearby services search | Place.searchNearby / Place.searchByText | Places API (New) |
| Investigar — distances and routes | distance matrix, route calculation | Distance Matrix API, Directions API |
The "Places API (New)" is mandatory for the nearby services search. Until 2026-07 the Investigar page used the legacy Places API's proximity search — which Google stopped granting to new keys on 2025-03-01 and which can no longer be enabled in new Google Cloud projects. Keys created after that date received REQUEST_DENIED on every search. The page was migrated to Place.searchNearby (categories by type: school, hospital, pharmacy, police station) and Place.searchByText (categories by term: CRAS, CREAS, UPA, CAPS, public defender's office) — the new Nearby Search does not accept free text, which is why both calls coexist.
Symptom of a missing API: the nearby services list comes back empty. Since the migration, the screen shows a message pointing at the "Places API (New)" instead of staying silent; the exact reason for each category goes to the browser console.
Protect the key
The key is exposed to the browser — it is a frontend key. In the Google Cloud console, restrict it by HTTP referrer to your DATTA installation's addresses and limit the list of enabled APIs to the ones in the table above. Never leave the key unrestricted.
What the visual expects to receive
{
"lat": { "column": "latitude" },
"lng": { "column": "longitude" },
"label": { "column": "cidade" },
"value": { "column": "atendimentos" }
}lat/lng: numeric, required.label: optional, shown in the marker's popup.value: optional, controls the marker size.
Translating those bindings produces the DATTAX that feeds the map:
EVALUATE FROM GRAPH "..." MATCH "..."
|> SELECT lat, lng, cidade AS label, atendimentos AS value
|> LIMIT 1000
|> TABLE;Step by step — service records per city on a map
- Prepare a dataset with the
latitude,longitude,cidadeandatendimentoscolumns. - In the dashboard's edit mode, drag the Mapa OSM visual onto the canvas.
- Bind the columns to the channels: latitude, longitude, label (
cidade) and value (atendimentos) — the markers show up sized by volume. - Click a city's marker: the dashboard's other visuals filter to that city right away.
Cross-filter on the map
Clicking a marker emits the cross-filter by the point's label — or by the lat/lng coordinates when there is no label. The dashboard's other visuals re-render already filtered, exactly like the cross-filter of any other visual.
Performance
- The visual plots up to 1,000 markers by default. Beyond that, group them: by clustering on the client (the maplibre cluster spec) or by an
H3geographic grid on the backend. - For massive datasets, materialize an aggregated view by geographic grid with Trino and point the map at it, instead of rendering point by point.
Technical details
Both visuals are rendered by the same component, varying only the provider:
window.DattabiMapD3.create(container, { provider: 'osm', /* ... */ });
window.DattabiMapD3.create(container, { provider: 'google', /* ... */ });