Библиотека mPDF: конвертировать SVG в IMG SRC, проблема со шрифтом - PullRequest
Новая
       15

Библиотека mPDF: конвертировать SVG в IMG SRC, проблема со шрифтом

0 голосов
/ 10 марта 2019

У меня есть HTML-код, который имеет несколько SVG, и использует внешние CSS и JS, включенные в заголовок HTML. Я пытаюсь экспортировать его в pdf, используя библиотеку PHP Mpdf.

Так как он не принимает все свойства svg, сначала я конвертирую его в img: 

<script type="text/javascript">
function convierte_graficos() {

    // css manual
d3.selectAll('.bullet')
.style({
    "font": "10px sans-serif",
    "text-align": "left"
});
d3.selectAll('.bullet .marker')
.style({
    "stroke": "#000",
    "stroke-width": "2px"
});
d3.selectAll('.bullet .tick line')
.style({
    "stroke": "#666",
    "stroke-width": ".5px"
});
d3.selectAll('.bullet .range.s0')
.style({
    "fill": "#eee"
});
d3.selectAll('.bullet .range.s1')
.style({
    "fill": "#ddd"
});
d3.selectAll('.bullet .range.s2')
.style({
    "fill": "#ccc"
});
d3.selectAll('.bullet .measure.s0')
.style({
    "fill": "red"
});
d3.selectAll('.bullet .measure.s1')
.style({
    "fill": "blue"
});
d3.selectAll('.bullet .title')
.style({
    "font-size": "14px",
    "font-weight": "bold"
});
d3.selectAll('.bullet .subtitle')
.style({
    "fill": "#999"
});

    html = $('#graf_capitanias_ct').html();
    imgsrc = 'data:image/svg+xml;base64,'+ btoa(html);
    img = '<img src="'+imgsrc+'"';
    attributes = $('svg').prop("attributes");
    $.each(attributes, function() {
        img += ' '+this.name+'="'+this.value+'"';
    });
    img += '>';

    $('#graf_capitanias_ct').html(img); 
}
</script>

Обратите внимание, что стили CSS должны быть добавлены перед повторным преобразованием. Первоначально он берет их из внешнего CSS.

Изображение выглядит хорошо и выглядит правильно в браузере (стили шрифтов и размеры тоже). Но при создании PDF, это выглядит плохо. Казалось бы, теряются стили шрифта (не цвета) и размеры. Прикрепленное изображение, где видны три этапа:

enter image description here

Библиотека инициализируется так: 

$this->pdf = new mPDF(    $mode= 'es-x', 
                                    $format='A4',
                                    $default_font_size=0,
                                    $default_font='',
                                    $mgl=12,$mgr=10,$mgt=14,$mgb=20,
                                    $mgh=0,$mgf=10, 
                                    $orientation='P')

Тот же результат с режимом utf-8.

Что может отсутствовать? Почему не хорошо отображать шрифты, если изображение является тегом img? Спасибо!

...