svg-highlight

A tiny js tool to highlight an SVG element, that acts like a z-index: +1.

Why ?
Since SVG uses the order of DOM elements during the drawing stage, those at the same level overlap. It can be used i.e. to show complete stroke of an highlighted element.

⚙️ Installation

Using npm :

npm install svg-highlight

Using yarn :

yarn add svg-highlight

✨ Usage

import svgHighlight from "svg-highlight";

const yourSvgElement = document.querySelector('.your-svg-element');
svgHighlight(yourSvgElement);

Options

You can pass some options for advanced usage :

svgHighlight(yourSvgElement, {
    // The class you want to use one the highlighted element.
    // (default: 'svg-highlight')
    customClass: 'my-highlighted-class'
})

👨‍💻 Credits

© Robin Simonklein