> ## Documentation Index
> Fetch the complete documentation index at: https://docs.elementlabs.net/llms.txt
> Use this file to discover all available pages before exploring further.

# Markers from JavaScript and C#

> The events a JavaScript or C# resource sends so its markers appear on the map with their name, size and the rest.

The map shows the markers every resource creates, whatever language it is written in. What it reads
from the game by itself is the icon, colour, position, opacity and rotation. A marker's name, size,
category and the other details on this page cannot be read back from the game, so the resource that
creates the marker has to tell the map.

For Lua resources, the integration does that automatically (see
[Install an integration](https://docs.elementlabs.net/get-started/integrations.md)). The integration only reaches Lua. A
JavaScript or C# resource sends the same information itself, with the client events below. Nothing
needs installing for that.

## Before you start

* Element 3D Pause Menu is installed and starts. See
  [Install the menu](https://docs.elementlabs.net/products/3d-pause-menu/installation.md).
* Your resource creates its markers on the client, with the game's own functions
  (`AddBlipForCoord`, `World.CreateBlip` and the like).

## Steps

**1. Send the marker's details after creating it**

Trigger `el:pausemenu:blip:meta` on the client with the marker handle and a table of the details
to show. Send only the fields you use: each call is merged into what the map already holds.

```js JavaScript theme={null}
const blip = AddBlipForCoord(215.8, -810.1, 30.7);
SetBlipSprite(blip, 357);
SetBlipScale(blip, 0.8);

emit("el:pausemenu:blip:meta", blip, {
  name: "Legion Square Garage",
  scale: 0.8,
  category: 10,
});
```

```csharp C# (CitizenFX.Core) theme={null}
var blip = World.CreateBlip(new Vector3(215.8f, -810.1f, 30.7f));
blip.Sprite = (BlipSprite)357;
blip.Scale = 0.8f;
blip.Name = "Legion Square Garage";

TriggerEvent("el:pausemenu:blip:meta", blip.Handle, new
{
    name = "Legion Square Garage",
    scale = 0.8f,
    category = 10,
});
```

A radius marker (`AddBlipForRadius`) is not drawn at all until the map receives its `radius`.

Field names are case-sensitive and lower camel case, as in the table below, also from C#. In a
mono v2 resource, `TriggerEvent` is `Events.TriggerEvent`.

**2. Tell the map when you change it, while it is open**

Once you have sent anything for a marker, the map stops checking it on its own and waits to be
told. After changing its icon, colour, position, opacity, display, rotation, route, fade or flash
while a player has the map open, send:

```js theme={null}
emit("el:pausemenu:blip:touch", blip);
```

A change to a field in the table is sent with `el:pausemenu:blip:meta` again instead.

**3. Tell the map before you remove it**

```js theme={null}
emit("el:pausemenu:blip:gone", blip);
RemoveBlip(blip);
```

Otherwise the map keeps the details of a marker that no longer exists until it next opens.

**4. Send everything again when the map restarts**

The map forgets every detail when its own resource restarts, and raises `el:pausemenu:ready` when
it is back. Keep what you sent, and send it again then:

```js JavaScript theme={null}
const sent = new Map();

function report(blip, fields) {
  sent.set(blip, { ...sent.get(blip), ...fields });
  emit("el:pausemenu:blip:meta", blip, fields);
}

on("el:pausemenu:ready", () => {
  for (const [blip, fields] of sent) {
    if (DoesBlipExist(blip)) emit("el:pausemenu:blip:meta", blip, fields);
    else sent.delete(blip);
  }
});
```

```csharp C# (CitizenFX.Core) theme={null}
private readonly Dictionary<int, Dictionary<string, object>> sent =
    new Dictionary<int, Dictionary<string, object>>();

private void Report(int blip, Dictionary<string, object> fields)
{
    if (!sent.TryGetValue(blip, out var kept))
    {
        kept = new Dictionary<string, object>();
        sent[blip] = kept;
    }
    foreach (var field in fields) kept[field.Key] = field.Value;
    TriggerEvent("el:pausemenu:blip:meta", blip, fields);
}

[EventHandler("el:pausemenu:ready")]
private void OnMapReady()
{
    foreach (var entry in sent.ToList())
    {
        if (API.DoesBlipExist(entry.Key)) TriggerEvent("el:pausemenu:blip:meta", entry.Key, entry.Value);
        else sent.Remove(entry.Key);
    }
}
```

## Check that it worked

Open the map. The marker is drawn at its size, and the legend lists it under its name and in its
category. A marker the map sees but was told nothing about is listed under the generic marker label
and drawn at the default size.

## The fields

The same fields `SetBlipMeta` accepts, and what the Lua integration sends for the matching game
function:

| Field | Type | The game function it stands for |
| - | - | - |
| `name` | string | `BeginTextCommandSetBlipName` … `EndTextCommandSetBlipName`, `SetBlipNameFromTextFile`, `SetBlipNameToPlayerName` |
| `scale` | number | `SetBlipScale` |
| `stretch` | number, the height as a share of the width | `SetBlipScaleTransformation` (send `scale` as the width too) |
| `category` | number | `SetBlipCategory` |
| `priority` | number | `SetBlipPriority` |
| `hiddenOnLegend` | boolean | `SetBlipHiddenOnLegend` |
| `highDetail` | boolean | `SetBlipHighDetail` |
| `bright` | boolean | `SetBlipBright`, and `SetBlipAsFriendly` (`true` for friendly) |
| `rgb` | `{ r, g, b }`, each `0` to `255` | `SetBlipSecondaryColour` |
| `routeColor` | number, a HUD colour | `SetBlipRouteColour` |
| `radius` | number, metres | the radius given to `AddBlipForRadius` |
| `radiusEdge` | boolean | `SetRadiusBlipEdge` |
| `areaWidth`, `areaHeight` | number, metres | the size given to `AddBlipForArea` |
| `cone`, `coneColor` | boolean, number | `SetBlipShowCone` |
| `coneFov`, `coneRange` | number: degrees, metres | the cone given to `SetupFakeConeData` |
| `flashSpeed` | number, milliseconds | `SetBlipFlashInterval` |
| `number` | number, `-1` to remove | `ShowNumberOnBlip`, `HideNumberOnBlip` |
| `tick`, `goldTick` | boolean | `ShowTickOnBlip`, `ShowHasCompletedIndicatorOnBlip` |
| `headingIndicator`, `outline` | boolean | `ShowHeadingIndicatorOnBlip`, `ShowOutlineIndicatorOnBlip` |
| `friendIndicator`, `crewIndicator` | boolean | `ShowFriendIndicatorOnBlip`, `ShowCrewIndicatorOnBlip` |

What each field looks like on the map is described under
[`SetBlipMeta`](https://docs.elementlabs.net/products/3d-pause-menu/reference/exports). Values are not checked: a value of the
wrong type draws the marker wrongly instead of raising an error, so send numbers as numbers.

## The events

All are client events, triggered locally, never across the network.

| Event | Arguments | When to send it |
| - | - | - |
| `el:pausemenu:blip:meta` | `handle`, `fields` | After creating a marker, and whenever one of the fields above changes. |
| `el:pausemenu:blip:touch` | `handle` | After changing what the map reads itself, while the map is open. |
| `el:pausemenu:blip:gone` | `handle` | Before removing the marker. |
| `el:pausemenu:blip:new` | `handle` | Optional, right after creating a marker while the map is open, so it appears at once instead of at the next sweep. |

Every event is listed with the rest in [Events](https://docs.elementlabs.net/products/3d-pause-menu/reference/events.md).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.