Раскрасить элемент

1

У элемента 12 состояний, каждому назначен свой цвет.

изображение
изображение543×321 10.1 KB

значение цвета текстом передаётся верно, но элемент не окрашивается.
изображение
изображение612×202 2.56 KB

что можно сделать?
на всякий случай приложу svg файл (выгрузил с контроллера)
Тест
Тест794×1123 6.55 KB

3

Добрый день!

Прошу сообщить, какой у вас релиз? Пробую развернуть ваш svg файл.

4

wb-2602

5

А приведите, пожалуйста, еще свое правило с цветами. Или это у вас реальное устройство?

6 

defineVirtualDevice(deviceName, {
  title: { en: "DIP-01", ru: "ДИП-34А-01" },
  cells: {
    value: {
      title: { en: "Value", ru: "Значение" },
      type: "number",
      value: 0,
      readonly: true
    },
    state: {
      title: { en: "State", ru: "Состояние" },
      type: "value",
      value: 0,
      readonly: true
    },
    state_text: {
      title: { en: "State text", ru: "Текст состояния" },
      type: "text",
      value: "",
      readonly: true
    },
    colors_text: {
      title: { en: "Color text", ru: "Текст цвета" },
      type: "text",
      value: "",
      readonly: true
    }

  }
});

function getDipStateText(code) {
  switch (Number(code)) {
    case 24:  return "Взят";
    case 37:  return "Пожар";
    case 40:  return "Пожар 2";
    case 41:  return "Неисправность";
    case 43:  return "Предупреждение";
    case 44:  return "Внимание";
    case 109: return "Снят";
    case 110: return "Сброс тревоги";
    case 112: return "Отключен";
    case 186: return "Замена батареи";
    case 187: return "Нет связи";
    case 202: return "Неисправность батареи";
    case 204: return "Требуется обслуживание";
    case 211: return "Батарея разряжена";
    case 212: return "Резервная батарея разряжена";
    case 241: return "Раздел взят";
    case 242: return "Раздел снят";
    default:  return "Неизвестно (" + code + ")";
  }
}

function getDipColorText(code) {
  switch (Number(code)) {
    case 24:  return "green";
    case 37:  return "red";
    case 40:  return "red";
    case 41:  return "yellow";
    case 43:  return "purple";
    case 44:  return "purple";
    case 109: return "blue";
    case 110: return "yellow";
    case 112: return "black";
    case 186: return "yellow";
    case 187: return "black";
    case 202: return "yellow";
    case 204: return "yellow";
    case 211: return "yellow";
    case 212: return "yellow";
    case 241: return "green";
    case 242: return "blue";
    default:  return "grey";
  }
}

defineRule("DIP_1", {
  whenChanged: "C2000PP/ДИП.01",
  then: function (newValue, devName, cellName) {
    log.info("newValue:{}, devName:{}, cellName:{} ", newValue, devName, cellName );

    dev["DIP_01/value"] = Number(newValue);
    dev["DIP_01/state"] = Number(newValue);
    dev["DIP_01/state_text"] = getDipStateText(newValue);
    dev["DIP_01/colors_text"] = getDipColorText(newValue);
  }
});
7

можно посмотреть мои темы, там вся история


defineVirtualDevice(deviceName, {
  title: { en: "DIP-01", ru: "ДИП-34А-01" },
  cells: {
    value: {
      title: { en: "Value", ru: "Значение" },
      type: "number",
      value: 0,
      readonly: true
    },
    state: {
      title: { en: "State", ru: "Состояние" },
      type: "value",
      value: 0,
      readonly: true
    },
    state_text: {
      title: { en: "State text", ru: "Текст состояния" },
      type: "text",
      value: "",
      readonly: true
    },
    colors_text: {
      title: { en: "Color text", ru: "Текст цвета" },
      type: "text",
      value: "",
      readonly: true
    }

  }
});

