iText 7 SVGConverter не отображается должным образом - PullRequest
Новая
       28

iText 7 SVGConverter не отображается должным образом

0 голосов
/ 27 мая 2019

Я хотел бы добавить SVG, исходящий от клиента, на странице PDF. При взгляде на SVG на клиенте, а также на изображение SVG, оно выглядит как положено. Однако, когда SVG добавляется в PDF-файл, такие элементы, как шрифты, оси, линии сетки и т. Д., Отображаются не так, как ожидалось.

Я пытался поиграть с определением CSS для шрифтов и определений осей, но ни одно из них не повлияло на вывод в PDF. Я использую некоторые нестандартные шрифты, но даже когда я попробовал Arial, который не появился в PDF.

Я использую iText 7.1.6

Ожидаемая диаграмма: Expected Chart

Результирующий SVG в PDF: Resulting SVG in PDF

Код 

string fPath = System.IO.Path.Combine(fFolder, fName);

DateTime dateTime = DateTime.Now;

PdfWriter writer = new PdfWriter(fPath);
PdfDocument pdf = new PdfDocument(writer);
Document doc = new Document(pdf, PageSize.A4);

string svg = System.IO.File.ReadAllText(@"C:\Users\Public\Desktop\cData.txt");

byte[] byteArray = Encoding.UTF8.GetBytes(svg);

using (MemoryStream ms = new MemoryStream(byteArray))
{

    Image image = SvgConverter.ConvertToImage(ms, pdf);
    image.SetFixedPosition(0, 400);
    image.ScaleToFit(500, 360);
    doc.Add(image);
}

doc.Close();

