fix: area mark event handlers #132
Conversation
resolves #130
|
📦 Preview package for this PR is published! Version: Install it with: npm install svelteplot@pr-132
# or install the specific version
npm install svelteplot@0.3.7-pr-132.0 |
✅ Deploy Preview for svelteplot ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
There was a problem hiding this comment.
Pull Request Overview
This pull request adds event handling capabilities to area marks in the plotting library and provides a demonstration example. The changes enable interactive features like responding to pointer events within area plots.
- Imported and applied the
addEventHandlershelper to theArea.sveltecomponent - Created a new interactive example showcasing area plot event handling with dynamic title updates and opacity changes
- Enabled area marks to receive event context including plot state, options, and datum data
Reviewed Changes
Copilot reviewed 2 out of 4 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
src/lib/marks/Area.svelte |
Added event handler support by importing and applying the addEventHandlers action to the area path element |
src/routes/examples/area/events.svelte |
Created new example demonstrating interactive area plots with pointer event handling |
Comments suppressed due to low confidence (1)
src/routes/examples/area/events.svelte:13
- The variable name 'lastClicked' is misleading since the event handler uses 'onpointerenter', not a click event. Consider renaming to 'lastHovered' or 'hoveredArea' to accurately reflect the interaction.
let lastClicked = $state();
|
📦 Preview package for this PR is published! Version: Install it with: npm install svelteplot@pr-132
# or install the specific version
npm install svelteplot@0.3.7-pr-132.1 |
✅ Deploy Preview for svelteplot ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Please view comment here: |
This pull request introduces event handling support for area marks in the plotting library and demonstrates its usage with a new example. The main changes add a helper for event handlers to
Area.svelte, enabling interactive features such as responding to pointer events in area plots.Event handling support for area marks:
addEventHandlershelper import toArea.svelte, preparing the component to support custom event handlers for area marks.addEventHandlersaction to the area<path>element inArea.svelte, allowing events like pointer enter to be handled and passed relevant context (getPlotState,options,datum).New interactive area plot example:
src/routes/examples/area/events.svelteto showcase interactive area plots. This example updates the plot title and area opacity dynamically based on pointer events, demonstrating how to use event handlers with area marks.resolves #130