Почему мой SVG не отображается, когда я пытаюсь использовать метод вывода XSLT "html"? - PullRequest
0 голосов
/ 01 ноября 2019

Извиняюсь, если это простой вопрос, так как я довольно новичок в XSLT. У меня возникла проблема, из-за которой изображение SVG, которое я генерирую в XSLT, не будет отображаться, если для моего метода вывода установлено значение html. Если я открою нужный XML-файл, преобразую его и просматриваю в браузере (IE v11), весь документ загружается, за исключением самого изображения SVG. В IE, если я щелкну правой кнопкой мыши по документу и выберу «просмотреть источник», я смогу увидеть информацию о SVG, находящуюся там, где она должна быть.

Если я установлю метод вывода на xml и открою в IE, изображения SVG действительно появляются, но структура документа отсутствует (но, повторюсь: цель состоит в том, чтобы выводить в формате html, как это используется в других процессахдалее)

Ниже приведен фрагмент небольшого простого тестового XSLT и xml-кода после преобразования, видимого из «view source» (без учета не связанных между собой вещей). Я пытаюсь заставить это работать в небольшом масштабе, прежде чем я займусь более широкой картиной.

Также отметим, что тег svg: text отображает упомянутый текст, хотя он больше похож на простую текстовую запись, чем на часть изображения.

Для тех, кто знаком с ним, большая часть функциональности исходит от генератора штрих-кодов XSLT RenderX.

XSLT:

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"
  xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg">

  <xsl:import href="code128.xsl"/>

  <xsl:output method='html' media-type="image/svg" encoding='UTF-8' indent='yes'/>

  <xsl:template match="/">
    <html lang="en">
      <head>
        <title>SVG bar code examples</title>
      </head>
      <body>
        <h1>SVG bar code examples</h1>
        <ul>
          <xsl:apply-templates select="//barcode"/>
        </ul>
      </body>
    </html>
  </xsl:template>

  <xsl:template match="barcode">
    <li>
      <xsl:call-template name="barcode-code128">
      .
      <!--Parameters here-->
      .
      </xsl:call-template>
    </li>
  </xsl:template>
</xsl:stylesheet>

PostXML преобразования:

<?xml version="1.0" encoding="utf-8"?>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg">
  <head>
    <title>SVG bar code examples</title>
  </head>
  <body>
    <h1>SVG bar code examples</h1>
    <ul>
      <li>
        <svg:svg width="29.494444444444443mm" height="12.7mm" viewBox="0 0 10618 4572">
          <svg:path d="M 686 686 l 0 2286 138 0 0 -2286 z m ..."(truncated due to length)>
          <svg:text x="6068" y="4420" text-anchor="middle" font-family=...
        </svg:svg>
      </li>
      .
      <!--More SVG images here-->
      .
    </ul>
  </body>
</html>

1 Ответ

1 голос
/ 01 ноября 2019

Если вы хотите использовать метод вывода html, вам следует использовать синтаксис HTML, и ни HTML 4, ни HTML5, ни то, что просто называется HTML, теперь не поддерживают пространства имен, в частности имена элементов без префиксов. Таким образом, чтобы ваши SVG-элементы распознавались в text / html, вам просто нужно svg, path и text в качестве имен элементов без префикса, единственное допустимое объявление "namespace" будет xmlns="http://www.w3.org/2000/svg" в svg element.

Я также не уверен насчет поддержки SVG в IE, возможно, она включена только в режиме отрисовки, соответствующем стандартам, то есть для method="html" рекомендуется иметь <xsl:output method="html" indent="yes" version="5" doctype-system="about:legacy-doctype"/>, например doctype-systemпредполагается установить более старые браузеры, различающие режим совместимости и стандартный совместимый режим с последним режимом.

Если используемая библиотека создает элементы с префиксом, вам нужно будет выполнить их через дополнительный шаг преобразования, чтобы убрать префикс пространства имен, которыйв одном преобразовании возможен только в XSLT 1 с использованием проприетарной функции расширения для преобразования фрагмента результирующего дерева в набор узлов:

  <xsl:template match="barcode">
    <li>
      <xsl:variable name="barcode-rtf">
      <xsl:call-template name="barcode-code128">
      .
      <!--Parameters here-->
      .
      </xsl:call-template>
      </xsl:variable>
      <xsl:apply-templates select="msxml:node-set($barcode-rtf)/node()" xmlns:msxml="urn:schemas-microsoft-com:xslt" mode="strip-svg-prefix"/>
    </li>
  </xsl:template>


  <xsl:template match="@* | node()" mode="strip-svg-prefix">
    <xsl:copy>
      <xsl:apply-templates select="@* | node()" mode="strip-svg-prefix"/>
    </xsl:copy>
  </xsl:template>

  <xsl:template match="svg:*" mode="strip-svg-prefix" xmlns:svg="http://www.w3.org/2000/svg">
    <xsl:element name="{local-name()}" namespace="http://www.w3.org/2000/svg">
      <xsl:apply-templates select="@* | node()" mode="strip-svg-prefix"/>
    </xsl:copy>
  </xsl:template>

Обратите внимание, что для text / html и HTML 4 или HTML5в качестве цели преобразования с method="html" я бы рекомендовал вообще не использовать пространство имен для HЭлементы TML, т.е. удалить объявление пространства имен XHTML, которое у вас есть. В противном случае сериализация пустых элементов может не дать правильный синтаксис HTML.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...