d3-voronoi

Уведомление о устаревании: Рассмотрите возможность использования более новой библиотеки d3-delaunay вместо d3-voronoi. Основанная на Delaunator, d3-delaunay в 5-10 раз быстрее, чем d3-voronoi, для построения триангуляции Делоне или диаграммы Вороного, более устойчива численно, имеет встроенное рендеринг Canvas, позволяет обход графа Делоне и имеет множество других улучшений.

Этот модуль реализует алгоритм Стивенa Дж. Фортуна для вычисления диаграммы Вороного или триангуляции Делоне множества двумерных точек. Эта реализация в значительной степени основана на работе Рэймонда Хилла.

Диаграммы Вороного не только визуально привлекательны, но и являются практичными инструментами для взаимодействия, например, для увеличения целевой области точек на диаграмме рассеяния. См. “Strikeouts on the Rise” в The New York Times и эту многолинейную диаграмму для примеров; также см. статью Тови Гроссмана о маркерах-пузырьках для родственного метода. Диаграммы Вороного также могут использоваться для автоматизации позиционирования меток, а сетки Делоне полезны для вычисления смежности или группировки визуальных элементов.

Установка

Если вы используете NPM, npm install d3-voronoi. В противном случае загрузите последнюю версию. Вы также можете загрузить напрямую с d3js.org, либо как самостоятельную библиотеку, либо как часть D3 4.0. Поддерживаются среды AMD, CommonJS и vanilla. В vanilla экспортируется глобальная переменная d3:

<script src="https://d3js.org/d3-voronoi.v1.min.js"></script>
<script>

var voronoi = d3.voronoi();

</script>

Попробуйте d3-voronoi в вашем браузере.

Справочник по API

d3.voronoi() Источник

Создает новую компоновку Вороного с заданными по умолчанию акцессорами x- и y- и нулевым объёмом.

voronoi(data) Источник

Вычисляет диаграмму Вороного для указанных точек data.

voronoi.x([x]) Источник

Если x указан, устанавливает акцессор для координаты x. Если x не указан, возвращает текущий акцессор координаты x, по умолчанию:

function x(d) {
  return d[0];
}

voronoi.y([y]) Источник

Если y указан, устанавливает акцессор для координаты y. Если y не указан, возвращает текущий акцессор координаты y, по умолчанию:

function y(d) {
  return d[1];
}

voronoi.extent([extent]) Источник

Если extent указан, устанавливает область обрезки компоновки Вороного до заданных границ и возвращает компоновку. Границы extent задаются как массив [[x0, y0], [x1, y1]], где x0 — левая сторона области, y0 — верхняя, x1 — правая и y1 — нижняя. Если extent не указан, возвращает текущую область обрезки, которая по умолчанию равна null. Область обрезки необходима при использовании voronoi.polygons.

voronoi.size([size]) Источник

Псевдоним для voronoi.extent, где минимальные значения x и y области равны ⟨0,0⟩. Эквивалентно:

voronoi.extent([[0, 0], size]);

voronoi.polygons(data) Источник

Возвращает разреженный массив многоугольников, по одному для каждой уникальной входной точки в указанных точках data, соответствующих ячейкам в вычисленной диаграмме Вороного. Эквивалентно:

voronoi(data).polygons();

См. diagram.polygons для получения дополнительной информации. Примечание: требуется объём.

voronoi.triangles(data) Источник

Возвращает триангуляцию Делоне указанного массива data в виде массива треугольников. Каждый треугольник представляет собой массив из трех элементов из data. Эквивалентно:

voronoi(data).triangles();

См. diagram.triangles для получения дополнительной информации.

voronoi.links(data) Источник

Возвращает триангуляцию Делоне указанного массива data в виде массива связей. Каждая связь имеет source и target атрибуты, ссылающиеся на элементы в data. Эквивалентно:

voronoi(data).links();

См. diagram.links для получения дополнительной информации.

Диаграммы Вороного

diagram Источник

Вычисленная диаграмма Вороного, возвращаемая voronoi, имеет следующие свойства:

• edges - массив рёбер.
• cells - разреженный массив ячеек, по одному для каждой уникальной входной точки.

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

diagram.polygons() Источник

Возвращает разреженный массив многоугольников, об обрезанных до области, по одному для каждой ячейки (каждой уникальной входной точки) в диаграмме. Каждый многоугольник представлен как массив точек [x, y], где x и y — координаты точки, и поле data, ссылающееся на соответствующий элемент в data. Многоугольники открыты: они не содержат заключительной точки, дублирующей первую точку; например, треугольник является массивом из трех точек. Многоугольники также против часовой стрелки, предполагая, что начало координат ⟨0,0⟩ находится в верхнем левом углу.

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

diagram.triangles() Источник

Возвращает триангуляцию Делоне указанного массива data в виде массива треугольников. Каждый треугольник представляет собой массив из трех элементов из data. Поскольку триангуляция вычисляется как двойственная диаграмме Вороного, и диаграмма Вороного обрезается по области, возвращается подмножество триангуляции Делоне.

diagram.links() Источник

Возвращает триангуляцию Делоне указанного массива data в виде массива связей, по одной для каждого ребра в сетке. Каждая связь имеет следующие атрибуты:

• source - исходный узел, элемент в data.
• target - целевой узел, элемент в data.

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

diagram.find(x, y[, radius]) Источник

Возвращает ближайшую вершину к точке [x, y]. Если radius указан, учитываются только вершины в пределах radius расстояния.

См. bl.ocks.org/1b7ddbcd71454d685d1259781968aefc для примера.

cell

Каждая ячейка в диаграмме — это объект со следующими свойствами:

• site - вершина ячейки, соответствующей входной точке.
• halfedges - массив индексов в diagram.edges, представляющий многоугольник ячейки.

site

Каждая вершина в диаграмме — это массив [x, y] с двумя дополнительными свойствами:

• index - индекс вершины, соответствующий связанной входной точке.
• data - входные данные, соответствующие этой вершине.

edge

Каждое ребро в диаграмме — это массив [[x0, y0], [x1, y1]] с двумя дополнительными свойствами:

• left - вершина слева от ребра.
• right - вершина справа от ребра; null для обрезки ребра.