#javascript #d3.js #svg
#javascript #d3.js #svg
Вопрос:
На данный момент я генерирую точки Вороного d3, выполняю релаксации, визуализирую полигоны и применяю svg-pan-zoom ко всему этому. Я хочу создать неопределенное панорамирование для этой карты Вороного. Он будет использоваться как 2D-карта, представляющая сферу (мир).
Я хочу создать эту иллюзию, обернув диаграмму Вороного как по горизонтали, так и по вертикали. Я знаю, что создание реальной 3D-сферы из случайных ячеек Вороного было бы вариантом, но сейчас я ищу что-то более простое.
Как бы вы подошли к такой проблеме? Ниже приведены несколько скриншотов, чтобы лучше представить, о чем я спрашиваю.
Вместо того, чтобы обрезать его при слишком большом панорамировании, я бы хотел иметь возможность просто заставить правую часть диаграммы Вороного каким-то образом плавно приклеиваться к левой стороне. Вроде как в старых играх Pacman.
Я ищу некоторые подсказки, математические правила, которые могли бы помочь, или некоторые приемы для d3 / d3.voronoi / svg-pan-zoom.
Комментарии:
1. 1. Плитки, которые находятся «на границе», всегда будут водяными плитками, поэтому нет необходимости в фактической проверке данных. Это может быть хакерским, если оно будет выглядеть бесшовным.
2. Почему бы не изменить код voronoi, чтобы рассматривать координаты обтекания как соседей. Или, в качестве альтернативы, добавьте рамку вокруг всех четырех краев вашего исходного прямоугольника и зеркально отразите точки напротив противоположных сторон. Запустите алгоритм Вороного. Затем, если вы обрезаете SVG до исходного размера, он должен быть бесшовным.
3. Это несколько отличных советов, спасибо. Есть ли у вас какие-либо математические / программные подсказки для того, чтобы заставить эти точки на ребрах вести себя как соседи?
4. Это будет зависеть от того, какой алгоритм вы используете. Но вам нужно будет помнить, что для каждой точки (x, y) в вашем наборе есть восемь других ее клонов на соседних плитках (x-w, y-h), (x, y-h), (x w, y-h), (x-w, y), (x w, y), (x-w, y h), (x, y h), (x w, y h),