feat: apply dot mark defaults

svelteplot · gka · Jun 5, 2025 · Jun 3, 2025 · Jun 3, 2025 · Jun 3, 2025
commit dd22572875d351cbfa1897ea5b0bd7809aca5c99
diff --git a/src/lib/marks/Dot.svelte b/src/lib/marks/Dot.svelte
@@ -35,13 +35,19 @@
     import { addEventHandlers } from './helpers/events.js';
     import Anchor from './helpers/Anchor.svelte';
 
-    let {
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').dot
+    };
+
+    let markProps: DotMarkProps = $props();
+
+    const {
         data = [{}],
         canvas = false,
         class: className = '',
         dotClass = null,
         ...options
-    }: DotMarkProps = $props();
+    }: DotMarkProps = $derived({ ...DEFAULTS, ...markProps });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());
@@ -50,8 +56,6 @@
         return d3Symbol(maybeSymbol(symbolType), size)();
     }
 
-    const { dotRadius } = getContext<PlotDefaults>('svelteplot/_defaults');
-
     const args = $derived(
         // todo: move sorting to Mark
         sort(
@@ -80,7 +84,7 @@
         'fillOpacity',
         'strokeOpacity'
     ]}
-    defaults={{ r: dotRadius, symbol: 'circle' }}
+    defaults={{ r: 3, symbol: 'circle' }}
-    defaults={{ r: 3, symbol: 'circle' }}
+    defaults={{ r: dotRadius, symbol: 'circle' }}
-    defaults={{ r: 3, symbol: 'circle' }}
+    defaults={{ r: dotRadius, symbol: 'circle' }}
     {...args}>
     {#snippet children({ mark, usedScales, scaledData })}
         <g class="dot {className || ''}">

diff --git a/static/examples/arrow/metro.dark.png b/static/examples/arrow/metro.dark.png
diff --git a/static/examples/arrow/metro.png b/static/examples/arrow/metro.png
diff --git a/static/examples/dot/3-dot-plot.dark.png b/static/examples/dot/3-dot-plot.dark.png
diff --git a/static/examples/geo/us-choropleth-canvas.png b/static/examples/geo/us-choropleth-canvas.png
diff --git a/static/examples/regression/cars.png b/static/examples/regression/cars.png
diff --git a/static/examples/regression/faceted.dark.png b/static/examples/regression/faceted.dark.png
diff --git a/static/examples/regression/loess.dark.png b/static/examples/regression/loess.dark.png
diff --git a/static/examples/regression/log.dark.png b/static/examples/regression/log.dark.png