GitHub user dosubot[bot] added a comment to the discussion: Apply multiple
filters in embedded dashboard
<!-- Answer -->
To filter on ranges (like price > 10) in an embedded Superset dashboard, you
need to:
1. In your Superset dashboard, add a native filter of type "Range"
(filter_range) for your numeric column (e.g., price).
2. Find the filter's unique ID (you can get this from the dashboard's JSON
metadata or by inspecting the filter in the dashboard editor).
3. When embedding, use the embedDashboard function and pass preselect_filters
as a JSON string in dashboardUiConfig.urlParams. For a range filter, the value
should be a two-element array: [minValue, maxValue]. For example, [10, null]
means "price >= 10".
Example:
```js
embedDashboard({
id: "your-dashboard-id",
supersetDomain: "https://your-superset-instance",
mountPoint: document.getElementById("dashboard"),
fetchGuestToken: async () => "your-guest-token",
dashboardUiConfig: {
urlParams: {
preselect_filters: JSON.stringify({
// Replace with your actual filter ID
"NATIVE_FILTER-abc123": [10, null] // price >= 10
})
}
}
});
```
The key must match the filter's ID, and the value is [min, max]. Use null for
open-ended ranges (e.g., [null, 100] for price <= 100). This approach is based
on how the Range native filter plugin expects its value in Superset's frontend
code. There isn't official documentation for this specific use case, but the
implementation is consistent with the codebase and how other filters are
preselected via preselect_filters. See the [Superset Embedded SDK
README](https://github.com/apache/superset/blob/308007f909b5a3c1cdd6fc5632ef27ca7eb97ce0/superset-embedded-sdk/README.md)
and the [RangeFilterPlugin
code](https://github.com/apache/superset/blob/308007f909b5a3c1cdd6fc5632ef27ca7eb97ce0/superset-frontend/src/filters/components/Range/RangeFilterPlugin.tsx)
for more details.
Let me know if you need help finding the filter ID or have questions about
configuring the native filter in the dashboard UI.
<!-- Dosu Comment Footer -->
*To reply, just mention [@dosu](https://go.dosu.dev/dosubot).*
---
<sup>How did I do?
[Good](https://app.dosu.dev/response-feedback/04d7afdd-4ab0-42a3-bce6-e5b22d9ddbfd?feedback_type=great_response)
|
[Irrelevant](https://app.dosu.dev/response-feedback/04d7afdd-4ab0-42a3-bce6-e5b22d9ddbfd?feedback_type=irrelevant_answer)
|
[Incorrect](https://app.dosu.dev/response-feedback/04d7afdd-4ab0-42a3-bce6-e5b22d9ddbfd?feedback_type=incorrect_sources)
|
[Verbose](https://app.dosu.dev/response-feedback/04d7afdd-4ab0-42a3-bce6-e5b22d9ddbfd?feedback_type=too_verbose)
|
[Hallucination](https://app.dosu.dev/response-feedback/04d7afdd-4ab0-42a3-bce6-e5b22d9ddbfd?feedback_type=hallucination)
| [Report
🐛](https://app.dosu.dev/response-feedback/04d7afdd-4ab0-42a3-bce6-e5b22d9ddbfd?feedback_type=bug_report)
|
[Other](https://app.dosu.dev/response-feedback/04d7afdd-4ab0-42a3-bce6-e5b22d9ddbfd?feedback_type=other)</sup> [](https://go.dosu.dev/discord-bot) [](https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/apache/superset/discussions/34020)
GitHub link:
https://github.com/apache/superset/discussions/34020#discussioncomment-13636438
----
This is an automatically sent email for [email protected].
To unsubscribe, please send an email to:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]