Faceted Pointer (2)
<Plot y={{ axis: false }} marginTop={10} inset={4}>
<Frame
fill="currentColor"
stroke={false}
fillOpacity={0.02} />
<Line
{...normalized}
opacity={selection.length > 0 ? 0.4 : 1}
stroke="Symbol" />
<Pointer
{...normalized}
y={null}
onupdate={(e) => (selection = e)} />
<RuleX
data={selection.slice(0, 1)}
x="Date"
opacity={0.2} />
<Text
data={selection}
fill="Symbol"
stroke="var(--svelteplot-bg)"
strokeWidth={3}
x="Date"
y="__y"
fy="Symbol"
text={(d) => d.Close.toFixed()}
lineAnchor="bottom"
fontWeight="bold"
dy={-3} />
<Dot
data={selection}
x="Date"
y="__y"
fy="Symbol"
fill="Symbol"
strokeWidth={0.7}
stroke="var(--svelteplot-bg)" />
</Plot>
Open in Svelte playground