SVG
указатель событий

Вступление

никто

наиболее распространенным случаем является установка указателей-событий на none чтобы предотвратить определенные фигуры или весь ваш рисунок для захвата событий мыши и позволить фигурам под ними получать события.

Если вы наведите указатель мыши на область, где красный круг накладывается на синий круг, синий круг все равно будет принимать события мыши, так как указатели-события не равны none

<svg viewBox="0 0 150 100">
    <style>
        .target:hover{fill:green}
    </style>
    <circle class="target" cx="50" cy="50" r="50" fill="blue"/>
    <circle cx="100" cy="50" r="50" fill="red" pointer-events="none"/>
</svg> 

заполнить

Установка pointer-events="fill" позволяет получать события мыши на фигуре, даже если для ее заполнения установлено значение none

<svg viewBox="0 0 100 100">
    <style>
        circle:hover{fill:green}
    </style>
    <circle class="target" cx="50" cy="50" r="50" fill="none"/>
</svg>