Код SVG (копирование в txt-файлы 

 <svg xmlns="http://www.w3.org/2000/svg" id="reportChartNAVSvg" width="1000" height="720"><defs><style type="text/css">
    .axis--x path { display: none; }
    .axis--y--right path { display: none; }
    .grid line { stroke: #d9d9d9; shape-rendering: crispEdges; }
    .grid path { stroke-width: 0; }
    .line { fill: none; stroke-width: 1.5px; }
    .line-factsheet { color: rgb(198, 180, 147); }
    .bar-factsheet { fill: #faf1d6; stroke: #c6b493; }
    </style></defs><g transform="translate(52 52)"><g class="print" style="font-family: Arial; font-size: 26px;"><rect style="fill: #c6b493;" x="114.667" y="617.95" width="52" height="5.2" /><text x="179.6667" y="630.95">Index Performance (CHF)</text></g><g class="grid" font-family="sans-serif" font-size="10" fill="none" text-anchor="end"><path class="domain" style="opacity: 0;" stroke="currentColor" d="M 948 525.5 H 0.5 V 0.5 H 948" /><g class="tick" opacity="1" transform="translate(0 525.5)"><line style="opacity: 0.7; stroke: #d9d9d9;" stroke="currentColor" x2="948" /><text fill="currentColor" x="-3" dy="0.32em" /></g><g class="tick" opacity="1" transform="translate(0 420.5)"><line style="opacity: 0.7; stroke: #d9d9d9;" stroke="currentColor" x2="948" /><text fill="currentColor" x="-3" dy="0.32em" /></g><g class="tick" opacity="1" transform="translate(0 315.5)"><line style="opacity: 0.7; stroke: #d9d9d9;" stroke="currentColor" x2="948" /><text fill="currentColor" x="-3" dy="0.32em" /></g><g class="tick" opacity="1" transform="translate(0 210.5)"><line style="opacity: 0.7; stroke: #d9d9d9;" stroke="currentColor" x2="948" /><text fill="currentColor" x="-3" dy="0.32em" /></g><g class="tick" opacity="1" transform="translate(0 105.5)"><line style="opacity: 0.7; stroke: #d9d9d9;" stroke="currentColor" x2="948" /><text fill="currentColor" x="-3" dy="0.32em" /></g><g class="tick" opacity="1" transform="translate(0 0.5)"><line style="opacity: 0.7; stroke: #d9d9d9;" stroke="currentColor" x2="948" /><text fill="currentColor" x="-3" dy="0.32em" /></g><g class="tick" opacity="1" transform="translate(0 -104.5)"><line style="opacity: 0.7; stroke: #d9d9d9;" stroke="currentColor" x2="948" /><text fill="currentColor" x="-3" dy="0.32em" /></g></g><g class="axis axis-x" font-family="sans-serif" font-size="10" style="font-family: Arial; font-size: 26px;" fill="none" text-anchor="middle" transform="translate(0 525)"><path class="domain" stroke="currentColor" d="M 0.5 0.5 H 948.5" /><g class="tick" opacity="1" transform="translate(69.4825 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Okt 16</text></g><g class="tick" opacity="1" transform="translate(171.89 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Jan 17</text></g><g class="tick" opacity="1" transform="translate(271.98 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Apr 17</text></g><g class="tick" opacity="1" transform="translate(373.228 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Jul 17</text></g><g class="tick" opacity="1" transform="translate(475.589 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Okt 17</text></g><g class="tick" opacity="1" transform="translate(577.997 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Jan 18</text></g><g class="tick" opacity="1" transform="translate(678.087 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Apr 18</text></g><g class="tick" opacity="1" transform="translate(779.335 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Jul 18</text></g><g class="tick" opacity="1" transform="translate(881.696 0.1)"><line stroke="currentColor" y2="0" /><text fill="currentColor" y="3" dy="39">Okt 18</text></g></g><g class="axis axis-y-left" font-family="sans-serif" font-size="10" style="font-family: Arial; font-size: 26px;" fill="none" text-anchor="end"><path class="domain" stroke="currentColor" d="M 0.5 525.5 V 0.5" /><g class="tick" opacity="1" transform="translate(0 525.5)"><line stroke="currentColor" x2="0" /><text style="opacity: 1; text-anchor: end;" fill="currentColor" x="-3" dx="-6.5" dy="0.32em">97</text></g><g class="tick" opacity="1" transform="translate(0 420.5)"><line stroke="currentColor" x2="0" /><text style="opacity: 1; text-anchor: end;" fill="currentColor" x="-3" dx="-6.5" dy="0.32em">98</text></g><g class="tick" opacity="1" transform="translate(0 315.5)"><line stroke="currentColor" x2="0" /><text style="opacity: 1; text-anchor: end;" fill="currentColor" x="-3" dx="-6.5" dy="0.32em">99</text></g><g class="tick" opacity="1" transform="translate(0 210.5)"><line stroke="currentColor" x2="0" /><text style="opacity: 1; text-anchor: end;" fill="currentColor" x="-3" dx="-6.5" dy="0.32em">101</text></g><g class="tick" opacity="1" transform="translate(0 105.5)"><line stroke="currentColor" x2="0" /><text style="opacity: 1; text-anchor: end;" fill="currentColor" x="-3" dx="-6.5" dy="0.32em">102</text></g><g class="tick" opacity="1" transform="translate(0 0.5)"><line stroke="currentColor" x2="0" /><text style="opacity: 1; text-anchor: end;" fill="currentColor" x="-3" dx="-6.5" dy="0.32em">103</text></g><g class="tick" opacity="1" transform="translate(0 -104.5)"><line stroke="currentColor" x2="0" /><text style="opacity: 1; text-anchor: end;" fill="currentColor" x="-3" dx="-6.5" dy="0.32em">104</text></g></g><g><path style="fill: none; stroke: #c6b493; stroke-width: 8;" d="M 0 262.5 L 3.33786 262.5 L 34.4913 290.938 L 67.8699 290.938 L 102.408 371.438 L 135.786 409.5 L 165.827 365.313 L 170.277 368.813 L 204.769 346.5 L 235.922 237.563 L 270.367 225.75 L 300.408 197.313 L 303.746 183.267 L 338.237 154.738 L 371.616 228.914 L 406.107 178.439 L 440.598 163.516 L 473.977 152.104 L 508.514 122.697 L 541.893 148.154 L 571.934 111.724 L 576.384 122.258 L 610.876 96.8008 L 642.029 199.068 L 674.249 217.064 L 676.474 217.064 L 706.515 217.064 L 709.853 157.823 L 744.344 202.917 L 777.723 236.516 L 812.214 224.579 L 846.705 285.588 L 880.084 320.513 L 914.621 425.732 L 948 461.099" /></g></g></svg>

1 Ответ

0 голосов
/ 28 мая 2019

Мне удалось нарисовать собственно SVG в PDF.С помощью следующего кода я мог бы решить проблему со шрифтом.Использование propoer Кодирование важно, если вам нужно показать символы на правильном языке. 

FontProvider provider = new FontProvider();
        provider.AddFont(FontProgramFactory.CreateFont(@"C:\Windows\Fonts\lte50144.ttf"));

        SvgConverterProperties props = new SvgConverterProperties();
        props.SetCharset("Windows-1252");
        props.SetFontProvider(provider);

        byte[] byteArray = Encoding.GetEncoding(1252).GetBytes(svg);

        using (MemoryStream ms = new MemoryStream(byteArray))
        {

            Image image = SvgConverter.ConvertToImage(ms, pdf, props);
            image.SetFixedPosition(llx, lly);
            image.ScaleToFit(width, height);
            doc.Add(image);
        }

Сам SVG создается в d3.js.Перемещенная ось X происходит от некоторых элементов transform на родительском уровне, которые игнорируются на дочернем уровне.С помощью цикла над этими элементами удаление transform на родительском элементе и установка абсолютной позиции на дочернем элементе решили эту проблему.

...