feat: support 2-layered scatter plot

[jooyoungseo]

Feature Request

Description

Currently, our examples only contain single-layered scatter plots. We should add examples that demonstrate how to create 2-layered scatter plots.

Motivation

maidr.js supports multi-layered plot just like this 2-layered scatter plot. Users can switch between layers using PageUp/PageDown keys. We need to support this feature in py_maidr as well.

Proposed Solution

Support a 2 layered scatter plot like below:

# !pip install statsmodels
import matplotlib.pyplot as plt
import seaborn as sns

# Load the penguins dataset
penguins = sns.load_dataset("penguins")

# Initialize the plot
plt.figure(figsize=(10, 6))

# Layer 1: Scatter plot
sns.scatterplot(data=penguins, x="flipper_length_mm", y="body_mass_g", s=100)

# Layer 2: Smoothed line (LOWESS)
sns.regplot(
    data=penguins,
    x="flipper_length_mm",
    y="body_mass_g",
    scatter=False,
    lowess=True,
    line_kws={"color": "black"},
)

# Add labels and title
plt.title("Penguin Flipper Length vs Body Mass (Smoothed)", fontsize=16)
plt.xlabel("Flipper Length (mm)", fontsize=14)
plt.ylabel("Body Mass (g)", fontsize=14)
plt.show()

Additional Context

N/A

Checklist

• I have searched for similar feature requests and confirmed that this is a new request.
• I have provided a clear and concise description of the feature.
• I have explained the motivation behind this feature request.
• I have outlined a proposed solution or ideas for implementing this feature.
• I have provided any additional context or screenshots if applicable.