Mplcursors for hover labels in Matplotlib - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of mplcursors hover label code

What will be the output when running this code snippet that uses mplcursors to add hover labels to a scatter plot?

Matplotlib

import matplotlib.pyplot as plt
import mplcursors

fig, ax = plt.subplots()
sc = ax.scatter([1, 2, 3], [4, 5, 6])

cursor = mplcursors.cursor(sc)
cursor.connect("add", lambda sel: sel.annotation.set_text(f"Point: {sel.target[0]}, {sel.target[1]}"))

plt.show()

A The code raises a NameError because mplcursors is not imported.

B A scatter plot appears. Hovering over points shows labels like 'Point: 1, 4', 'Point: 2, 5', etc.

C The scatter plot appears but no hover labels show when hovering over points.

D The code raises a TypeError due to incorrect lambda function syntax.

💡 Hint

Check how mplcursors connects to the scatter plot and sets annotation text.

The code creates a scatter plot and uses mplcursors to add interactive hover labels showing the coordinates of each point.

🧠 Conceptual

intermediate

Understanding mplcursors cursor targets

In mplcursors, what does the 'sel.target' attribute represent when handling the 'add' event for a scatter plot?

A The x and y coordinates of the data point being hovered over.

B The color and size of the scatter plot markers.

C The matplotlib figure object containing the plot.

D The index of the data point in the original dataset.

💡 Hint

Think about what information you want to show in a hover label.

'sel.target' holds the data coordinates (x, y) of the point that the cursor is currently over.

🔧 Debug

advanced

Why does this mplcursors hover label code fail?

Given this code, why does it fail to show hover labels? import matplotlib.pyplot as plt import mplcursors fig, ax = plt.subplots() sc = ax.scatter([1, 2, 3], [4, 5, 6]) cursor = mplcursors.cursor(sc) cursor.connect("add", lambda sel: sel.annotation.set_text(f"Point: {sel.target}")) plt.show()

A The f-string tries to print 'sel.target' directly, which is an array, causing the label to be unreadable.

B The lambda function is missing a return statement, causing a runtime error.

C The scatter plot is missing a label parameter, so mplcursors cannot create annotations.

D The 'connect' method is called with the wrong event name; it should be 'hover' instead of 'add'.

💡 Hint

Check what 'sel.target' contains and how it is formatted in the label.

The 'sel.target' is a numpy array of coordinates. Printing it directly in an f-string shows array syntax, which is not user-friendly. It should be formatted to show individual coordinates.

❓ data_output

advanced

Number of annotations created by mplcursors

If you run mplcursors on a scatter plot with 5 points and hover over 3 different points sequentially, how many annotation objects will mplcursors create?

A 1 annotation reused for all points hovered.

B 5 annotations, one for each point in the scatter plot.

C 0 annotations, because mplcursors does not create annotations automatically.

D 3 annotations, one for each hovered point.

💡 Hint

Think about how mplcursors creates annotations on demand when points are hovered.

Mplcursors creates a new annotation each time a new point is hovered over and the 'add' event triggers. Hovering 3 different points creates 3 annotations.

🚀 Application

expert

Customizing mplcursors hover labels with additional data

You have a scatter plot with points and a list of labels: labels = ['A', 'B', 'C']. How do you modify mplcursors to show the label along with coordinates on hover?

Matplotlib

import matplotlib.pyplot as plt
import mplcursors

x = [1, 2, 3]
y = [4, 5, 6]
labels = ['A', 'B', 'C']

fig, ax = plt.subplots()
sc = ax.scatter(x, y)

cursor = mplcursors.cursor(sc)

# Fill in the lambda function below to show label and coordinates
cursor.connect("add", lambda sel: sel.annotation.set_text(???))

plt.show()

A lambda sel: sel.annotation.set_text(f"Label: {labels[sel.annotation]}, Point: {sel.target[0]}, {sel.target[1]}")

B lambda sel: sel.annotation.set_text(f"Label: {labels[sel.target]}, Point: {sel.target[0]}, {sel.target[1]}")

C lambda sel: sel.annotation.set_text(f"Label: {labels[sel.index]}, Point: {sel.target[0]}, {sel.target[1]}")

D lambda sel: sel.annotation.set_text(f"Label: {labels[sel]}, Point: {sel.target[0]}, {sel.target[1]}")

💡 Hint

Use sel.index to get the index of the hovered point to access the label list.

The 'sel.index' attribute gives the index of the hovered point, which can be used to get the corresponding label from the labels list.