Skip to content
1 change: 1 addition & 0 deletions frontend/src/plugins/impl/vega/VegaPlugin.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ export class VegaPlugin implements IPlugin<VegaComponentState, Data> {
.union([z.boolean(), z.literal("point"), z.literal("interval")])
.default(true),
fieldSelection: z.union([z.boolean(), z.array(z.string())]).default(true),
embedOptions: z.object({}).passthrough().default({}),
});

render(props: IPluginProps<VegaComponentState, Data>): JSX.Element {
Expand Down
24 changes: 19 additions & 5 deletions frontend/src/plugins/impl/vega/vega-component.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ export interface Data {
spec: VegaLiteSpec;
chartSelection: boolean | "point" | "interval";
fieldSelection: boolean | string[];
embedOptions?: Record<string, unknown>;
}

export interface VegaComponentState {
Expand Down Expand Up @@ -58,6 +59,7 @@ const VegaComponent = ({
chartSelection,
fieldSelection,
spec,
embedOptions,
}: VegaComponentProps<VegaComponentState>) => {
const { data: resolvedSpec, error } = useAsyncData(async () => {
// We try to resolve the data before passing it to Vega
Expand All @@ -82,6 +84,7 @@ const VegaComponent = ({
chartSelection={chartSelection}
fieldSelection={fieldSelection}
spec={resolvedSpec}
embedOptions={embedOptions}
/>
);
};
Expand All @@ -92,11 +95,27 @@ const LoadedVegaComponent = ({
chartSelection,
fieldSelection,
spec,
embedOptions,
}: VegaComponentProps<VegaComponentState>): JSX.Element => {
const { theme } = useTheme();
const vegaView = useRef<View>(undefined);
const [error, setError] = useState<Error>();

// Merge default actions with user-provided embed options
const actions = useMemo(() => {
// If embedOptions contains 'actions', use it directly
if (embedOptions && "actions" in embedOptions) {
return embedOptions.actions;
}

// Otherwise use defaults
return {
source: false,
compiled: false,
...embedOptions,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this spread be here? i think we can just return:

{
      source: false,
      compiled: false,
}
};
}, [embedOptions]);

// Aggressively memoize the spec, so Vega doesn't re-render/re-mount the component
const specMemo = useDeepCompareMemoize(spec);
const selectableSpec = useMemo(() => {
Expand Down Expand Up @@ -242,11 +261,6 @@ const LoadedVegaComponent = ({
);
};

const actions = {
source: false,
compiled: false,
};

/**
* Convert any sets to a list before passing to the BE
*/
Expand Down
6 changes: 6 additions & 0 deletions marimo/_plugins/ui/_impl/altair_chart.py
Original file line number Diff line number Diff line change
Expand Up @@ -325,6 +325,11 @@ def __init__(

import altair as alt

# Capture any global altair embed options that may have been set
embed_options = {}
if alt.renderers.options.get("embed_options"):
embed_options = alt.renderers.options["embed_options"]

register_transformers()

self._chart = chart
Expand Down Expand Up @@ -430,6 +435,7 @@ def __init__(
"spec": vega_spec,
"chart-selection": chart_selection,
"field-selection": legend_selection,
"embed-options": embed_options,
},
on_change=on_change,
)
Expand Down
Loading