Создание мнемосхем.

Рисование SVG мнемосхем, в том числе и 3D стиле, выполняется в Inkscape (inkscape.org). В Inkscape нет поддержки анимации.

Далее в MnemoBinder выполняется:

  • создание анимаций,
  • задание привязок переменных,
  • тестирование мнемосхемы заданием переменных,
  • загрузка мнемосхемы в контроллер.

Анимация.

Выполяняется с помощью элементов animate и animateTransform из стандарта SVG. Описание элемента animate: Все об SVG анимации(habr.com) https://habr.com/ru/articles/450924/

Привязки переменных.

Привязки переменных выполняются путем добавления к родительскому элементу следующих bind элементов:


bind_di

Используется для изменения атрибута или свойства CSS родительского элемента, с помощью дискретной переменной.

  • attribute_name - имя атрибута или свойства CSS. Если = textContent,  то установка свойства textContent родительского элемента. (По умолчанию "display")
  • is_style - если true, то это свойство CSS, иначе - имя атрибута.
  • var_name - имя переменной
  • on_value - значение атрибута или свойства CSS  при var = 1
  • off_value - значение атрибута или свойства CSS  при var = 0

bind_animate_di

Используется для включения и выключения анимации - родительского элемента <animate> или <animateTransform>, с помощью дискретной переменной. При var = 1, анимация включается, а при var = 0 - выключается.

  • var_name - имя переменной
  • reverse = true - при var = 1, анимация выключается, а при var = 0 включается (по умолчанию false).
  • repeat_count - если задано, то значение копируется в атрибут repeatCount родительского элемента animate.

bind_text_ai

Используется для отражения значения аналоговой переменной в родительском элементе SVG типа <text>, <tspan> или <textPath>.

  • var_name - имя переменной
  • decimal_places - количество знаков после запятой

bind_range_ai

Используется для изменения атрибута или свойства CSS родительского элемента, с помощью аналоговой переменной с преобразованием.

  • attribute_name - имя атрибута или свойства CSS. Если = textContent,  то установка свойства textContent родительского элемента.
  • is_style - если true, то это свойство CSS, иначе - имя атрибута.
  • var_name - имя переменной
  • var_min_value - преобразование работает, если все числа 
  • var_max_value
  • attribute_min_value
  • attribute_max_value

bind_do

При клике по родительскому элементу, происходит отправка измененного с 0 до 1 или наоборот значения указанной дискретной переменной.

  • var_name - имя переменной
  • confirm - если true, то перед отправкой появиться диалог, запрашивающий подтверждение.

bind_ao

При клике по родительскому элементу, появляется диалог, для ввода нового значения аналоговой переменной, и после подтверждения, отправка измененного значения.

  • var_name - имя переменной
  • min_value - минимальное значение отправляемой переменной, если задано.
  • max_value - максимальное значение отправляемой переменной, если задано.

bind_system_name

Используется для отображения имени системы (напрмер П1), в родительском элементе <text>, <tspan> или <textPath>.