Автоматически помещать множество SVG в один PDF, каждый на одной странице - PullRequest
0 голосов
/ 20 марта 2019

Я хочу сделать доступными около 2000 графических изображений (эмодзи) для пользователей Latex . Все они находятся в отдельных файлах SVG (около 1–10 КБ) изначально с квадратным соотношением сторон, но также есть автоматически сгенерированный spritesheet , содержащий их все как <symbol> s. Так как само число превышает некоторые ограничения (например, предварительный просмотр Github ограничен 1000) и небольшой размер файла тратит много места в файловых системах с большим размером блока, а также потенциально требует большого количества сетевых запросов (например, HTTP 1.x), Я считаю, что нужно поместить их в один файл PDF в виде отдельных страниц. Соответствующие пакеты Latex поддерживают добавление определенных страниц из PDF-файлов в виде графики, но я пока не нашел способа использовать SVG символы . Поэтому в настоящее время я предпочитаю решение PDF. Однако, хотя я знаю, как преобразовать один SVG в одностраничный PDF, e. г. используя Inkscape, я не уверен, какие программы использовать для создания небольшого, быстрого и переносимого сценария (например, на основе npm) для создания одного многостраничного PDF-файла из сотен файлов SVG или из одной таблицы SVG. Любой совет? В идеале шестнадцатеричные цифры 4+, из которых состоят имена файлов SVG, должны использоваться для сортировки и, возможно, маркировки страниц PDF.

1 Ответ

1 голос
/ 20 марта 2019

Это вдохновлено подходом , который я использовал в другом ответе. Чтобы визуально визуализировать <symbol> s, вы можете использовать XSLT-преобразование, поместив каждый значок в отдельный контейнер <svg> на HTML-странице. Затем распределите их по отдельным страницам с помощью правила CSS @media print. Таким образом, вы можете открыть файл в браузере и распечатать его в формате PDF оттуда.

Во-первых, вы добавили бы эту строку в начало вашей таблицы спрайтов:

<?xml-stylesheet type="text/xsl" href="sprites_paged.xslt" ?>

Ссылка sprites_paged.xslt будет выглядеть так:

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:svg="http://www.w3.org/2000/svg"
                xmlns:xlink="http://www.w3.org/1999/xlink">
  <xsl:template match="/">
    <html>
      <head>
        <meta charset="UTF-8"></meta>
        <style>
svg { display: none; }
/* icon sizes to your liking */
.icon { display: block; width: 1in; height: 1in; }
@media print {
  .icon { break-after: page; }
}
        </style>
      </head>
      <body>
        <xsl:copy>
          <xsl:copy-of select="//svg:svg"/>
        </xsl:copy>
        <xsl:for-each select="//svg:symbol">
          <svg class="icon" xmlns="http://www.w3.org/2000/svg">
            <xsl:attribute name="viewBox"><xsl:value-of select="@viewBox"/></xsl:attribute>
            <use>
              <xsl:attribute name="xlink:href">#<xsl:value-of select="@id"/></xsl:attribute>
            </use>
          </svg>
        </xsl:for-each>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>
...