| 223 | === Example 2: TEI document with MathML and SVG === |
| 224 | |
| 225 | In the following simple example the text part consists of a MathML formula and a SVG graphics. |
| 226 | {{{ |
| 227 | <?xml version="1.0" encoding="UTF-8"?> |
| 228 | <TEI xmlns="http://www.tei-c.org/ns/1.0" xmlns:xlink="http://www.w3.org/1999/xlink"> |
| 229 | <teiHeader> |
| 230 | <fileDesc> |
| 231 | <titleStmt> |
| 232 | <title>Title</title> |
| 233 | <author>Name, Prename</author> |
| 234 | </titleStmt> |
| 235 | <publicationStmt> |
| 236 | <date>1789</date> |
| 237 | <idno>/experimental/yourDirectory</idno> |
| 238 | <availability status="free"> |
| 239 | <p>This text is available under Creative Commons license CC-BY</p> |
| 240 | </availability> |
| 241 | </publicationStmt> |
| 242 | <sourceDesc> |
| 243 | <bibl> |
| 244 | </bibl> |
| 245 | </sourceDesc> |
| 246 | </fileDesc> |
| 247 | <profileDesc> |
| 248 | <langUsage> |
| 249 | <language ident="en">English</language> |
| 250 | </langUsage> |
| 251 | </profileDesc> |
| 252 | </teiHeader> |
| 253 | <text> |
| 254 | <body> |
| 255 | <pb facs="0001.jpg"/> |
| 256 | <hi rend="bold">MathML example: </hi><lb/> |
| 257 | <formula> |
| 258 | <math xmlns="http://www.w3.org/1998/Math/MathML"> |
| 259 | <mrow> |
| 260 | <mi>a</mi> |
| 261 | <mo>⁢<!-- ⁢ --></mo> |
| 262 | <msup> |
| 263 | <mi>x</mi> |
| 264 | <mn>2</mn> |
| 265 | </msup> |
| 266 | <mo>+</mo> |
| 267 | <mi>b</mi> |
| 268 | <mo>⁢<!-- ⁢ --></mo> |
| 269 | <mi>x</mi> |
| 270 | <mo>+</mo> |
| 271 | <mi>c</mi> |
| 272 | </mrow> |
| 273 | </math> |
| 274 | </formula> |
| 275 | <hi rend="bold">SVG example: </hi><lb/><lb/> |
| 276 | <svg xmlns="http://www.w3.org/2000/svg" width="800" height="300" version="1.1"> |
| 277 | <a xlink:href="http://www.youtube.com/watch?v=yHrQ_8GWRiY" target="_blank"> |
| 278 | <rect id="rec" x="300" y="100" width="300" height="100" style="fill:CCCC99"> |
| 279 | <animate attributeName="x" attributeType="XML" begin="0s" dur="6s" fill="freeze" from="300" to="0"/> |
| 280 | <animate attributeName="y" attributeType="XML" begin="0s" dur="6s" fill="freeze" from="100" to="0"/> |
| 281 | <animate attributeName="width" attributeType="XML" begin="0s" dur="6s" fill="freeze" from="300" to="800"/> |
| 282 | <animate attributeName="height" attributeType="XML" begin="0s" dur="6s" fill="freeze" from="100" to="300"/> |
| 283 | <animateColor attributeName="fill" attributeType="CSS" from="lime" to="red" begin="2s" dur="4s" fill="freeze"/> |
| 284 | </rect> |
| 285 | </a> |
| 286 | <g transform="translate(100,100)"> |
| 287 | <text id="TextElement" x="0" y="0" style="font-family:Verdana;font-size:16; visibility:hidden"> Click and get Slime |
| 288 | <set attributeName="visibility" attributeType="CSS" to="visible" begin="1s" dur="5s" fill="freeze"/> |
| 289 | <animateMotion path="M 0 0 L 100 100" begin="1s" dur="5s" fill="freeze"/> |
| 290 | <animateColor attributeName="fill" attributeType="CSS" from="red" to="blue" begin="1s" dur="5s" fill="freeze"/> |
| 291 | <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="-30" to="0" begin="1s" dur="5s" fill="freeze"/> |
| 292 | <animateTransform attributeName="transform" attributeType="XML" type="scale" from="1" to="3" additive="sum" begin="1s" dur="5s" fill="freeze"/> |
| 293 | </text> |
| 294 | </g> |
| 295 | </svg> |
| 296 | </body> |
| 297 | </text> |
| 298 | </TEI> |
| 299 | }}} |