superset icon indicating copy to clipboard operation
superset copied to clipboard

feat(country-map): add cross-filters support

Open imad-hl opened this issue 1 month ago โ€ข 13 comments

User description

SUMMARY

This PR adds cross-filters support to the legacy CountryMap plugin with some changes to the map interaction UX:

  • Clicking on a region now triggers cross-filtering instead of zooming in by default.
  • Added multi-select support using Shift + Click (toggle regions).
    Note: While this behavior is not present in other Superset charts, I found it helpful. I welcome guidance from reviewers on whether to keep it or remove it for consistency.
  • Selected regions are highlighted, while non-selected ones are faded.
  • Zooming and panning are now handled via mouse wheel or trackpad.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

country_map_crossfilters_animation

TESTING INSTRUCTIONS

ADDITIONAL INFORMATION

  • [X] Has associated issue: Fixes #33772
  • [ ] Required feature flags
  • [X] Changes UI
  • [ ] Includes DB Migration (follow approval process in SIP-59)
    • [ ] Migration is atomic, supports rollback & is backwards-compatible
    • [ ] Confirm DB migration upgrade and downgrade tested
    • [ ] Runtime estimates and downtime expectations provided
  • [ ] Introduces new feature or API
  • [ ] Removes existing feature or API

CodeAnt-AI Description

Enable cross-filtering and drill actions on the Country Map chart

What Changed

  • Clicking a region now selects it and applies cross-filters to linked charts instead of zooming the map
  • Users can select or clear multiple regions with Shift+click, with selected areas highlighted and non-selected areas faded
  • Right-clicking a region opens the drill menu with drill-to-detail, drill-by, and cross-filter options when available
  • Map zooming and panning now use scroll/trackpad with bounded movement and preserve the current view when the chart refreshes
  • Regions without data now show in a neutral gray rather than disappearing, and hover labels and values are more readable
  • The chart handles missing configuration and interaction data more safely, reducing cases where the country map fails to render

Impact

โœ… Faster cross-filter exploration from maps โœ… Clearer selection feedback on country maps โœ… Fewer country map render failures

๐Ÿ’ก Usage Guide

Checking Your Pull Request

Every time you make a pull request, our system automatically looks through it. We check for security issues, mistakes in how you're setting up your infrastructure, and common code problems. We do this to make sure your changes are solid and won't cause any trouble later.

Talking to CodeAnt AI

Got a question or need a hand with something in your pull request? You can easily get in touch with CodeAnt AI right here. Just type the following in a comment on your pull request, and replace "Your question here" with whatever you want to ask:

@codeant-ai ask: Your question here

This lets you have a chat with CodeAnt AI about your pull request, making it easier to understand and improve your code.

Example

@codeant-ai ask: Can you suggest a safer alternative to storing this secret?

Preserve Org Learnings with CodeAnt

You can record team preferences so CodeAnt AI applies them in future reviews. Reply directly to the specific CodeAnt AI suggestion (in the same thread) and replace "Your feedback here" with your input:

@codeant-ai: Your feedback here

This helps CodeAnt AI learn and adapt to your team's coding style and standards.

Example

@codeant-ai: Do not flag unused imports.

Retrigger review

Ask CodeAnt AI to review the PR again, by typing:

@codeant-ai: review

Check Your Repository Health

To analyze the health of your code repository, visit our dashboard at https://app.codeant.ai. This tool helps you identify potential issues and areas for improvement in your codebase, ensuring your repository maintains high standards of code health.

imad-hl avatar Oct 27 '25 16:10 imad-hl

Based on your review schedule, I'll hold off on reviewing this PR until it's marked as ready for review. If you'd like me to take a look now, comment /korbit-review.

Your admin can change your review schedule in the Korbit Console

korbit-ai[bot] avatar Oct 27 '25 16:10 korbit-ai[bot]

Looks like there are some typescript issues to fix. You might fix some by running npm run plugins:build on the frontend.

rusackas avatar Nov 17 '25 22:11 rusackas

Looks like there are some typescript issues to fix. You might fix some by running npm run plugins:build on the frontend.

Hi @rusackas

Thanks for reviewing! I ran npm run plugins:build locally and the Country Map plugin seems to compile successfully. apart from some babel warnings :

