Tantacula
@Tantacula
Ларавельщик, витающий в небесах.

Как поменять цвет в svg файле?

Подскажите пожалуйста, как можно поменять заливку в svgz файле, подключенном как атрибут img? Желательно с помощью jquery или css, чтобы нагляднее было.
  • Вопрос задан
  • 20614 просмотров
Решения вопроса 1
Sevlyar
@Sevlyar
Замечательный вопрос! Мне не удалось применить стили указанные в отдельном css файле к подключенному в страницу svg. Если это поможет, то вот как я делал. Код выдергивал из проекта, чтобы была понятна суть, возможно простым копированием не заработает, но смысл примерно такой:
<body>
	<object id="map-svg" type="image/svg+xml" data="map.svg"></object>
</body>

var map = document.getElementById("map-svg");
var mapDoc = map.contentDocument;
var element = mapDoc.getElementById("barrel-1");
// так не заработало
// element.setAttributeNS(null, "style", "fill:#008000");

Тогда я сделал так, в svg указал таблицу стилей:
<defs> 
    <style type="text/css">
      .wpc-active {
        fill: #008000;
      }
    </style>
</defs>

И в скрипте добавил код:
element.classList.add('wpc-active');
//element.classList.remove('wpc-active');
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы