---
title: viewer2d.markerdragend
slug: viewer-2d/events/markerdragend
docTags: 
createdAt: 2024-02-21T17:17:42.342Z
---

Invoked when the user stops moving the marker.

## Example

::codepen{url="https://codepen.io/Catenda/embed/MWMBgeJ"}

## Usage

:::CodeblockTabs
```javascript
const onMarkerDragComplete = function (event) {
  const { marker } = event;
  console.log("viewer2d.markerdragend", "marker:", marker);
};

viewer2d.addEventListener("viewer2d.markerdragend", onMarkerDragComplete);
```

jQuery

```javascript
const onMarkerDragComplete = function (event, marker) {
  console.log("viewer2d.markerdragend", "marker:", marker);
};

$("#viewer-2d").on("viewer2d.markerdragend", onMarkerDragComplete);
```
:::

## Parameters

### onMarkerDragComplete

::::Tabs
:::Tab{title="JS"}
Function called when the user stops moving the marker.

| **Type**                  |
| ------------------------- |
| `(event: Object) => Void` |

**event**

| **Name**   | **Type** | **Description**    |
| ---------- | -------- | ------------------ |
| `marker`   | Object   | The dragged marker |
| `srcEvent` | Object   | Original DOM event |

**marker**

The marker the user dragged.

| **Name** | **Type** | **Description**                                    |
| -------- | -------- | -------------------------------------------------- |
| `color`  | String   | Color of the marker                                |
| `data`   | Object   | Data included with the marker when added           |
| `id`     | String   | Id of the marker                                   |
| `text`   | String   | Optional text label displayed alongside the marker |
| `x`      | Number   | X coordinate of the marker in pixels               |
| `y`      | Number   | Y coordinate of the marker in pixels               |
:::

:::Tab{title="jQuery"}
Function called when the user stops moving the marker.

| **Type**                                  |
| ----------------------------------------- |
| `(event: Object, marker: Object) => Void` |

**event**

[jQuery.Event](https://api.jquery.com/category/events/event-object/)

**marker**

The marker the user dragged.

| **Name** | **Type** | **Description**                                    |
| -------- | -------- | -------------------------------------------------- |
| `color`  | String   | Color of the marker                                |
| `data`   | Object   | Data included with the marker when added           |
| `id`     | String   | Id of the marker                                   |
| `text`   | String   | Optional text label displayed alongside the marker |
| `x`      | Number   | X coordinate of the marker in pixels               |
| `y`      | Number   | Y coordinate of the marker in pixels               |
:::
::::