# Showing Blue Dot

Often it is necesarry to show the user's position to deliver valuable context on the map. We do not offer any positioning inside the MapsIndoors SDK, but do deliver a positioning interface that allows you to hook up positioning data on the map.

Create a class that implements the `MPPositionProviderInterface`.

```tsx
import { MPPoint, MPPositionProviderInterface, MPPositionResultInterface, OnPositionUpdateListener } from "@mapsindoors/react-native-maps-indoors-mapbox";
import { MyPositionResult } from "./MyPositionResult";

export class MyPositionProvider implements MPPositionProviderInterface {
    positionUpdateListeners: OnPositionUpdateListener[] = new Array()
    latestPosition?: MyPositionResult;

    addOnPositionUpdateListener(listener: OnPositionUpdateListener) {
        this.positionUpdateListeners.push(listener);
    }

    removeOnPositionUpdateListener(listener: OnPositionUpdateListener) {
        this.positionUpdateListeners.filter(item => item != listener);
    }

    getLatestPosition(): MPPositionResultInterface | undefined {
        return this.latestPosition;
    }

    get name(): string {
        return "MyPositionProvider";
    }
}
```

Note the variable `latestPosition` we store on the position provider is a `MyPositionResult`. Go ahead and implement that class, implementing the `MPPositionResultInterface`, and is used to assign data like the user's current floor index, the accuracy that might be known from the used position provider, user bearing etc.

```tsx
import { MPPoint, MPPositionResultInterface } from "@mapsindoors/react-native-maps-indoors-mapbox";

export class MyPositionResult implements MPPositionResultInterface {
    point: MPPoint;
    floorIndex: number;
    bearing: number;
    accuracy: number;
    positionProvider: string;

    constructor(point: MPPoint, positionProvider: string) {
        this.point = point;
        this.positionProvider = positionProvider;
        this.floorIndex = 0;
        this.bearing = 0;
        this.accuracy = 0;
    }
}
```

Inside the `MyPositionProvider` class we will now implement a `updatePosition` method that receives a `MPPoint` that can be shown on our map by hooking it up with MapsIndoors.

```tsx
updatePosition(point: MPPoint) {
    this.latestPosition = new MyPositionResult(point, this.name);
    this.positionUpdateListeners.forEach((listener) => {
        listener(this.latestPosition!);
    });
}
```

We can now hook our created position provider up with `MapsIndoors`

```tsx
//Creating the position provider
let positionProvider = new MyPositionProvider();
//Assigning the position provider to MapsIndoors
await MapsIndoors.setPositionProvider(positionProvider);
//Letting our current MapControl instance know that it should show user position
mapControl.showUserPosition(true);
//Calling update position on the position provider with a random coordinate within an area.
positionProvider.updatePosition(new MPPoint(57.0582701 + (Math.random() - 0.5) / 2500, 9.9508396 + (Math.random() - 0.5) / 2500));
```

The point that we send to the update position can be replaced and hooked into any positioning library callback, and by that you will have positioning shown inside your app on the map.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.mapsindoors.com/sdks-and-frameworks/react-native/showing-blue-dot.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.