画像データを表示する。JPEG,PNG,GIFが使用できる。
<image x="X座標" y="Y座標" width="幅" height="高さ" xlink:href="画像データURL">
</image>
画像データの左上角の座標を指定する。
画像データの左上角の座標を指定する。
画像データの幅を指定する。
画像データの高さを指定する。
画像データの場所をURLで指定する。
おせち画像の上に説明を重ねてみました。大きい画像と小さい画像はいずれも、同じ画像データを使用しています。
<rect x="0" y="0" width="400" height="250" fill="lightgreen" stroke="none"/> <image x="2" y="2" width="300px" height="222px" xlink:href="osechi200201010753.jpg"> <title>おせち大</title> </image> <image x="320" y="180" width="60px" height="44px" xlink:href="osechi200201010753.jpg"> <title>おせち小</title> </image> <rect x="249" y="136" width="45" height="16" fill="white" stroke="white"/> <text x="250" y="150" font-size="14" fill="red">のし鳥</text> <rect x="49" y="186" width="145" height="16" fill="white" stroke="white"/> <text x="50" y="200" font-size="14" fill="red">パイナップルきんとん</text> <rect x="249" y="36" width="30" height="16" fill="white" stroke="white"/> <text x="250" y="50" font-size="14" fill="red">錦卵</text> <text x="330" y="50" font-size="42" fill="black">お</text> <text x="330" y="100" font-size="42" fill="black">せ</text> <text x="330" y="150" font-size="42" fill="black">ち</text> <text x="10" y="243" font-size="16" fill="black">2002年1月1日</text> <text x="310" y="240" font-size="10" fill="white">A Happy New Year.</text> |