Embedding and Sharing Visualizers

Overview

Once a visualizer is published, you can share it via its public URL or embed it inside your own site. Filters can be driven from URL parameters, so the same visualizer can render different slices of data in different places.

Public link

Every published visualizer has a public URL based on its slug: /v/<your-slug>. Share this link with viewers; no login is required. To restrict access, set a password in the visualizer settings.

Embedding

Enable Embedding in the visualizer's Embed tab. FlowFn issues a per-visualizer token and renders an embed URL of the form https://<your-host>/v/<slug>?embed=<token>. The token bypasses password protection.

Basic iframe:

<iframe
  src="https://<your-host>/v/<slug>?embed=<token>"
  title="Visualizer"
  width="100%"
  height="500"
  frameborder="0"></iframe>

Fluid container, no border:

<div style="max-width: 960px; margin: 0 auto;">
  <iframe
    src="https://<your-host>/v/<slug>?embed=<token>"
    title="Visualizer"
    style="width: 100%; min-height: 500px; border: 0; display: block;"></iframe>
</div>

Filter via URL params

Any filter you create with Allow override on public on can be driven via URL params. Pass the value as filter_<field>, and (optionally) the operator as filter_<field>_op:

<iframe
  src="https://<your-host>/v/<slug>?embed=<token>&filter_status=active"
  title="Visualizer"
  width="100%"
  height="500"></iframe>

Custom operator example — show rows where amount >= 100:

<iframe
  src="https://<your-host>/v/<slug>?embed=<token>&filter_amount=100&filter_amount_op=gte"
  title="Visualizer"
  width="100%"
  height="500"></iframe>

Supported operators: eq, neq, lt, lte, gt, gte, contains. The operator must be allowed for the field's type — numeric and date fields support comparisons; text fields support contains; switches support eq/neq only.

Filters with Allow override on public off are locked — they always use their saved value and ignore URL params. Use this to enforce a tenant or scope on a particular embed.

Driving filters dynamically from your page:

function setVisualizerFilter(field, value, op = 'eq') {
  const url = new URL('https://<your-host>/v/<slug>?embed=<token>');
  url.searchParams.set('filter_' + field, value);
  url.searchParams.set('filter_' + field + '_op', op);
  document.querySelector('iframe').src = url.toString();
}
setVisualizerFilter('status', 'active');
setVisualizerFilter('amount', '100', 'gte');

Allowed domains

Add the parent hostnames you want to allow in the Allowed domains field (e.g. example.com — covers www. too). Embedding from any other domain is blocked. Leave empty to allow any site.

Token rotation

Click Regenerate in the embed panel to rotate the token. Previous embed URLs stop working immediately — re-paste the new URL on every site that embeds the visualizer.

Plan limits

Embedding is plan-gated; allowed-domain count and custom domains may also be capped. See Billing & Plans.