Расширьте возможности Weintek HMI с помощью JavaScript

Взаимный обмен данными необходим в любой области, особенно в промышленных системах, медицинском оборудовании, управлении энергопотреблением, автоматизации зданий и многих других областях. Тем не менее, промышленная и IT-сфера — это две разные среды с точки зрения данных. Интеграция данных HMI и сбор данных, как правило, являются проблемой для разработчиков систем. Программисты вынуждены строить различные мосты между этими мирами. Поэтому в этой статье мы объясним, как можно использовать JavaScript для расширения возможностей HMI Weintek, позволяя пользователям быстро создавать приложение HMI, адаптированное к индивидуальным потребностям.

• Что такое JavaScript?
• 4 шага, как использовать JavaScript с панелью Weintek HMI?
• Популярные решения кода JavaScript
• Каковы преимущества JavaScript?

Что такое JavaScript?

JavaScript  также часто называют JS в мире программирования. Это объектно-ориентированный язык программирования JavaScript ООP (Object-oriented programming), который используется при разработке интерактивных веб-страниц. В этой области JS является доминирующим языком, так как 98% существующих веб-сайтов в настоящее время создаются с помощью JavaScript.

Вначале домашние страницы были статичными, как открытие страницы в книге или журнале. Они представляли информацию в фиксированной форме. Раньше веб-сайты не были интерактивными, что сегодня является обычным явлением. С помощью JS можно реагировать на действия пользователя и изменять как контент, так и визуальное оформление.

4 шага, как использовать JavaScript с панелью Weintek HMI?

Разработчики Weintek позаботились о том, чтобы интеграция JavaScript в инструмент разработки визуализации Weintek EasyBuilderPro была удобной и понятной как для профессионалов JS, так и для разработчиков визуализации Weintek, которые только начинают работать с JavaScript.. 

1. Создание функции JavaScript. Чтобы создать функцию JS, мы начинаем с выбора JS-Object в разделе объектов EasyBuilderPro на панели визуализации Weintek. Когда вы открываете этот объект, появляется новое окно, где первым разделом является Config.
2. Декларация переменных. В этом разделе мы определяем переменные, которые будут использоваться в коде, и указываем, какие из них связаны с адресами регистров HMI или PLC. Для IT-разработчиков JS этот шаг может показаться странным, так как в JS такой шаг не нужен.
3. Source Code. Это самый важный шаг в JavaScript HMI. В этом окне написан JS-код, реализующий следующую функцию. Будь то простой печатный текст «Hello World» или получение данных для обработки с веб-сайта, в этом разделе реализовано все.
4. Написание кода функции JS. Далее осталось написать код нужной функции. Это можно сделать с нуля или открыв ссылку JS OBJECT SDK, просмотрев и получив подготовленные производителем описания функций и практически готовые коды функций. Работающая JS-функция будет готова с небольшой доработкой. Конечно, вы можете взять образец кода JavaScript с любого удобного ресурса. Все, что следует дальше, — это уже полет ваших идей для реализации в коде с помощью JavaScript HMI.

Популярные решения кода JavaScript

Поскольку JavaScript — древний язык программирования с очень мощными и полезными функциями, образцы кода легко доступны. Лучшие примеры JavaScript, которые стоит попробовать в 2023 году, можно найти в прикрепленных изображениях к этой статье или по этой ссылке. Здесь вы можете найти созданные производителем загружаемые демонстрационные проекты EasyBuilderPro, в которых уже есть работающий объект JavaScript, созданный для мгновенной оценки функциональности JS.  Кроме того, вы также найдете образцы кода наиболее популярных функций, которые можно скопировать в объект JS для запуска нужной функции и HMI Weintek. Обязательно стоит присмотреться к такой функции, как Web request, которая позволит получить данные с веб-страницы с HMI. Конечно, также функция SOAP client, которая будет полезна при инновационном сборе данных

Каковы преимущества JavaScript?

• Получайте данные с веб-сайтов с помощью Weintek HMI с помощью запросов - Web API;
• Интерактивные визуализации при вводе/выводе данных и контуров благодаря возможностям JS Widget
• Более легкий доступ IТ-специалистов к разработке визуализации HMI.

Другие статьи и видеоматериалы оWeintek HMI:

1. Новый и прочный 7" панель HMI от Weintek
2. ONLINE SESSION: How to use Codesys controller with Weintek HMI panel?
3. Беспроводная точка доступа в HMI Weintek серии cMT X с WiFi-модулем M02