Википедия: справка по SVG

Понимание SVG

• Вопросы о формате SVG

Правильное использование SVG

• Когда использовать (или не использовать) SVG

То, что вы видите, это не то, что вы получаете

• Отсутствующие объекты в файлах
• Случайно заполненные поля на изображении
• Изображения неправильного размера
• Несоответствие шрифтов
• Другие странные и замечательные ошибки

Что-то новое

• Вопросы, для которых вы не можете найти лучшего места

Общие проблемы [ править ]

Тестирование на наличие проблем [ править ]

Следующие средства проверки SVG могут помочь вам обнаружить проблемы SVG перед загрузкой:

• Проверка WMF Labs SVG
• Программа проверки Commons SVG
• валидатор w3.org

flowRoot не появляется [ править ]

изображение, содержащее SVG1.2-допустимый flowRoot

Если появится черный ящик, прочтите c: User: JoKalliauer / RepairFlowRoot, как решить эту проблему, но не удаляйте эти объекты, поскольку они могут содержать текст. Обходные пути, которые можно использовать, - это либо не использовать плавный текст (с помощью текстового инструмента без создания текстового поля), либо преобразовать текст в обычный текст (с помощью текстового редактора или sed-comand , или с помощью Inkscape-GUI или с помощью a Inkscape-batch ), но для обводки текста с помощью «от объекта к пути», поскольку текст пути не рекомендуется и увеличивает размер файла.

проблемы с семейством шрифтов [ править ]

Резервные шрифты

Из-за ограничений авторского права MediaWiki не может использовать проприетарные шрифты, которые обычно встречаются в некоторых проприетарных операционных системах. Для распространения таких шрифтов, как Geneva, требуется лицензионная плата. rsvg не сможет найти такие шрифты, и текст не будет отображаться в визуализированном изображении. Есть три решения этой проблемы:

• Можно заменить шрифт, который есть в Википедии . Такой подход облегчает редактирование.
• Можно указать универсальный тип, font-familyтакой как «без засечек», «засечек» или «моноширинный», но это может привести к непоследовательному отображению. Лучше указать шрифт, доступный в Википедии (например, Liberation Sans), с резервными шрифтами, такими как:, font-family="Liberation Sans,Arial,Helvetica,sans-serif"в котором вы определяете список шрифтов с похожими шрифтами, которые содержат хотя бы один шрифт для каждой операционной системы, такой как Wikimedia (например, Liberation Sans), Windows (например, Arial), Linux (например, Liberation Sans), Mac (например, Helvetica).
• Поскольку локальный рендеринг должен быть как можно ближе к Википедии, он должен использовать локально тот же шрифт, что и в Википедии, если он доступен. Поэтому всегда сначала определяйте шрифт Викимедиа. Кроме того, в Викимедиа есть синонимы для замены шрифтов, такие как «Arial» вместо «Liberation Sans»; следовательно, font-family="Arial,DejaVu Sans"будет обработан "Liberation Sans", а не (как ожидалось) "DejaVu Sans". (Это потому, что «Liberation Sans» имеет тот же размер букв, что и «Arial» [совместимый с метрикой], поэтому вероятность нарушения потока текста меньше.)
• Преобразование текста в пути увеличивает размер файла и поэтому обычно не рекомендуется (за исключением текстовых логотипов и т. Д.).
• Сгруппируйте текст, создайте копию и преобразуйте копию в пути. Тогда либо:
  1. переместите исходный редактируемый текст без контура в отдельный редактируемый текстовый слой, который вы делаете прозрачным (предупреждение: это может быть удалено оптимизаторами SVG) или
  2. переместить исходный редактируемый текст без пути за пределы видимой области (пример: File: Essigsäuresynthesen.svg ).

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

Викимедиа использует шрифты по умолчанию и будет использовать Liberation Serif для Times New Roman и Liberation Sans для Arial . Для получения дополнительных сведений см. C: Help: SVG # fallback .

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

неправильное выравнивание букв на маленьком шрифте [ править ]

phab: T36947

Librsvg неточно вычисляет расстояния между буквами для шрифтов размером 20 пикселей и ниже.

Для текста вроде

<svg  viewBox = "0 0 100 100"  xmlns = "http://www.w3.org/2000/svg" >  <text  x = "20"  y = "30"  font-size = "5px" > exampletext < / текст> </svg>

вы можете заменить его:

<svg  viewBox = "0 0 1000 1000"  xmlns = "http://www.w3.org/2000/svg" >  <text  x = "200"  y = "300"  font-size = "50px" > exampletext < / текст> </svg>

или с

<svg  viewBox = "0 0 100 100"  xmlns = "http://www.w3.org/2000/svg" >  <g  transform = "scale (0.1)" > <text  x = "200"  y = "300 "  font-size = " 50px " > пример текста </text> </g> </svg>

Отсутствуют встроенные изображения JPEG [ править ]

Когда растровая графика встроена в SVG, она кодируется в данные base64 . Затем этим данным присваивается MIME-тип в элементе <image>. В случае встроенного JPEG типом MIME является «изображение / JPEG». Предыдущие версии Inkscape(и, возможно, другие редакторы) присвоили тип MIME «image / jpg». В то время как Inkscape и большинство веб-браузеров нормально отображают такое изображение SVG, программа MediaWiki, которая растрирует файл SVG, будет иметь с ним проблемы. Не распознавая MIME-тип «image / jpg», на месте предполагаемого изображения будет просто пустое место. Чтобы исправить это, откройте файл SVG в текстовом редакторе, найдите элемент <image>, найдите «image / jpg», измените его на «image / jpeg» и повторно сохраните. Справа - пример этой проблемы. Программа Commons SVG Checker ищет эту проблему; подробности см. в Commons: Commons: Commons SVG Checker / KnownBugs # Checks .

