Spec-Zone.ru › D3.js 7

d3-voronoi

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


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

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

Установка

Если вы используете NPM, npm install d3-voronoi. В противном случае скачайте последнюю версию. Вы также можете загрузить напрямую с d3js.org, как автономную библиотеку standalone library или как часть 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- координат и пустым значением extent.

voronoi(данные) Исходный код

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

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. Область обрезки (extent) необходима при использовании voronoi.polygons.

voronoi.size([size]) Исходный код

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

voronoi.extent([[0, 0], size]);
voronoi.polygons(данные) Исходный код

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

voronoi(data).polygons();

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

voronoi.triangles(данные) Исходный код

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

voronoi(data).triangles();

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

voronoi.links(данные) Исходный код

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

voronoi(data).links();

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

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

diagram Исходный код

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

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

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

diagram.polygons() Исходный код

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

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

diagram.triangles() Исходный код

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

diagram.links() Исходный код

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

  • source - исходная вершина, элемент из данных.
  • target - целевая вершина, элемент из данных.

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

diagram.find(x, y[, радиус]) Исходный код

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

См. пример Филиппа Ривьера bl.ocks.org/1b7ddbcd71454d685d1259781968aefc.

ячейка

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

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

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

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

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

  • left — сайт слева от ребра.
  • right — сайт справа от ребра; null для обрезаемого граничного ребра.

© 2010–2023 Michael Bostock
Licensed under the BSD License.
https://github.com/d3/d3-voronoi

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API