Бесконечная полоса прокрутки pixi
Есть ли способ разрешить прокрутку объекта холста за пределами содержимого. Пример: Холст, созданный с размерами 1000 * 1000. И включили панорамирование и масштабирование на холсте. Нарисуйте прямоугольник на холсте и переместите его с помощью мыши к краю границ (вверху, справа, внизу, влево), он должен прокрутить прямоугольник до конца холста.
Сейчас моя проблема в том, что я могу перетащить прямоугольник до границ браузера. Мне нужно, чтобы прямоугольник выходил за пределы содержимого, чтобы я мог использовать весь холст. Я могу панорамировать холст, чтобы перемещаться по браузеру.
Спасибо
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
PIXI - это просто механизм рендеринга, который рисует объекты на холсте. PIXI не имеет никаких механизмов для управления положением холста на веб-странице.
Вероятно, наиболее эффективный способ решения вашего варианта использования - это:
- Полностью поместите холст на экран (не расширяйте его за пределы экрана, никогда не панорамируйте и не масштабируйте холст как объект DOM).
- Создайте «контент» PIXI.Container, который содержит ваш контент (стадия -> контент -> прямоугольники), и измените положение контейнера «контент» по мере необходимости для прокрутки контента внутри холста.
Если вы настаиваете на манипулировании положением холста, вы можете позиционировать его абсолютно на веб-странице и манипулировать им как объектом DOM.
Какой бы подход вы ни выбрали, вам нужно будет обнаружить, что перетаскивание приближается к краю, и выполнить панорамирование вручную в вашем коде. Насколько мне известно, в PIXI нет ничего, что могло бы облегчить это.
вот рабочий пример для него jsfiddle.net/gsknbabu/sD8Tt/412