Table

Шаблон расположения Table позволяет размещать графики в заранее заданных ячейках таблицы. Ячейки можно объединять по строкам и столбцам.

Table

Использование

Объявление шаблона table

{
  "data": { ... },
  "view": {
    "canvas": {
      "items": [
        {
          "type": "table",                       // Объявление шаблона table
          "rows": [{ "height": "15 %" }],        // Высота каждой строки
          "columns": [{ "width": "25 %" }],      // Ширина каждого столбца
          "rowsSpace": "5 px",                   // Вертикальный отступ между строками
          "columnsSpace": "20 px",               // Горизонтальный отступ между столбцами
          "mergedCells": [...],                  // Объединённые ячейки
          "items": [...]                         // Графики, размещаемые в ячейках
        }
      ]
    }
  }
}
Название Тип Значение поумолчанию Описание
rows string ОБЯЗАТЕЛЬНОЕ Задаёт высоту строк, где каждый объект — отдельная строка.
columns string ОБЯЗАТЕЛЬНОЕ Задаёт ширину столбцов, где каждый объект — отдельный столбец.
rowsSpace number 0 px Вертикальный отступ между строками.
columnSpace number 0 px Горизонтальный отступ между столбцами.
mergedCells Array<object> Список объединённых ячеек.
items Array<object> Графики, размещаемые в ячейках.

Объединение ячеек

{
  ...,
    "mergedCells": [
      {
        "rowBegin": 0,       // Индекс начальной строки
        "rowEnd": 1,         // Индекс последней строки
        "columnBegin": 2,    // Индекс начального столбца
        "columnEnd": 2       // Индекс последнего столбца
      }
    ]
}
Название Тип Значение поумолчанию Описание
rowBegin string Индекс начальной строки.
rowEnd string Индекс последней строки.
columnBegin string Индекс начального столбца.
columnEnd string Индекс последнего столбца.

Описание графиков

{
  ...,
  "items": [
    [
      { "type": "chart", ... },
      { "type": "chart", ... },
      { "type": "chart", ... }
    ],
    [
      { "type": "chart", ... },
      { "type": "chart", ... }
    ]
  ]
}

Каждая строка таблицы задаётся отдельным массивом

Количество графиков в строке должно совпадать с числом столбцов

Если элементов меньше — соответствующие ячейки останутся пустыми

Пример

Код примера

Доступ к содержимому по ссылке возможен только для авторизованных пользователей GitHub, являющихся участниками организации IncartDev
Ссылка на ресурс

Предыдущая
Следующая