Неподдерживаемые фильтры SVG скрывают фигуры - PullRequest
0 голосов
/ 17 октября 2019

В Edge, если вы применяете неподдерживаемый фильтр, такой как feDropShadow, фигура не отображается.

Я также наблюдал такое поведение в Chrome для любого другого неподдерживаемого фильтра. Любое решение?

<svg width='250' height='250' xmlns="http://www.w3.org/2000/svg" viewBox='0 0 100 100'>
  <defs>
    <filter id="filter">
      <!-- Unsupported filter -->
      <feUnsupportedFilter/>
    </filter>
  </defs>
  <circle fill="cornflowerblue" filter="url(#filter)" cx="50" cy="35" r="20"/>
</svg>

1 Ответ

0 голосов
/ 17 октября 2019

Я обнаружил, что если вы добавите любой другой поддерживаемый фильтр, форма будет отображаться правильно.

<svg width='250' height='250' xmlns="http://www.w3.org/2000/svg" viewBox='0 0 100 100'>
  <defs>
    <filter id="filter">
      <!-- Supported filter -->
      <feOffset/>
      <!-- Unsupported filter -->
      <feUnsupportedFilter/>
    </filter>
  </defs>
  <circle fill="cornflowerblue" filter="url(#filter)" cx="50" cy="35" r="20"/>
</svg>
...