Можно ли в css выключать слои svg?

Question

[Anton]

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

Подскажите пожалуйста, возможно ли нарисовать в svg готовую карту со всеми вариантами зданий (затем выключить их отображение) и потом уже в коде страницы с помощью css включать и выключать нужные элементы? И если это возможно то оптимально ли, возможно это будет очень долго в плане загрузки? (так как сайт должен работать и на смартфонах и на пк)

Или возможно взять за основу одну svg - фон, на который потом по координатам подгружать разные заготовленные svg здания? Возможен ли этот вариант, может быть он лучше?

Прошу прощения если вопрос слишком глупый, с svg до этого ни разу не сталкивался, сейчас только начинаю изучать этот вопрос.

Answer 1

[lagudal]

svg прекрасно стилизуется с css, главное условие, вставлять код а не картинки.
Впрочем, ваш второй вариант для вашей задачи возможно более предпочтинельный, если вам надо только показать/скрыть здания либо какие-то элементы(типа этажей).
Надо понимать задачу целиком, чтобы выбрать верное решение.
Возможно, у вас это что то вроде интерактивного выбора квартир в новостройках? Тогда посмотрите, как у других сделано, таких сайтов уже тьма в сети.

Comments

[Anton]

Благодарю!
Покопался в коде svg картина чуть прояснилась )

Это должна быть изометрическая карта со зданиями, у каждого пользователя эти здания будут отличаться в зависимости от параметров этого пользователя, к примеру грубо говоря - его уровень выше, здания лучше и наоборот хуже.

Пока думаю сделать по простому, взять одну svg заготовку - карту с "ландшафтом", в визуальном редакторе создать заготовки разных зданий, скопировать их код и потом просто по надобности подставлять те или иные коды зданий в заготовку svg.