Attribution requirements

Baato builds on OpenStreetMap, and both Baato and the OpenStreetMap community need crediting when you use the data. This is a condition of use on every plan, including the free one.

What has to be visible

OpenStreetMap credit

© OpenStreetMap contributors, linked to openstreetmap.org/copyright.

Baato credit

The Baato logo, or a text link back to baato.io.

Both must be legible on top of the map — typically as a small overlay in a bottom corner. If your map is small enough that overlays do not fit, an attribution link immediately adjacent to it is acceptable.

The Baato logo is available at i.postimg.cc/k5DpLQKQ/baato-Logo.png.

Per-platform snippets

Most map SDKs render their own vendor branding, which you turn off — and then you own the attribution. These snippets show both halves.

Web
Android
Flutter
React Native

<div id="map" style="position: absolute; inset: 0;">
  <div style="z-index: 10; padding: 0 5px; background-color: hsla(0,0%,100%,.5);
              position: absolute; bottom: 0; right: 0;">
    ©
    <a href="https://www.openstreetmap.org/copyright" target="_blank" rel="noopener">
      OpenStreetMap contributors
    </a>
  </div>
  <div style="z-index: 100; padding: 0 5px; background-color: hsla(0,0%,100%,.5);
              position: absolute; bottom: 0; left: 0;">
    <a href="https://baato.io" target="_blank" rel="noopener">
      <img
        src="https://sgp1.digitaloceanspaces.com/baatocdn/images/BaatoLogo.svg"
        alt="Baato"
        width="80"
      />
    </a>
  </div>
</div>

Turn off the Mapbox branding, then add the Baato logo as a view over the map. Download the logo into res/drawable first.

mapView.getMapAsync(mapboxMap -> {
    mapboxMap.getUiSettings().setAttributionEnabled(false);
    mapboxMap.getUiSettings().setLogoEnabled(false);

    final FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(250, 104);
    params.gravity = Gravity.BOTTOM | Gravity.LEFT;
    params.setMargins(12, 12, 12, 12);

    ImageView imageview = new ImageView(this);
    imageview.setImageResource(R.drawable.baato_logo);
    imageview.setLayoutParams(params);
    mapView.addView(imageview);
});

Stack(
  children: [
    BaatoMap(
      logoViewMargins: Point(-50, -50), // hide the SDK's own logo
      initialPosition: BaatoCoordinate(latitude: 27.7172, longitude: 85.3240),
    ),
    Align(
      alignment: Alignment.bottomLeft,
      child: Container(
        color: Colors.white70,
        height: 35.0,
        child: Image.network("https://i.postimg.cc/k5DpLQKQ/baato-Logo.png"),
      ),
    ),
    Align(
      alignment: Alignment.bottomRight,
      child: Container(
        color: Colors.white70,
        padding: EdgeInsets.only(bottom: 2.0, right: 2.0),
        child: Text("© OpenStreetMap contributors"),
      ),
    ),
  ],
)

<View style={{ flex: 1 }}>
  <MapLibreGL.MapView
    style={{ flex: 1 }}
    styleURL={styleURL}
    logoEnabled={false}
    attributionEnabled={false}
  />
  <View style={styles.attribution}>
    <Text style={styles.attributionText}>© OpenStreetMap contributors · Baato</Text>
  </View>
</View>

const styles = StyleSheet.create({
  attribution: {
    position: "absolute",
    bottom: 4,
    right: 4,
    paddingHorizontal: 6,
    backgroundColor: "rgba(255,255,255,0.6)",
  },
  attributionText: { fontSize: 10 },
});

Crediting search results

Where you surface Baato search or geocoding results outside the map itself — in a results list, a picker, an address field — credit the source in text, linking to baato.io:

Search by baato.io

For anything beyond this — white-labelling, removing attribution, redistribution — talk to us at support@baato.io.

Get started

Guides by platform

Server SDKs

Resources

Attribution requirements

What has to be visible

OpenStreetMap credit

Baato credit

Per-platform snippets

Crediting search results

​What has to be visible

OpenStreetMap credit

Baato credit

​Per-platform snippets

​Crediting search results

What has to be visible

Per-platform snippets

Crediting search results