function getDipStateText(code) {
  switch (Number(code)) {
    case 24:  return "Взят";
    case 37:  return "Пожар";
    case 40:  return "Пожар 2";
    case 41:  return "Неисправность";
    case 43:  return "Предупреждение";
    case 44:  return "Внимание";
    case 109: return "Снят";
    case 110: return "Сброс тревоги";
    case 112: return "Отключен";
    case 186: return "Замена батареи";
    case 187: return "Нет связи";
    case 202: return "Неисправность батареи";
    case 204: return "Требуется обслуживание";
    case 211: return "Батарея разряжена";
    case 212: return "Резервная батарея разряжена";
    case 241: return "Раздел взят";
    case 242: return "Раздел снят";
    default:  return "Неизвестно (" + code + ")";
  }
}

function getDipColorText(code) {
  switch (Number(code)) {
    case 24:  return "green";
    case 37:  return "red";
    case 40:  return "red";
    case 41:  return "yellow";
    case 43:  return "purple";
    case 44:  return "purple";
    case 109: return "blue";
    case 110: return "yellow";
    case 112: return "black";
    case 186: return "yellow";
    case 187: return "black";
    case 202: return "yellow";
    case 204: return "yellow";
    case 211: return "yellow";
    case 212: return "yellow";
    case 241: return "green";
    case 242: return "blue";
    default:  return "grey";
  }
}

defineRule("DIP_1", {
  whenChanged: "C2000PP/ДИП.01",
  then: function (newValue, devName, cellName) {
    log.info("newValue:{}, devName:{}, cellName:{} ", newValue, devName, cellName );

    dev["DIP_01/value"] = Number(newValue);
    dev["DIP_01/state"] = Number(newValue);
    dev["DIP_01/state_text"] = getDipStateText(newValue);
    dev["DIP_01/colors_text"] = getDipColorText(newValue);
  }
});
8

Добрый день!

Попробовал пример из нашей документации присвоить элементу цвет, хранящийся в топике на вашем svg файле ;fill: ${val} работает – окрашивается в цвет RGB.

У вас работает этот пример?

9

Скорее всего речь о проблеме окрашивания текста, а не объектов.
В текущей реализации цвет в svg файле имеет приоритет над цветом, передаваемом из настроек hmi. Это на моей памяти несколько раз обсуждалось. Обещали это исправить.
Текущее решение - удалять назначение цвета текста руками в svg файле, а потом уже его импортировать. Тогда смена цвета текста работает.

10

я пытаюсь закрасить линию.

11

Какую именно линию вы хотите закрасить? Пожалуйста, уточните детали. Если возможно, пришлите скринкаст с пояснением: что именно вы делаете и какого результата ожидаете.

На другом элементе у вас правило отрабатывает?

12

вот эти элементы пытаюсь окрасить

изображение
изображение1324×503 27.9 KB

изображение
изображение1314×447 25.5 KB

результат
изображение
изображение629×422 4.52 KB

13

У меня они окрашиваются правилом из примера, который приведен в документации.

image
image634×427 7.64 KB

Повторюсь:

Без подробного описания проблемы мы не сможем вам помочь. Пожалуйста, цените своё и наше время.

Необходимо выяснить: у вас не закрашивается элемент или ваше правило не отрабатывает в принципе.

14

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

    title: {'en': 'HMI Demo', 'ru': 'Демопанель'} ,
    cells: {
      rgb_css: {
        title: {'en': 'RGB CSS', 'ru': 'RGB CSS'},
        type: "text",
        value: "",
      },
      rgb_pallete: {
        title: {'en': 'RGB Palette', 'ru': 'RGB Палитра'},
        type: "text",
        value: "",
      },      
    }
});

defineRule({
  whenChanged: "DIP_01/colors_text",
  then: function (newValue, devName, cellName) {
	dev["hmi-demo"]["rgb_pallete"] = newValue;
    dev["hmi-demo"]["rgb_css"] = convertPalleteToRgbCSS(newValue);
  }
});

function convertPalleteToRgbCSS(rgb_pallete){
  var colorComponents = rgb_pallete.split(';') // получаем компоненты цвета r, g, b
  
  return "rgb("+colorComponents.join(',')+")"; // формируем строку для записи в css
}

так тоже не работает.

15

Заработало, в поле значение надо было подставить ';fill: '+val а не ‘;fill: ${val}’