Inkscape - при сохранении в формате SVG и загрузке в Интернет ничего не отображается

Я новичок в Inkscape, и у меня возникают проблемы с экспортом файла для использования на веб-странице. Я создал логотип и экспортировал его в формате SVG, выполнив следующие действия:

Файл -> Сохранить как -> Оптимизированный SVG (настройки по умолчанию).

Имя файла — logo.svg, поэтому в моем HTML для моего веб-сайта я просто сделал , но проблема в том, что ничего не появляется. Если я заменю logo.svg на facebook.svg (что-то, что я получил в Интернете), то это будет отлично видно, поэтому моя проблема заключается в неправильном экспорте.

Логотип состоит из двух текстовых объектов и объекта с многоточием, используемого для придания блеска части текста, и больше ничего. Что я мог сделать не так при сохранении?

Любая помощь приветствуется.

Вы могли бы нарисовать за границей. Что произойдет, если вы откроете SVG прямо в браузере (адресная панель: file:///home/user318/foo/bar/logo.svg)? Какой браузер? Открыть только SVG из онлайн-каталога ( mywebspace/foo/bar/logo.svg )?
Можете ли вы опубликовать URL вашей веб-страницы?

Ответы (1)

Не видя SVG, сложно сказать, но вот некоторые возможности:

Вы рисовали за пределами области рисования?

Откройте файл и нажмите Ctrl+ Shift+ D. Есть возможность изменить размер по рисунку.

Вы использовали <flowRoot>?

Есть два способа добавить текст.

  1. Нажмите один раз, затем начните печатать (это создаст <svg:text>)
  2. Нажмите и перетащите, затем введите (это создаст<flowRoot>

В то время как последний позволяет вам создать текстовое поле, которое переносится, это не стандартная функция SVG, и многие браузеры ее игнорируют.

Чтобы исправить это, выберите объект. Затем в меню « Текст » нажмите « Преобразовать в текст » .

Преобразовать текст в путь

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

Решение состоит в том, чтобы преобразовать текст в путь. Выберите объект. Затем в меню « Путь » выберите « Объект в путь» .

Вы больше не сможете редактировать текст, но он будет отображаться браузерами именно так, как вы его видите. Если вы воспользуетесь инструментом «Узел F2» и наведете курсор на буквы, вы увидите, что все они теперь являются отдельными путями.

Бонус: чаевые

Если у вас есть изображение, в котором вы, возможно, захотите отредактировать текст позже, но также хотите преобразовать его в пути, вам не нужно сохранять два отдельных файла (хотя это тоже работает). Что я иногда делаю, так это сохраняю текст в отдельном слое. Когда я хочу преобразовать все в пути, я дублирую текстовый слой, преобразую его, а затем прячу оригинал. Таким образом, я все еще могу сохранить текст, если мне нужно будет отредактировать его позже.