@superset-ui/legacy-plugin-chart-country-map: `isModuleDeclaration` has been deprecated, please migrate to `isImportOrExportDeclaration`
@superset-ui/legacy-plugin-chart-country-map:     at isModuleDeclaration (/app/superset-frontend/node_modules/@babel/types/lib/validators/generated/index.js:2793:35)
@superset-ui/legacy-plugin-chart-country-map:     at PluginPass.Program (/app/superset-frontend/node_modules/babel-plugin-lodash/lib/index.js:102:44)

The type script errors seems to come from other plugins (plugin-chart-echarts) , I rebased my branch on the latest master, hope it helps

imad-hl avatar Nov 18 '25 11:11 imad-hl

CodeAnt AI is reviewing your PR.

CodeAnt AI finished reviewing your PR.

Re-running CI, let's see how it goes! ๐Ÿคž

That said, there are still a lot of Copilot suggestions, if you don't mind addressing them (leaving a comment if they're irrelevant/wrong, or addressing them if they're on the right track).

rusackas avatar Dec 02 '25 22:12 rusackas

Re-running CI, let's see how it goes! ๐Ÿคž

That said, there are still a lot of Copilot suggestions, if you don't mind addressing them (leaving a comment if they're irrelevant/wrong, or addressing them if they're on the right track).

I've addressed the Copilot suggestions in commit 9651b63 hence why they show as "outdated". but I'll go through each one and add comments explaining the implemented solution

imad-hl avatar Dec 04 '25 12:12 imad-hl

Code LGTM, I just want to test before merging. Ephemeral environments are busted at the moment, so it's in my backlog of things to checkout / build / run / test :)

rusackas avatar Dec 06 '25 01:12 rusackas

๐ŸŽช Showtime is building environment on GHA for d818e4a

github-actions[bot] avatar Dec 06 '25 01:12 github-actions[bot]

๐ŸŽช Showtime deployed environment on GHA for d818e4a

โ€ข Environment: http://34.222.53.98:8080 (admin/admin) โ€ข Lifetime: 48h auto-cleanup โ€ข Updates: New commits create fresh environments automatically

github-actions[bot] avatar Dec 06 '25 01:12 github-actions[bot]

๐ŸŽช Showtime is building environment on GHA for d818e4a

github-actions[bot] avatar Dec 08 '25 17:12 github-actions[bot]

๐ŸŽช Showtime deployed environment on GHA for d818e4a

โ€ข Environment: http://52.35.39.226:8080 (admin/admin) โ€ข Lifetime: 48h auto-cleanup โ€ข Updates: New commits create fresh environments automatically

github-actions[bot] avatar Dec 08 '25 18:12 github-actions[bot]

Eek... some conflicts have arisen due to another recently merged PR. Could you take a look at rebasing? Hope I didn't cause too much trouble.

Otherwise, I think the shift-click thing is a little... unusual... but I don't mind it all that much. It's hard to discover, so a docs entry couldn't hurt, OR adapting this to other cross-filter-emitting charts like Pie Charts or Bar Charts. That'd be cool, unless there's a better, more visibly obvious pattern here (@kasiazjc might have ideas).

rusackas avatar Dec 08 '25 23:12 rusackas

CodeAnt AI is running Incremental review

Eek... some conflicts have arisen due to another recently merged PR. Could you take a look at rebasing? Hope I didn't cause too much trouble.

Otherwise, I think the shift-click thing is a little... unusual... but I don't mind it all that much. It's hard to discover, so a docs entry couldn't hurt, OR adapting this to other cross-filter-emitting charts like Pie Charts or Bar Charts. That'd be cool, unless there's a better, more visibly obvious pattern here (@kasiazjc might have ideas).

Hi! I think I got the conflicts sorted out. The recently merged PR added a nice tooltip feature on hover, which is now integrated. About the shift-click multiselect : I agree it's not very discoverable. I've removed it and simplified the behavior to match what other cross-filter charts do (Pie, Bar, etc.).

I do think shift-multiselect could be a good addition if implemented consistently across all cross-filter charts, but for this PR I'll stick with removing it and keeping things aligned with the existing patterns.

imad-hl avatar Dec 12 '25 15:12 imad-hl

CodeAnt AI is running Incremental review


Thanks for using CodeAnt! ๐ŸŽ‰

We're free for open-source projects. if you're enjoying it, help us grow by sharing.

Share on X ยท Reddit ยท LinkedIn