Все переводы

Введите имя сообщения для показа всех доступных переводов.

Сообщение

Найдено 2 перевода.

СообщениеТекущий текст
 ист. английский (en)Let's use an example to create an animation to change the text color from red to green and vice versa. Since text is filled in SVG, you will need to change the '''fill''' property.
[[Image: animation-style.png |350px|thumb|right| The '''animation''' property is set in the '''Value''' field of the '''Style''' parameter ]]
#Let's create a new SVG document in the Inlscape editor and add the Text element to it. 
#Let's save the file and open it in a text editor.
#Add a style block like this:
#:<syntaxhighlight lang="html"> 
 <style>
@keyframes changecolor {
   0% {fill:red}
   50% {fill:green}
   100% {fill:red}
   }
  </style>
</syntaxhighlight> 
#Save the SVG file and load it into the controller.
#In the dashboard editor, select the created test element and set its animation property in the following form:
#:<syntaxhighlight lang="javascript"> 
(val > 20) ? 'animation: changecolor 3s infinite linear;' : ' '
</syntaxhighlight> 
#:Since the element style can only be changed by a condition involving a value from the MQTT topic, we chose the '''CPU Temperature''' topic and set the condition '''>20'''. This means that the animation will only work when the value of the '''CPU Temperature''' topic is greater than 20. 
#Save the dashboard and go to the view.
== Add external links ==
[[Image : svg-hyperlink.png |300px|thumb|right| Creating a link in Inkscape ]]
 ист. русский (ru)Покажем на примере создание анимации для изменения цвета текста с красного на зеленый и обратно. Так как в SVG текст выполняется заливкой, то потребуется изменять свойство '''fill'''.
[[Image: animation-style.png |350px|thumb|right| Свойство '''animation''' задается в поле '''Value''' параметра '''Style''' ]]
#Создадим новый SVG-документ в редакторе Inlskape и добавим в него элемент Текст. 
#Сохраним файл и откроем его в текстовом редакторе.
#Добавим блок style следующего вида:
#:<syntaxhighlight lang="html">
  <style>
@keyframes changecolor {
   0% {fill:red}
   50% {fill:green}
   100% {fill:red}
   }
  </style>
</syntaxhighlight>
#Сохраним SVG-файл и загрузим его в контроллер.
#В редакторе дашбордов выберем созданным тестовый элемент и зададим ему свойство animation в следующем виде:
#:<syntaxhighlight lang="javascript">
(val > 20) ? 'animation: changecolor 3s infinite linear;' : ' '
</syntaxhighlight>
#:Так как изменение стиля элемента может происходить только по условию, в котором участвует значение из MQTT топика, то мы выбрали топик '''CPU Temperature''' и задали условие '''>20'''. Это значит, что анимация будет работать, только когда значение топика '''CPU Temperature''' больше 20. 
#Сохраним дашборд и перейдем в просмотр.
== Добавление внешних ссылок ==
[[Image: svg-hyperlink.png |300px|thumb|right| Создание ссылки в Inkscape ]]
Источник — https://wirenboard.com/wiki/Служебная:Переводы