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

Invoked when the user hovers over a marker.

## Example

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

## Usage

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

viewer2d.addEventListener("viewer2d.markerhover", onMarkerHover);
```

jQuery

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

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

## Parameters

### onMarkerHover

::::Tabs
:::Tab{title="JS"}
Function called when the user hovers over a marker.

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

**event**

| **Name**   | **Type** | **Description**                              |
| ---------- | -------- | -------------------------------------------- |
| `marker`   | Object   | Marker below the cursor, `undefined` if none |
| `srcEvent` | Object   | Original DOM event                           |

**marker**

The marker below the cursor.

| **Name**    | **Type**                                | **Description**                                    |
| ----------- | --------------------------------------- | -------------------------------------------------- |
| `clickable` | Boolean                                 | Whether marker is clickable                        |
| `data`      | Object                                  | Data included with the marker when added           |
| `draggable` | Boolean                                 | Whether marker moves when dragged                  |
| `element`   | SVGElement                              | SVG element of the marker                          |
| `fillColor` | String                                  | Color of the marker                                |
| `icon`      | [Icon](docId\:ErSDQ9zOshf8pcPFlvJPH)    | icon of the marker                                 |
| `id`        | String                                  | Id of the marker                                   |
| `position`  | [Vector2](docId\:HfHNmbFsrRrISUBE9WgGy) | Location of the marker                             |
| `text`      | String                                  | Optional text label displayed alongside the marker |
:::

:::Tab{title="jQuery"}
Function called when the user hovers over a marker.

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

**event**

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

**marker**

The marker below the cursor.

| **Name**    | **Type**                                | **Description**                                    |
| ----------- | --------------------------------------- | -------------------------------------------------- |
| `clickable` | Boolean                                 | Whether marker is clickable                        |
| `data`      | Object                                  | Data included with the marker when added           |
| `draggable` | Boolean                                 | Whether marker moves when dragged                  |
| `element`   | SVGElement                              | SVG element of the marker                          |
| `fillColor` | String                                  | Color of the marker                                |
| `icon`      | [Icon](docId\:ErSDQ9zOshf8pcPFlvJPH)    | icon of the marker                                 |
| `id`        | String                                  | Id of the marker                                   |
| `position`  | [Vector2](docId\:HfHNmbFsrRrISUBE9WgGy) | Location of the marker                             |
| `text`      | String                                  | Optional text label displayed alongside the marker |
:::
::::