svg, сгенерированный Visual Paradigm, отображается в inkscape иначе, чем в браузерах.

Когда я создаю диаграммы в Visual Paradigm и экспортирую их в формат SVG, они правильно отображаются в браузерах, но неправильно отображаются в таких программах, как Inkscape.

Например, это рендеринг в браузере (Chrome или IE):

введите здесь описание изображения

а вот как тот же файл отображается в Inkscape или других конвертерах PDF:

введите здесь описание изображения

Вот svg-файл:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.0//EN'
          'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'>
<svg fill-opacity="0" xmlns:xlink="http://www.w3.org/1999/xlink" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="rgb(0,0,0)" stroke-linecap="square" width="686" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="0" fill="rgb(0,0,0)" stroke-dasharray="none" font-weight="normal" stroke-width="1" height="699" xmlns="http://www.w3.org/2000/svg" font-family="&apos;Dialog&apos;" font-style="normal" stroke-linejoin="miter" font-size="12" stroke-dashoffset="0" image-rendering="auto"
><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"
  /><g
  ><defs id="defs1"
    ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath1"
      ><path d="M-7 -7 L691 -7 L691 704 L-7 704 L-7 -7 Z"
      /></clipPath
      ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath2"
      ><path d="M0 0 L0 21 L134 21 L134 0 Z"
      /></clipPath
      ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath3"
      ><path d="M-7 -7 L225 -7 L225 63 L-7 63 L-7 -7 Z"
      /></clipPath
      ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath4"
      ><path d="M0 0 L0 52 L214 52 L214 0 Z"
      /></clipPath
    ></defs
    ><g fill="white" text-rendering="geometricPrecision" fill-opacity="1" stroke-opacity="1" stroke="white"
    ><rect x="0" width="686" height="699" y="0" stroke="none"
    /></g
    ><g stroke-linecap="butt" font-size="11" transform="translate(2,2)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" font-family="sans-serif" stroke-linejoin="round" stroke="black" font-weight="bold" stroke-opacity="1" stroke-miterlimit="0"
    ><rect x="1" y="1" clip-path="url(#clipPath1)" fill="none" width="678" rx="15" ry="15" height="691"
    /></g
    ><g font-size="11" transform="translate(2,2)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" font-family="sans-serif" stroke="black" font-weight="bold" stroke-opacity="1"
    ><text x="10" xml:space="preserve" y="18" clip-path="url(#clipPath2)" stroke="none"
      >Testing Some Diagram</text
    ></g
    ><g stroke-linecap="butt" font-size="11" transform="translate(74,33)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" font-family="sans-serif" stroke-linejoin="round" stroke="black" stroke-opacity="1" stroke-miterlimit="0"
    ><rect x="0" y="0" clip-path="url(#clipPath3)" fill="none" width="214" rx="15" ry="15" height="52"
    /></g
    ><g font-size="11" transform="translate(74,33)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" font-family="sans-serif" stroke="black" stroke-opacity="1"
    ><text x="9" xml:space="preserve" y="15" clip-path="url(#clipPath4)" stroke="none"
      >Lorem ipsum dolor sit amet, consectetur</text
      ><text x="6" xml:space="preserve" y="30" clip-path="url(#clipPath4)" stroke="none"
      >adipiscing elit. In congue lorem orci, vitae</text
      ><text x="84" xml:space="preserve" y="45" clip-path="url(#clipPath4)" stroke="none"
      >mollis mi.</text
    ></g
    ><g fill="rgb(120,120,120)" text-rendering="geometricPrecision" fill-opacity="1" font-size="10" stroke-opacity="1" stroke="rgb(120,120,120)"
    ><text x="423" xml:space="preserve" y="686" stroke="none"
      >Powered ByVisual Paradigm Community Edition</text
      ><image font-size="12" x="662" y="672" fill="white" width="20" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAB6ElEQVR42mNgIAKc
MTZuPm1i0kWMWkYiDKsBUs1QbguIMDl7thaXeiYGKgNGAi5jQHIdQtP//63G587V
YNPHTMCbTlCh5f8ZGa8BbdeBmMholyYlxTLr+fP9BA1ECzMQWAPEsQIfP278ycGh
DWTfAGJNIMZqKCMuw4DeOgiijc6dcwIq+gdirwoNBTtA+e7dvUAX28O8D1VXC1T3
n+qRwgJ1WS56BABdoAKWMzV1Yjh9eg+IrXTvniVUTgFJXTWIPmts/IXh7NkOFqiz
90DlTwMVmELZ0mC5f/9WAy0M+svMfInh79/NUDkBJEddhJqxDSMMgbnBASjRCWSa
ofnkHRBHArExlN8Gpc8BHVABYpieObMbHstAF+gCY0wcaPomIBfkih9ArIhkICcQ
ewExKPs9AuIHQMwKjbgmoL6gFBmZg7OfPXtGm0jh/PHjJoj+zsExG0iBkk4nkhpY
4hYG4u0gxj8mJlumf/8+Ab07AcjtAYkJvn9/CWvWO2tkVA9U2ABkdkCFzJAMPQGN
gONANYUgNcCCohJvTgGm/IOp0tKMjBCX2oDSM1TqOdCgvUDx+0DDSkG+QDcMb+EA
jPEGqGvqgVQ7EP8GYlix1QU0rGJgiy8sYcoAdSmogK2iyFZgOm0D4h5i1AIAuQCv
ZpMHcwsAAAAASUVORK5CYII=" height="20" stroke="white" preserveAspectRatio="none"
    /></g
  ></g
></svg
>

Мне нужно преобразовать файл с правильным рендерингом в PDF. Не могли бы вы помочь мне в этом, пожалуйста?


person user9514066    schedule 24.02.2020    source источник
comment
попробуйте указать шрифт, а не позволять UA выбирать все, что ему нравится. Вы почти обязательно получите различия, если не скажете, какой шрифт, размер шрифта и т. д. вы хотите.   -  person Robert Longson    schedule 25.02.2020
comment
Свойства шрифта уже указаны. Посмотрите на атрибуты основного тега svg.   -  person user9514066    schedule 25.02.2020
comment
Может быть, тот или другой не может найти шрифт «Диалог» и заменяет его чем-то другим.   -  person Robert Longson    schedule 25.02.2020


Ответы (1)


Проблема связана с указанными свойствами шрифта. Семейство шрифтов, указанное в svg, — «sans-serif». Шрифт без засечек по умолчанию, используемый браузерами, — Arial, в то время как Inkscape использует шрифты по умолчанию операционной системы, т. е. шрифт без засечек, используемый Inkscape на компьютерах с Windows, — Verdana.

Таким образом, замена «sans-serif» на «arial» в svg решает проблему.

person user9514066    schedule 25.02.2020