XML学習備忘録05_XMLにいかに画像を埋め込むか

に示したように実体宣言・記法宣言を書いたDTDを読み込んだ後に

sample.xml

<img src="sample.png"/>

みたいにHTMLのように参照することで画像をXML文書に埋め込む方法が紹介されていたが、どう考えても面倒くさい(-_-;)・・・

と思って調べてみたら、やっぱり実務では以下のような代替策を使うことが多いらしい

実務ではいかに楽に画像をXML文書に埋め込むか

方法（１）CDATA属性としてパスだけ書いて参照する

要は無理矢理HTMLのimgタグを真似る

sample.dtd

<!ELEMENT img EMPTY>  <!--imgタグはテキストノードを持たない（空要素）-->
<!ATTLIST img
    src CDATA #REQUIRED  
    alt CDATA #IMPLIED    
>

 <!--imgにここで付与するsrc属性は値必須で、値はXMLで使用できる文字列なら何でもOK-->
 <!--imgにここで付与するalt属性は値省略可能で、値はXMLで使用できる文字列なら何でもOK-->

sample.xml

<img src="hogehoge.png" alt="ホゲホゲ"/>

src属性に書くパスはsample.xmlからの相対パス

方法（２）XML Schemaにおいて画像のパスをxs:anyURI（タグの値がURI形式（＝URL＋URN）であることを約束するもの）で定義

sample.xsd

<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema">
<!--この文書はXML Schemaであることを宣言するもの-->

  <xs:element name="img">   <!--「XML内で img タグを使ってよい」という宣言-->
    <xs:complexType>        <!--imgタグがテキストノードの他に属性や子要素を持ちうることを許可-->
                            <!--imgタグは「値がURI形式であるsrc属性を必ずもたないといけない」と約束-->
      <xs:attribute name="src"   
                    type="xs:anyURI"
                    use="required"/>
                    　　　　<!--「実質的に」代替テキストとして使われうる省略可能の文字列型のalt属性を定義-->
      <xs:attribute name="alt"
                    type="xs:string"/>
    </xs:complexType>
  </xs:element>

</xs:schema>

sample.xsd

xmlns:xs="http://www.w3.org/2001/XMLSchema"

の部分を名前空間宣言と呼ぶ。（※これはW3Cが定義した XML Schema言語そのものの名前空間）
・これによりDjango（Pythonのフレームワークの１つ）とかにおける名前空間と同じ感じで http://www.w3.org/2001/XMLSchema を xs:で代替できる。
※ほぼ決まり文句的にこれを書く

xs:complexTypeがxs:simpleTypeになっている場合、指定されているタグ（ここでは<img>）はテキストしか持つことができない。

sample.xml

<?xml version="1.0" encoding="UTF-8"?>

<img
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:noNamespaceSchemaLocation="sample.xsd"
    src="images/hogehoge.png"
    alt="ホゲホゲ"/>

        <!-- xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"はXML Schema参照用の名前空間-->
        <!-- このXMLが「sample.xsdに従う」という宣言-->
    

srcの値に書くパスは、sample.xmlから画像への相対パス

方法（３）SVG（=Scalable Vector Graphics）を直接XMLとして記載する

sample.xml

<?xml version="1.0" encoding="UTF-8"?>

<sample xmlns:svg="http://www.w3.org/2000/svg">

    <title>サンプル</title>

    <paragraph>
        これはサンプルです。
    </paragraph>

    <svg:svg width="200" height="100">
        <svg:rect
            x="10"
            y="10"
            width="50"
            height="80"
            fill="blue"/>
    </svg:svg>

</sample>

xmlns:svg="http://www.w3.org/2000/svg"

は <svg:svg ～>や<svg:circle ～>などの要素がSVG仕様の要素であることを示す
W3CのSVG（Scalable Vector Graphics）名前空間

※SVG（Scalable Vector Graphics）の仕様（例えば、上記の例だとx、y、widthなどが何を表すか等）は以下のサイトが個人的には公式docにしては見やすいように感じた。

主な参考資料

①XMLマスター教科書 ベーシックV2　　森田 浩美・中原 敬子 (著)

Amazonリンク

https://www.amazon.co.jp/XML%E3%83%9E%E3%82%B9%E3%82%BF%E3%83%BC%E6%95%99%E7%A7%91%E6%9B%B8-%E3%83%99%E3%83%BC%E3%82%B7%E3%83%83%E3%82%AFV2-%E6%A3%AE%E7%94%B0-%E6%B5%A9%E7%BE%8E/dp/4798109096

②MDN公式　HTML <img> 画像埋め込み要素
https://developer.mozilla.org/ja/docs/Web/HTML/Reference/Elements/img

③MDN公式　ゼロから始めるSVG入門
https://developer.mozilla.org/ja/docs/Web/SVG/Tutorials/SVG_from_scratch/Getting_started

④SVGの属性について理解する　@mt877 さんQiita
https://qiita.com/mt877/items/182061c78b9c86941823

⑤MDN公式　名前空間の速習講座
https://developer.mozilla.org/ja/docs/Web/SVG/Guides/Namespaces_crash_course

⑥国土交通省　XMLスキーマの記法
https://www.mlit.go.jp/plateaudocument01-04/2.html

⑦URIとは？「URL」と「URI」の違いを解説！
https://ferret-plus.com/4637