#javascript #html #svg #bounding-box
#javascript #HTML #svg #ограничивающий прямоугольник
Вопрос:
У меня есть javascript/nw.js проект с элементом svg (именуемым ниже svg-canvas), который служит холстом для рисования, и внутри него у меня есть другой подвижный элемент svg (именуемый ниже svg-encapsulate), предназначенный для инкапсуляции динамической коллекции объектов в ограниченном пространстве, размер которого поэтому обрезается с использованием свойств width и height. Таким образом, элементы, нарисованные внутри, которые выходят за его края, обрезаются, чтобы не казалось, что они выходят за пределы элемента. Однако, когда я делаю getBBox на svg-canvas, BBox возвращает размер, который также включает обрезанные (невидимые) элементы внутри svg-encapsulate, что, в свою очередь, запускает полосы прокрутки для всего элемента, даже если визуально (с точки зрения того, что видит пользователь) все подходит. Есть ли способ указать getBBox игнорировать обрезанные элементы svg-encapsulate, чтобы можно было поддерживать правильное поведение полосы прокрутки? Пожалуйста, обратите внимание, поскольку svg-encapsulate может быть изменен пользователем, перемещен и заполнен различными объектами, жестко заданные поля и обходные пути в этом случае не будут работать. Спасибо!
Комментарии:
1. удалите обрезанный элемент, установите ограничивающую рамку для остальных, добавьте обрезанный элемент обратно.
2. Спасибо, Роберт. Это лучший / единственный вариант?
3. Ну, может быть, вы могли бы поместить все, кроме обрезанного элемента, в группу и получить ограничивающую рамку группы, но это может не сработать с вашим порядком рендеринга.
4. Спасибо, Роберт. Я на самом деле сделал то, что вы предложили сначала, и это, кажется, работает просто отлично. Оказывает ли скрытие и отображение подобных объектов (блок отображения svg для отображения none и обратно) большое влияние на производительность? Пока из быстрых тестов это не похоже. Просто любопытно, может ли это быть проблемой с точки зрения производительности.