С быстрым развитием отечественной экономики у людей возникают все более высокие требования к безопасности. Чтобы предотвратить возникновение следующих ситуаций, вам необходимо рассмотреть возможность установки системы безопасности: Предоставить доказательства и улики: На многих фабриках, в банках, при кражах или несчастных случаях соответствующие органы могут обнаружить случай на основе видеоинформации, что является очень важным зацепка. Также случаются споры или несчастные случаи, а обязанности соответствующего персонала можно легко узнать с помощью видеозаписи. Высокая стоимость гражданской противовоздушной обороны: в настоящее время, когда многие места думают о безопасности, они думают о найме охранников, которые стоят 800 долларов в месяц и работают в три смены в день. стоимость электронного оборудования безопасности не дешевая, и в течение нескольких лет потребность в замене электронного оборудования безопасности снижается. Поэтому стоимость гражданской ПВО сравнительно высока. Помощь гражданской противовоздушной обороны: в большинстве случаев очень сложно полностью полагаться на людей для обеспечения безопасности. Многие вещи требуют помощи электронного оборудования безопасности (например, мониторов и сигнализаций), чтобы быть более совершенным. Его необходимо использовать в особых случаях: в некоторых суровых условиях (высокая жара, холод, закрытость и т. д.) людям трудно ясно наблюдать невооруженным глазом, или окружающая среда просто не подходит для пребывания людей, поэтому необходимо использовать электронные средства безопасности. Сокрытие: используя электронное оборудование безопасности, обычные люди не будут чувствовать, что за ними все время следят, и это скрыто. Гарантия круглосуточной безопасности. Для обеспечения круглосуточной бесперебойной безопасности необходимо учитывать электронное оборудование. Удаленный мониторинг: С развитием компьютерных технологий и сетевых технологий стал возможен удаленный мониторинг и просмотр изображений из разных мест. Теперь многие руководители компаний могут наблюдать за ситуацией в любом филиале по всему миру в режиме реального времени через ИНТЕРНЕТ, что способствует удаленному мониторингу. своевременное понимание ситуации. Сохранение изображений. Развитие технологий цифрового видео позволяет сохранять изображения с помощью компьютерных цифровых запоминающих устройств, что позволяет сохранять их в течение более длительных периодов времени и с более четкими изображениями. Управление производством: менеджеры могут своевременно и интуитивно понимать ситуацию на передовой линии производства, что облегчает командование и управление.
Учитывая большой спрос на системы мониторинга в Китае, сегодня мы познакомим вас, как создать интерфейсную часть системы мониторинга.
http://www.hightopo.com/demo/metro/demo2.html Войдите на страницу и щелкните правой кнопкой мыши элемент проверки, чтобы просмотреть пример исходного кода.
Динамический эффект этого примера следующий:
Давайте сначала построим базовую сцену. В HT очень распространенным способом импорта внешних сцен во внутренние помещения является анализ файлов JSON. Одним из преимуществ использования файлов JSON для создания сцен является то, что их можно переработать. используя JSON. Далее HT будет использовать функцию ht.Default.xhrLoad для загрузки сцены JSON, а также использовать инкапсулированный в HT DataModel.deserialize(json) для ее десериализации и добавления десериализованного объекта в DataModel:
ht.Default.xhrLoad('demo2.json', function(text) { var json = ht.Default.parse(text); if(json.title) document.title = json.title;//Изменить заголовок файла JSON присваивается глобальной переменной title dataModel.deserialize(json);//Десериализовать GraphView.fitContent(true);//Увеличить топологию перевода, чтобы отобразить все графические элементы, то есть позволить отобразить все элементы});В HT при создании объекта типа данных ему автоматически присваивается внутренний атрибут id, который можно получить и установить с помощью data.getId() и data.setId(id). Значение id не может быть изменено. после добавления объекта данных в DataModel вы можете использовать dataModel.getDataById(id) для быстрого поиска объектов данных. Обычно рекомендуется, чтобы атрибут id автоматически присваивался HT. Уникальный идентификатор бизнес-значения пользователя может храниться в атрибуте тега. Функция Data#setTag(tag) допускает любое динамическое изменение значения тега. объект можно найти с помощью DataModel#getDataByTag(tag) и поддерживает удаление объектов Data с помощью DataModel#removeDataByTag(tag). Здесь мы устанавливаем атрибут tag объекта Data в JSON и получаем объект Data с помощью функции dataModel.getDataByTag(tag) в коде:
var fan1 = dataModel.getDataByTag('fan1');var fan2 = dataModel.getDataByTag('fan2');var camera1 = dataModel.getDataByTag('camera1');var camera2 = dataModel.getDataByTag('camera2');var camera3 = dataModel.getDataByTag('camera3');var redAlarm = dataModel.getDataByTag('redAlarm');var YellowAlarm = dataModel.getDataByTag('yellowAlarm');Я сделал элементы, соответствующие каждой метке на картинке ниже:
Затем мы устанавливаем объекты, которые необходимо повернуть и прошить. HT инкапсулирует функцию setRotation(rotation) для вращения. Получая текущий угол поворота объекта, мы добавляем определенный радиан на основе этого угла и регулярно вызываем его через setInterval. так что Вы можете вращать одну и ту же дугу в течение определенного интервала времени:
setInterval(function(){ var time = new Date().getTime(); var deltaTime = time - LastTime; var deltaRotation = deltaTime * Math.PI / 180 * 0,1; LastTime = time; fan1.setRotation(fan1.getRotation( ) + deltaRotation*3); fan2.setRotation(fan2.getRotation() + deltaRotation*3); camera1.setRotation(camera1.getRotation() + deltaRotation/3); camera2.setRotation(camera2.getRotation() + deltaRotation/3); camera3.setRotation(camera3.getRotation() + deltaRotation/3); if (время - StairTime > 500) { StairIndex--; (stayIndex < 0) { StairIndex = 8; } LastTime = Time; } for (var i = 0; i < 8; i++) {//Поскольку есть некоторые похожие элементы, имена тегов, которые мы устанавливаем, похожи, но они одинаковы. заменены на 1, 2, 3, поэтому мы используем цикл for, чтобы получить var color = StairIndex === i ? '#F6A623' : '#CFCFCF'; dataModel.getDataByTag('stage_1_' + i).s('shape.border.color', color); dataModel.getDataByTag('stage_2_' + i).s('shape.border.color', color } if); (new Date().getSeconds() % 2 === 1) { YellowAlarm.s('shape.background', null); redAlarm.s('shape.background', null); } else { YellowAlarm.s('shape.background', 'yellow'); redAlarm.s('shape.background', 'красный'); );HT также инкапсулирует функцию setStyle для установки стиля, который можно сократить до s. Для получения информации о конкретных стилях обратитесь к руководству по стилю HT для Web:
for (var i = 0; i < 8; i++) {//Поскольку есть некоторые похожие элементы, имена тегов, которые мы устанавливаем, аналогичны, но позже они меняются на 1, 2 и 3, поэтому мы используем цикл for чтобы получить var color = StairIndex === i ? '#F6A623': '#CFCFCF'; dataModel.getDataByTag('stage_1_' + i).s('shape.border.color', color); dataModel.getDataByTag('stage_2_' + i).s('shape.border.color', color);}Мы также выполняем контроль времени мигания сигнальной лампы. Если это четное количество секунд, цвет фона света устанавливается бесцветным. В противном случае, если это желтый сигнал тревоги, он устанавливается на желтый цвет. , он установлен на красный:
if (new Date().getSeconds() % 2 === 1) { YellowAlarm.s('shape.background', null); redAlarm.s('shape.background', null);}else { YellowAlarm.s ('shape.background', 'желтый'); redAlarm.s('shape.background', 'красный');}Весь пример решился так легко, так легко. . .
Подвести итогВыше приведено подробное объяснение примера мониторинга торгового центра на основе HTML5 Canvas, представленного редактором. Надеюсь, это будет вам полезно. Если у вас есть какие-либо вопросы, оставьте мне сообщение, и редактор ответит вам вовремя. . Я также хотел бы поблагодарить всех за поддержку сайта боевых искусств VeVb!