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