Skip to content

Feat/reuse link wrapper #109

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Jun 2, 2025
Merged

Feat/reuse link wrapper #109

merged 7 commits into from
Jun 2, 2025

Conversation

gka
Copy link
Contributor

@gka gka commented Jun 2, 2025

resolves #108

This pull request increases support for linkable mark elements, simplifying mark rendering, and expanding the example gallery. The most important changes include the introduction of the Anchor helper component, updates to mark types to support link-related properties, and the addition of new examples showcasing these features.

Enhancements to mark rendering:

  • Added Anchor helper component: Introduced src/lib/marks/helpers/Anchor.svelte to wrap mark elements in <a> tags when href and related properties are provided. This enables linkable marks with attributes like target, rel, and download.
  • Updated mark components: Integrated the Anchor component into various mark files (Area.svelte, Dot.svelte, Geo.svelte, RectPath.svelte) to render linkable elements conditionally. [1] [2] [3] [4]

Type updates for linkable marks:

  • Introduced LinkableMarkProps: Added a new type in src/lib/types.ts to define properties like href, target, rel, and download for linkable marks. This type was integrated into multiple mark definitions, including BarXMarkProps, BarYMarkProps, and SphereMarkProps. [1] [2] [3] [4]

Expanded example gallery:

  • New examples: Added linked-bars.svelte, earthquakes.svelte, and regression/_index.svelte to demonstrate the functionality of linkable marks and other features. These examples showcase linked bar charts, earthquake maps with clickable markers, and regression-related visualizations. [1] [2] [3]
  • Updated data loading: Enhanced src/routes/examples/+layout.ts to include new datasets like earthquakes and cars for the examples.

Copy link

netlify bot commented Jun 2, 2025

Deploy Preview for svelteplot ready!

Name Link
🔨 Latest commit 3bcaf10
🔍 Latest deploy log https://app.netlify.com/projects/svelteplot/deploys/683e1e0e8a19380008faf717
😎 Deploy Preview https://deploy-preview-109--svelteplot.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copy link

github-actions bot commented Jun 2, 2025

📦 Preview package for this PR is published!

Version: 0.2.9-pr-109.0

Install it with:

npm install svelteplot@pr-109
# or install the specific version
npm install svelteplot@0.2.9-pr-109.0

Copy link

github-actions bot commented Jun 2, 2025

📦 Preview package for this PR is published!

Version: 0.2.9-pr-109.1

Install it with:

npm install svelteplot@pr-109
# or install the specific version
npm install svelteplot@0.2.9-pr-109.1

@gka gka merged commit 51ed8ce into main Jun 2, 2025
8 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Support data-sveltekit-noscroll for links
1 participant
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy