metabase / metabase/metabase

Map visualizations do not apply theme colors when using Embedded Analytics JS or the React SDK

Open
#66,698 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

.Team/Embedding Difficulty:Medium sdk_quality Type:New Feature Visualization/ Visualization/Maps
Dominant language
Clojure
Stars
49.3k
Forks
6.8k
Avg merge
1d 13h
Merged PRs (30d)
653

Description

Describe the bug

When using themes in Embedded Analytics (both React SDK and Embedded Analytics JS), map visualizations do not respect the applied theme colors. Other visualization types (bar, line, row charts, etc.) correctly apply the theme, but maps continue using default colors even when no custom colors are set.

This happens both in my embedded environment and on the public Metabase Embedded Analytics SDK demo site.

To Reproduce

Go to: https://embedded-analytics-sdk-demo.metabase.com/

  1. Click New Custom Exploration.
  2. Choose From Scratch → Select Customers.
  3. Under Summarize, select Count.
  4. Under Group by, select State.
  5. Click Visualize and switch to a Map visualization.

Notice that the map colors do not change, while other visualization types do.

Expected behavior

Map visualizations should apply the active theme’s color palette in the same way other visuals do.

Logs

No response

Information about your Metabase installation
{
  "browser-info": {
    "language": "en-US",
    "platform": "MacIntel",
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Safari/537.36",
    "vendor": "Google Inc."
  },
  "metabase-info": {
    "databases": [
      "postgres"
    ],
    "run-mode": "prod",
    "plan-alias": "internal",
    "version": {
      "date": "2025-12-02",
      "tag": "v1.57.5",
      "hash": "ec54fec"
    },
    "settings": {
      "report-timezone": null
    },
    "hosting-env": "unknown",
    "application-database": "postgres"
  }
}
Severity

Annoying

Additional context

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue on the Embedded Analytics SDK demo using the stated Customers, State, Count, and Map steps, then compare the map with bar or line visualizations under the same theme. Trace the React SDK and Embedded Analytics JS theme handling for map colors. Done means map visualizations use the active theme palette when no custom colors are set.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
data-visualization, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.