Диаграммы и карты

Создание карты

Создание карты и статических объектов на ней.

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

Создайте сущность (см. п. Создание таблицы, Создание представления, Создание проекции). В сущности добавьте колонки с координатами: широта и долгота (см. п. Добавление колонки).
Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
       {
           "longitude_property": "x",
           "latitude_property": "y"
       }
```
Вместо x, y введите:
- вместо “x” - поле, содержащее долготу;
- вместо “y” - поле, содержащее широту.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

Создание диаграммы

Создайте сущность (см. п. Создание таблицы, Создание представления, Создание проекции). В сущности добавьте колонки с координатами: широта и долгота (см. п. Добавление колонки).
Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
      {
          "chartType": "a"
      }
```
Вместо “a” укажите тип диаграммы: “bar” (столбчатая), “pie”(круговая), “line” (линейная), “area” (аддитивная), “radar” (радар), “doughnut” (пончик) и др. Подробнее в Типы диаграмм.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

В качестве заголовка диаграммы по умолчанию используется заголовок сущности.

Настройка диаграммы

Для создаваемых диаграмм задается множество параметров. Если параметр не указан, то используется его значение по умолчанию.

Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
      {
          "chartType": "doughnut",
          "chartOptions": {
              "plugins": {
                  "labels": {
                      "render": "value",
                      "fontSize": "14",
                      "fontColor": "#fff"
                  }
              }
          },
          "s-property": "sensor_id",
      }
```
Параметр “render” указывает формат отображения значений диаграммы. В данном случае в значении “value” - указывает на отображение числового значения.

Параметр “fontSize” указывает размер шрифта значений диаграммы. В данном случае размер 14 пикселей.

Параметр “fontColor” указывает цвет шрифта значений диаграммы. В данном случае “#fff” (HEX) - “красный”.

Параметр “s-property” содержит столбец, данные которого будут использоваться в качестве легенды. В данном случае “sensor_id”.

Подробнее о параметрах и их возможных значениях на сайте с документацией Chart.js. Примеры использования на сайте emn178.github.io.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

Создание графика

Создайте сущность (см. п. Создание таблицы, Создание представления, Создание проекции). В сущности добавьте колонки с координатами: широта и долгота (см. п. Добавление колонки).
Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
      {
       "chartType": "scatter",
           "x-property": "x", 
           "y-properties": [ "y1", "y2" ]
       }
```
Вместо “x” укажите наименование столбца (не заголовок!), содержащего значения оси абсцисс, а вместо “y1” и “y2” укажите наименования столбцов, содержащих значения оси ординат. Подробнее в Chart.js.

Значений оси ординат может быть не менее одного.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

В качестве заголовка графика по умолчанию используется заголовок сущности.

Настройка графика

Добавление легенды в график

Легенда содержит условные знаки и их обозначения на графике.

Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
      {
       ...
      "s-property": "s"
       }
```
Вместо “s” укажите наименование столбца, содержащего значения, которые необходимо использовать в качестве определения обозначений графика.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

Цветовая палитра графика

Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
      {
       ...
      "graphColors": [
         "color1",
         "color2"]
       }
```
Вместо “color1” и “color2” укажите цвета, например “green”, “yellow” или “#008000”, “#FFFF00” в HEX (шестнадцатиричная система). Количество цветов необходимо указать по количеству графиков.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

Переключатель графиков

Для отображения нескольких графиков используется переключатель графиков: вкладки с графиками.

Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
      {
       ...
      "graphGroups": [
                   {
            "title": "graph1",
            "items": [
              "column1"
            ]
          },
          {
            "title": "graph2",
            "items": [
              "column2"
            ]
          }
        ]
       }
```
Вместо “graph1” и “graph2” укажите наименования вкладок для графиков. Вкладок может быть минимум две.

Вместо “column1” и “column2” укажите наименования столбцов, которые будут задавать значения по оси ординат. Количество столбцов должно соответствовать количеству вкладок.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

Группировка данных графика

Данные сущности можно делить на группы, используя значения одного из столбцов.

Перейдите [Выбранная сущность] > кнопка [More] > кнопка [Setup…].
В детальной форме нажмите кнопку [Edit] для перехода в режим редактирования.
Введите в поле “Additional parameters”:
```
      {
       ...
       "g-property": "g"
       }
```
Вместо “g” укажите наименование столбца, по значениям которого будет осуществляться группировка.

Этот параметр, в отличие от предыдущих, применяется совместно с переключателем графиков. Таким образом, графики из разных групп отображаются в разных вкладках переключателя.
Нажмите кнопку [Save] для сохранения изменений или кнопку [Cancel] для выхода из режима редактирования без сохранения.

Пример

{
  "chartType": "scatter",
  "x-property": "date",
  "y-properties": [
    "temperature"
  ],
  "s-property": "date",
  "graphColors": [
    "green",
    "#FFFF00"
  ],
  "g-property": "group",
  "graphGroups": [
    {
      "title": "Дневная температура",
      "items": [
        "temperature"
      ]
    },
    {
      "title": "Ночная температура",
      "items": [
        "temperature_night"
      ]
    }
  ]
}