Хотя веб-браузеры справляются с тегами изображений без указания ширины и высоты , librsvg игнорирует такие изображения.

флаги дуги [ править ]

Если сегменты круга искажены, это часто происходит из-за уменьшения промежутков между дугой и флагами, подробности см. В phab: T217990 .

Дальнейшие вопросы [ править ]

Дополнительные проблемы можно найти в c: Librsvg_bugs или в Commons: Commons: Commons SVG Checker / KnownBugs , а примеры можно найти в c: Category: Pictures_demonstrating_a_librsvg_bug . Однако большинство проблем (для файлов размером <1 МБ) можно исправить с помощью https://svgworkaroundbot.toolforge.org/ (включите «запустить svgcleaner» и включите «запустить поиск» перед нажатием кнопки «преобразовать»), для получения более подробного списка проверьте c: Пользователь: SVGWorkaroundBot .

Обработка файлов [ править ]

MediaWiki (программа, из которой запускается Википедия) использует librsvg -library для растеризации всех своих файлов svg. Версия программы rsvg, установленная на вики, не всегда правильно растрирует SVG-файлы Inkscape или OpenOffice.org и не распознает некоторые форматы в SVG-файлах текстовых редакторов. Файловый менеджер GNOME Files или c: Commons: Commons_SVG_Checker полагается на librsvg, поэтому его можно использовать для проверки качества перед загрузкой SVG.

Визуализация файлов Inkscape [ править ]

Существует простое решение проблемы нехватки librsvg. Операция «Обводка по контуру», которую можно найти в меню «Меню»> «Путь» в Inkscape или через Ctrl+ Alt+ C, может быть применена ко всем объектам, которые не отображаются правильно. Чтобы файлы SVG оставались редактируемыми, это следует делать только с файлами, предназначенными для загрузки, и эти файлы могут быть впоследствии удалены.

По состоянию на февраль 2014 г. к объектам, которые необходимо изменить для правильного отображения с помощью librsvg, относятся:

• Линии со стрелками (стрелки нужно преобразовать)
• Текст, который был преобразован, например «Текст по контуру»
• Составные объекты, созданные с помощью инструментов двоичного пути (объединение, пересечение и т. Д.)

Визуализация файлов SVG OpenOffice.org [ править ]

Файлы OpenOffice.org SVG могут потребовать ручной модификации перед загрузкой в ​​Википедию. Для достижения этой цели:

• Измените все шрифты на шрифты, поддерживаемые Википедией, как упоминалось ранее. (Например, замените "Sans embedded" на "DejaVu Sans".)
• Добавьте «px» ко всем ссылкам на размер шрифта. (Например, измените «размер шрифта: 100» на «размер шрифта: 100 пикселей».)
• Удалите все дополнительные ссылки на координату x в tspanэлементах. (Например, изменить <tspan x="17583 17917 " y="10943">на <tspan x="17583" y="10943">.)
• [Не требуется для OO 2.3.0] Явно раскрасьте весь текст (например, черный), заменив соответствующие экземпляры «stroke: none; fill: none» на «stroke: none; fill: rgb (0,0,0)» (обратите внимание, что просто явное выделение текста черным цветом в OpenOffice 3.2.1, похоже, не работает).

NB: ширину линий векторной графики также может потребоваться явно указать в OpenOffice.org Draw.

Руководство по замене кода SVG (выполнение replace all с использованием регулярных выражений Nedit) [ править ]

Эта процедура экспорта SVG была протестирована с использованием OO 2.3.0 и OO 3.2.1 с простым кандидатом .odg.

Визуализация файлов SVG текстового редактора [ править ]

Файлы SVG, созданные с нуля в текстовом редакторе, могут использовать любой допустимый синтаксис SVG, если ваш браузер поддерживает данную версию спецификации SVG. Однако в Википедии SVG интерпретируются библиотекой librsvg для создания превью PNG с разными размерами изображений. Эта библиотека распознает только подмножество всего допустимого синтаксиса SVG и может отображать ваш SVG без многих функций. Чтобы обойти эти недостатки в библиотеке, существуют определенные параметры, которые необходимо отформатировать определенным образом или присвоить значение обходного пути, чтобы librsvg могла точно отображать представления вашего файла SVG.

<маска> параметр maskUnits = "userSpaceOnUse" [ редактировать ]

Библиотека librsvg неправильно интерпретирует значение "userSpaceOnUse"параметра maskUnits. Чтобы обойти эту проблему, замените maskUnits="userSpaceOnUse"на maskUnits="-10% -10% 120% 120%", и маска SVG будет правильно отображаться в Википедии.

параметр stroke-dasharray [ править ]

Librsvg библиотека не принимает в stroke-dasharrayпараметр со значениями , разделенных пробелами. Замените все пробелы запятыми, чтобы обойти эту проблему: например, stroke-dasharray="2 3 2 4"→stroke-dasharray="2,3,2,4"