1.В каких редакторах можно создать SVG?
Ответ: Платные: Adobe Illustrator. Бесплатные: Inkscape, Figma.
2.Поддерживается ли тег defs при импорте?
Ответ: Да, тег <defs> поддерживается.
3.Можно ли открыть SVG обратно в графическом редакторе, после создания стилей CSS в теге <style>?
Ответ: Нет, не рекомендуется. Это связано с тем, что некоторые графические программы стирают весь style внутри SVG.
Рекомендуется для начала проверить, как Ваш графический редактор обрабатывает style.
Иначе весь style придется заполнять заново.
4.Какие графические эффекты поддерживаются?
Ответ:
Поддерживаются:
•Внутренняя тень (Inner shadow);
•Внешняя тень (Drop shadow);
•Размытие слоя (Layer blur).
Не поддерживаются:
•Размытие фона (Background blur).
5.Почему режимы наложения (blend-mode/blending mode) в графических редакторах работают, а после импорта SVG наложения либо не работают, либо отображаются
неверно?
Ответ: Графические редакторы и браузеры по-разному интерпретируют режимы наложения (mix-blend-mode), из-за этого наблюдается искажение SVG.
К сожалению, из-за данной особенности не рекомендуется использовать режимы наложения (blend-mode/blending mode).
6.Можно ли динамизировать SVG с помощью ST?
Ответ: К сожалению, после импорта SVG не работает. Но если создать элементы с помощью встроенных инструментов MasterSCADA 4D, то динамизация с помощью ST будет работать.
7.Можно ли динамизировать параметр, который бы отвечал за скорость вращения SVG?
Ответ: К сожалению, это сделать невозможно.
8.Можно ли сделать для SVG плавный старт и остановку для вращения?
Ответ: К сожалению, это сделать невозможно.
9.В примере с вращением SVG использовался в панели свойств выпадающий список с выбором Off и On. А можно вместо выпадающего списка сделать флаг (чекбокс)?
Ответ: К сожалению, импорт SVG не поддерживает тип BOOL и как следствие флаг (чекбокс).
Поддерживается только:
•Поле ввода: Type="STRING";
•Выбор цвета: Type="HMI.SolidColorType";
•Выпадающий список: Type="STRING" + элемент выпадающего списка Value в теге ParameterDef.
10. Поддерживается ли тег <script>, который отвечает за логику JavaScript в SVG?
Ответ: К сожалению, JavaScript (тег <script>) в SVG не поддерживается MasterSCADA 4D.
11. Можно после импорта привязать параметры к SVG?
Ответ: К сожалению, после импорта SVG нельзя напрямую привязать параметры. Для этого нужно создать отдельное окно (мнемосхему), в нем разместить только SVG, после чего привязки параметров заработают.
12. После импорта SVG я добавил в окно примитивы, но они не отображаются при исполнении проекта, что делать?
Ответ: К сожалению, после импорта в окно SVG нельзя добавлять другие визуальные элементы. Для этого нужно создать отдельное окно (мнемосхему), в нем разместить SVG и уже в данное окно разместить нужные элементы из палитры.
13. В SVG есть CSS-анимации/CSS-события, но они не работают, что делать?
Ответ: Одна из причин может быть связана со свойством Динамический SVG, которое нужно активировать.
14. Где подробнее можно прочитать про SVG и CSS?
Ответ:
SVG:
•SVG Tutorial от W3 schools https://www.w3schools.com/graphics/svg_intro.asp
•SVG — учебное руководство от MDN https://developer.mozilla.org/ru/docs/Web/SVG/Tutorial
CSS:
•CSS Tutorial от W3 schools https://www.w3schools.com/css/default.asp
•CSS: каскадные таблицы стилей https://developer.mozilla.org/ru/docs/Web/CSS
•CSS от Дока (практичные примеры и на русском) https://doka.guide/css/
15. Можно ли масштабировать SVG после импорта и создания динамизации?
Ответ: Да, можно. SVG-элемент после масштабирования не потеряет свою функциональность:
16. Ошибка импорта: There is an error in XML document (7, 5).
Ответ: Данная ошибка указывает номер строки (7) и номер символа (5), из-за которого произошла ошибка.
Вот что необходимо проверить:
1.Есть ли закрывающие теги:
Пример. Ниже в XML представлен список из двух элементов Value. Value находится в составе ParameterDef, но у него нет закрывающего тега </ParameterDef>:
<?xml version="1.0" encoding="utf-8"?>
<SvgDef xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" CreateCommonAvary="false">
<ParameterDefs>
<ParameterDef DisplayName="state" Type="STRING" ParamType="Attribute" ItemId="lever" Path="class">
<Value DisplayName="Off">Off</Value>
<Value DisplayName="On">On</Value>
</ParameterDefs>
</SvgDef>
Если добавить закрывающий тег, то ошибка пропадет:
<?xml version="1.0" encoding="utf-8"?>
<SvgDef xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" CreateCommonAvary="false">
<ParameterDefs>
<ParameterDef DisplayName="state" Type="STRING" ParamType="Attribute" ItemId="lever" Path="class">
<Value DisplayName="Off">Off</Value>
<Value DisplayName="On">On</Value>
</ParameterDef>
</ParameterDefs>
</SvgDef>
2.Нет ли лишних закрывающих тегов:
Пример. Ниже в XML представлен список из двух элементов Value, но ParameterDef закрывается два раза. Первый раз после Path="class" стоит символ слэш "/". Это означает, что ParameterDef завершен, но на самом деле это не так и ParameterDef продолжается в виде Value и потом закрывается </ParameterDef>. Чтобы избавиться от ошибки, нужно убрать символ слэш "/", который находится после Path="class":
<?xml version="1.0" encoding="utf-8"?>
<SvgDef xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" CreateCommonAvary="false">
<ParameterDefs>
<ParameterDef DisplayName="state" Type="STRING" ParamType="Attribute" ItemId="lever" Path="class"/>
<Value DisplayName="Off">Off</Value>
<Value DisplayName="On">On</Value>
</ParameterDef>
</ParameterDefs>
</SvgDef>
Теперь ошибка не проявляется:
<?xml version="1.0" encoding="utf-8"?>
<SvgDef xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" CreateCommonAvary="false">
<ParameterDefs>
<ParameterDef DisplayName="state" Type="STRING" ParamType="Attribute" ItemId="lever" Path="class">
<Value DisplayName="Off">Off</Value>
<Value DisplayName="On">On</Value>
</ParameterDef>
</ParameterDefs>
</SvgDef>