Функция indexof, slice, length

length — базовое свойство размера данных

В экосистеме Vega и Vega-Lite работа с данными часто опирается на JavaScript-выражения внутри трансформаций (transform), вычисляемых полей (calculate) и сигналов (signal). Одним из наиболее часто используемых свойств является length, применяемое к массивам и строкам.

В контексте данных Vega:

  • массивы данных (data.values)
  • результаты агрегаций
  • поля после lookup, filter, window
  • строки внутри записей

используют .length для определения размера структуры.

Массивы данных

{
  "data": {
    "values": [10, 20, 30, 40]
  },
  "transform": [
    {
      "calculate": "datum.values.length",
      "as": "count"
    }
  ]
}

Здесь length возвращает количество элементов массива, что особенно важно при динамической визуализации:

  • контроль пустых наборов данных
  • нормализация значений
  • вычисление долей

Строковые поля

datum.category.length

Используется для:

  • анализа длины категорий
  • фильтрации коротких или длинных меток
  • подготовки подписей осей

indexOf — поиск позиции элемента или подстроки

Метод indexOf применяется как к строкам, так и к массивам и возвращает индекс первого вхождения элемента или подстроки. В Vega-Lite и Vega это часто используется в выражениях фильтрации и условной логики.

Строки

datum.label.indexOf("sales")

Возвращает:

  • индекс начала подстроки
  • -1, если подстрока отсутствует

В Vega-Lite это используется для фильтрации:

{
  "transform": [
    {
      "filter": "datum.label.indexOf('A') >= 0"
    }
  ]
}

Такой фильтр оставляет только записи, где в label присутствует символ или слово "A".

Массивы

[1, 2, 3, 4].indexOf(3)

Возвращает 2, поскольку элемент 3 находится на второй позиции (индексация с нуля).

В визуализациях это полезно для:

  • поиска категорий в справочниках
  • проверки наличия значения
  • условного раскрашивания
{
  "transform": [
    {
      "calculate": "[\"A\", \"B\", \"C\"].indexOf(datum.group) >= 0",
      "as": "isAllowed"
    }
  ]
}

slice — извлечение части строки или массива

Метод slice используется для получения подмножества данных без изменения исходного массива или строки. В Vega и Vega-Lite он особенно важен при подготовке отображаемых значений.

Строки

datum.label.slice(0, 5)

Возвращает первые 5 символов строки.

Используется для:

  • обрезки длинных подписей
  • создания компактных меток
  • формирования легенд
{
  "transform": [
    {
      "calculate": "datum.label.slice(0, 10)",
      "as": "shortLabel"
    }
  ]
}

Массивы

[10, 20, 30, 40, 50].slice(1, 4)

Результат: [20, 30, 40]

В Vega-Lite это применяется для:

  • отображения части набора данных
  • построения оконных графиков
  • ограничения количества элементов
{
  "transform": [
    {
      "calculate": "datum.values.slice(0, 3)",
      "as": "topValues"
    }
  ]
}

Комбинирование length, indexOf, slice в выражениях Vega

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

Проверка и обрезка строк

datum.label.indexOf("error") >= 0
  ? datum.label.slice(0, 8)
  : datum.label

Логика:

  • если строка содержит "error" → обрезается
  • иначе остаётся без изменений

Анализ массивов с ограничением длины

datum.values.length > 10
  ? datum.values.slice(0, 10)
  : datum.values

Применение:

  • ограничение количества отображаемых точек
  • оптимизация производительности визуализаций
  • предотвращение перегрузки графиков

Использование в transform Vega-Lite

Vega-Lite активно применяет JavaScript-подобные выражения в трансформациях.

Фильтрация по позиции элемента

{
  "transform": [
    {
      "filter": "datum.name.indexOf('A') === 0"
    }
  ]
}

Логика:

  • indexOf('A') === 0 → строка начинается с буквы A

Формирование подмножеств данных

{
  "transform": [
    {
      "calculate": "datum.series.slice(0, 5)",
      "as": "preview"
    }
  ]
}

Используется для:

  • мини-графиков
  • превью данных
  • сокращённых визуализаций

Поведение в сигналах Vega

В чистой Vega (signals) данные методы также используются для динамических вычислений.

{
  "signals": [
    {
      "name": "labelLength",
      "update": "datum.label.length"
    }
  ]
}

или

{
  "name": "hasKey",
  "update": "datum.keys.indexOf('id')"
}

Особенности и ограничения в Vega Expression Language

Несмотря на сходство с JavaScript, выражения имеют особенности:

  • отсутствуют полноценные методы массива кроме базовых (slice, indexOf, length)
  • нет прототипного расширения
  • работа строго в контексте данных (datum)
  • вычисления оптимизированы под потоковую обработку

Практическая роль в визуализации данных

Комбинация indexOf, slice, length формирует основу лёгкой предобработки данных прямо в описании визуализации:

  • контроль объёма данных без внешнего кода
  • фильтрация строковых категорий
  • построение подмножеств данных
  • динамическая адаптация графиков

Эти операции позволяют переносить часть логики обработки данных из JavaScript-приложения непосредственно в декларативное описание Vega/Vega-Lite, снижая сложность внешнего слоя приложения и увеличивая переносимость спецификаций визуализации.

Оглавление