aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--content/posts/2021-12-05-mathyd-easy-tex-to-svg.md138
-rw-r--r--content/projects/mathyd.md8
-rw-r--r--static/files/posts/mathyd-easy-tex-to-svg/cubic.svg1
-rw-r--r--static/files/posts/mathyd-easy-tex-to-svg/cubic.tex.txt38
-rw-r--r--static/files/posts/mathyd-easy-tex-to-svg/logo.svg2
5 files changed, 187 insertions, 0 deletions
diff --git a/content/posts/2021-12-05-mathyd-easy-tex-to-svg.md b/content/posts/2021-12-05-mathyd-easy-tex-to-svg.md
new file mode 100644
index 0000000..5961a43
--- /dev/null
+++ b/content/posts/2021-12-05-mathyd-easy-tex-to-svg.md
@@ -0,0 +1,138 @@
+---
+slug: mathyd-easy-tex-to-svg
+title: "Mathyd: Easy TeX to SVG"
+date: "2021-12-05T07:02:29-04:00"
+draft: true
+---
+A few weeks ago I released [Mathyd][], a [Docker][] image containing an
+[HTTP][] daemon which converts [TeX][] to [SVG][].
+
+[Mathyd][] includes a minimal command-line client which reads [TeX][]
+from standard input and prints the generated [SVG][] to standard output,
+like so:
+
+```bash
+# set URL and HMAC secret key
+# (note: replace value of MATHYD_HMAC_KEY with your own randomly
+# generated one)
+export MATHYD_URL="http://whatever.example.com:3000/"
+export MATHYD_HMAC_KEY="2dhXA3HTmfEMq2d5"
+
+# render output
+bin/mathy < cubic.tex > cubic.svg
+```
+&nbsp;
+
+Given [this input file][cubic-tex], the command above produces the
+following result:
+
+{{< figure
+ src="/files/posts/mathyd-easy-tex-to-svg/cubic.svg"
+ class=image
+ caption="The Cubic Formula, rendered by Mathyd."
+>}}
+
+### Installation
+
+You can install and run the [Mathyd Docker image][mathyd-docker] with a
+single command:
+
+```bash
+# run mathyd as a daemon on port 3000
+# (note: replace value of MATHYD_HMAC_KEY with your own randomly
+# generated one)
+docker run --rm -d -e MATHYD_HMAC_KEY="2dhXA3HTmfEMq2d5" -p 3000:3000 pablotron/mathyd:latest
+```
+&nbsp;
+
+**Notes:**
+* Be sure to generate your own [HMAC][] secret key rather than
+ reusing the key from the examples above.
+* Don't expose [Mathyd][] via a publicly-accessible [URL][]; it does
+ not support [TLS][] and [MathJax][] may use a lot of memory for large
+ input files.
+
+### Technical Details
+
+Under the hood, [Mathyd][] is just:
+1. a [container][] running an [Express][] [HTTP][] daemon that exposes a
+ single endpoint that accepts a `PUT` request containing:
+
+ * A [JSON][]-encoded body of input parameters
+ * A hex-encoded, [SHA-256 HMAC][hmac] of the body and the [HMAC][]
+ secret key in the `x-mathyd-hmac-sha256` header.
+
+ The endpoint does the following:
+
+ 1. Verifies the body [HMAC][]
+ 2. Converts the input [TeX][] to [SVG][] (via [MathJax][])
+ 3. Returns a [JSON][] response containing the generated [SVG][]
+
+2. A command-line client, written in [Ruby][], which:
+ 1. Reads [TeX][] from standard input and serializes it as [JSON][].
+ 2. Sends a `PUT` request to the [Mathyd][] daemon and parses the
+ response.
+ 3. Extracts the generated [SVG][] from the response and writes it to
+ standard output.
+
+### Rationale
+
+I wanted an easy way to generate static math [SVGs][svg] for
+web pages from the command-line without installing a blizzard of
+dependencies and without requiring [MathJax][] on the destination page.
+
+I prefer [TeX][] over other formats because it's still the least-worst
+format for complex math formulas.
+
+I prefer [SVGs][svg] over bitmap images whenever possible because:
+
+* [SVGs][svg] scale to any screen size and resolution. This is
+ particularly useful for [responsive design][].
+* [SVGs][svg] are supported by all modern browsers, including mobile
+ browsers. (Fun fact: even the [animated logo for this page][logo] is
+ an [SVG][]).
+
+### Links
+
+* [Mathyd GitHub Repository][mathyd]
+* [Mathyd on Docker Hub][mathyd-docker]
+
+**Note:** If you want a web interface to noodle around with [TeX][],
+check out [Mathy][] instead.
+
+[mathyd]: https://github.com/pablotron/mathyd
+ "Dockerized TeX to SVG HTTP daemon."
+[docker]: https://en.wikipedia.org/wiki/Docker_(software)
+ "Docker"
+[http]: https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol
+ "HyperText Transfer Protocol"
+[tex]: https://en.wikipedia.org/wiki/TeX
+ "The TeX typesetting system."
+[svg]: https://en.wikipedia.org/wiki/Scalable_Vector_Graphics
+ "Scalable Vector Graphics"
+[mathjax]: https://mathjax.org/
+ "Math rendering library."
+[cubic-tex]: /files/posts/mathyd-easy-tex-to-svg/cubic.tex.txt
+ "Example Mathyd input TeX file containing the cubic formula."
+[mathy]: https://mathy.pmdn.org/
+ "Web-based LaTeX Math renderer, based on MathJax."
+[express]: https://expressjs.com/
+ "Minimal web framework for Node JS."
+[hmac]: https://en.wikipedia.org/wiki/HMAC
+ "Hashed Message Authentication Code"
+[json]: https://json.org/
+ "JavaScript Object Notation."
+[mathyd-docker]: https://hub.docker.com/repository/docker/pablotron/mathyd
+ "Mathyd on Docker Hub."
+[container]: https://en.wikipedia.org/wiki/OS-level_virtualization
+ "Operating System-level virtualization."
+[Ruby]: https://ruby-lang.org/
+ "Ruby programming language."
+[url]: https://en.wikipedia.org/wiki/URL
+ "Uniform Resource Locator"
+[logo]: /files/posts/mathyd-easy-tex-to-svg/logo.svg
+ "current pablotron.org site logo"
+[responsive design]: https://en.wikipedia.org/wiki/Responsive_web_design
+ "Responsive web design."
+[tls]: https://en.wikipedia.org/wiki/Transport_Layer_Security
+ "Transport Layer Security"
diff --git a/content/projects/mathyd.md b/content/projects/mathyd.md
new file mode 100644
index 0000000..18e265b
--- /dev/null
+++ b/content/projects/mathyd.md
@@ -0,0 +1,8 @@
+---
+title: "Mathyd"
+slug: "mathyd"
+active: true
+repo: "https://git.pablotron.org/mathyd"
+text: "Easy TeX to SVG daemon."
+---
+Easy TeX to SVG daemon. \ No newline at end of file
diff --git a/static/files/posts/mathyd-easy-tex-to-svg/cubic.svg b/static/files/posts/mathyd-easy-tex-to-svg/cubic.svg
new file mode 100644
index 0000000..c0d5dd0
--- /dev/null
+++ b/static/files/posts/mathyd-easy-tex-to-svg/cubic.svg
@@ -0,0 +1 @@
+<svg style="vertical-align: -10.744ex" xmlns="http://www.w3.org/2000/svg" width="74.123ex" height="22.62ex" role="img" focusable="false" viewBox="0 -5249 32762.5 9998" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path id="MJX-9-TEX-I-1D465" d="M52 289Q59 331 106 386T222 442Q257 442 286 424T329 379Q371 442 430 442Q467 442 494 420T522 361Q522 332 508 314T481 292T458 288Q439 288 427 299T415 328Q415 374 465 391Q454 404 425 404Q412 404 406 402Q368 386 350 336Q290 115 290 78Q290 50 306 38T341 26Q378 26 414 59T463 140Q466 150 469 151T485 153H489Q504 153 504 145Q504 144 502 134Q486 77 440 33T333 -11Q263 -11 227 52Q186 -10 133 -10H127Q78 -10 57 16T35 71Q35 103 54 123T99 143Q142 143 142 101Q142 81 130 66T107 46T94 41L91 40Q91 39 97 36T113 29T132 26Q168 26 194 71Q203 87 217 139T245 247T261 313Q266 340 266 352Q266 380 251 392T217 404Q177 404 142 372T93 290Q91 281 88 280T72 278H58Q52 284 52 289Z"></path><path id="MJX-9-TEX-N-3D" d="M56 347Q56 360 70 367H707Q722 359 722 347Q722 336 708 328L390 327H72Q56 332 56 347ZM56 153Q56 168 72 173H708Q722 163 722 153Q722 140 707 133H70Q56 140 56 153Z"></path><path id="MJX-9-TEX-N-33" d="M127 463Q100 463 85 480T69 524Q69 579 117 622T233 665Q268 665 277 664Q351 652 390 611T430 522Q430 470 396 421T302 350L299 348Q299 347 308 345T337 336T375 315Q457 262 457 175Q457 96 395 37T238 -22Q158 -22 100 21T42 130Q42 158 60 175T105 193Q133 193 151 175T169 130Q169 119 166 110T159 94T148 82T136 74T126 70T118 67L114 66Q165 21 238 21Q293 21 321 74Q338 107 338 175V195Q338 290 274 322Q259 328 213 329L171 330L168 332Q166 335 166 348Q166 366 174 366Q202 366 232 371Q266 376 294 413T322 525V533Q322 590 287 612Q265 626 240 626Q208 626 181 615T143 592T132 580H135Q138 579 143 578T153 573T165 566T175 555T183 540T186 520Q186 498 172 481T127 463Z"></path><path id="MJX-9-TEX-S4-E001" d="M702 589Q706 601 718 605H1061Q1076 597 1076 585Q1076 572 1061 565H742V0Q734 -14 724 -14H722H720Q708 -14 702 0V589Z"></path><path id="MJX-9-TEX-S4-23B7" d="M742 -871Q740 -873 737 -876T733 -880T730 -882T724 -884T714 -885H702L222 569L180 484Q138 399 137 399Q131 404 124 412L111 425L265 736L702 -586V168L703 922Q713 935 722 935Q734 935 742 920V-871Z"></path><path id="MJX-9-TEX-S4-E000" d="M722 -14H720Q708 -14 702 0V306L703 612Q713 625 722 625Q734 625 742 610V0Q734 -14 724 -14H722Z"></path><path id="MJX-9-TEX-S3-28" d="M701 -940Q701 -943 695 -949H664Q662 -947 636 -922T591 -879T537 -818T475 -737T412 -636T350 -511T295 -362T250 -186T221 17T209 251Q209 962 573 1361Q596 1386 616 1405T649 1437T664 1450H695Q701 1444 701 1441Q701 1436 681 1415T629 1356T557 1261T476 1118T400 927T340 675T308 359Q306 321 306 250Q306 -139 400 -430T690 -924Q701 -936 701 -940Z"></path><path id="MJX-9-TEX-N-2212" d="M84 237T84 250T98 270H679Q694 262 694 250T679 230H98Q84 237 84 250Z"></path><path id="MJX-9-TEX-I-1D44F" d="M73 647Q73 657 77 670T89 683Q90 683 161 688T234 694Q246 694 246 685T212 542Q204 508 195 472T180 418L176 399Q176 396 182 402Q231 442 283 442Q345 442 383 396T422 280Q422 169 343 79T173 -11Q123 -11 82 27T40 150V159Q40 180 48 217T97 414Q147 611 147 623T109 637Q104 637 101 637H96Q86 637 83 637T76 640T73 647ZM336 325V331Q336 405 275 405Q258 405 240 397T207 376T181 352T163 330L157 322L136 236Q114 150 114 114Q114 66 138 42Q154 26 178 26Q211 26 245 58Q270 81 285 114T318 219Q336 291 336 325Z"></path><path id="MJX-9-TEX-N-32" d="M109 429Q82 429 66 447T50 491Q50 562 103 614T235 666Q326 666 387 610T449 465Q449 422 429 383T381 315T301 241Q265 210 201 149L142 93L218 92Q375 92 385 97Q392 99 409 186V189H449V186Q448 183 436 95T421 3V0H50V19V31Q50 38 56 46T86 81Q115 113 136 137Q145 147 170 174T204 211T233 244T261 278T284 308T305 340T320 369T333 401T340 431T343 464Q343 527 309 573T212 619Q179 619 154 602T119 569T109 550Q109 549 114 549Q132 549 151 535T170 489Q170 464 154 447T109 429Z"></path><path id="MJX-9-TEX-N-37" d="M55 458Q56 460 72 567L88 674Q88 676 108 676H128V672Q128 662 143 655T195 646T364 644H485V605L417 512Q408 500 387 472T360 435T339 403T319 367T305 330T292 284T284 230T278 162T275 80Q275 66 275 52T274 28V19Q270 2 255 -10T221 -22Q210 -22 200 -19T179 0T168 40Q168 198 265 368Q285 400 349 489L395 552H302Q128 552 119 546Q113 543 108 522T98 479L95 458V455H55V458Z"></path><path id="MJX-9-TEX-I-1D44E" d="M33 157Q33 258 109 349T280 441Q331 441 370 392Q386 422 416 422Q429 422 439 414T449 394Q449 381 412 234T374 68Q374 43 381 35T402 26Q411 27 422 35Q443 55 463 131Q469 151 473 152Q475 153 483 153H487Q506 153 506 144Q506 138 501 117T481 63T449 13Q436 0 417 -8Q409 -10 393 -10Q359 -10 336 5T306 36L300 51Q299 52 296 50Q294 48 292 46Q233 -10 172 -10Q117 -10 75 30T33 157ZM351 328Q351 334 346 350T323 385T277 405Q242 405 210 374T160 293Q131 214 119 129Q119 126 119 118T118 106Q118 61 136 44T179 26Q217 26 254 59T298 110Q300 114 325 217T351 328Z"></path><path id="MJX-9-TEX-N-2B" d="M56 237T56 250T70 270H369V420L370 570Q380 583 389 583Q402 583 409 568V270H707Q722 262 722 250T707 230H409V-68Q401 -82 391 -82H389H387Q375 -82 369 -68V230H70Q56 237 56 250Z"></path><path id="MJX-9-TEX-I-1D450" d="M34 159Q34 268 120 355T306 442Q362 442 394 418T427 355Q427 326 408 306T360 285Q341 285 330 295T319 325T330 359T352 380T366 386H367Q367 388 361 392T340 400T306 404Q276 404 249 390Q228 381 206 359Q162 315 142 235T121 119Q121 73 147 50Q169 26 205 26H209Q321 26 394 111Q403 121 406 121Q410 121 419 112T429 98T420 83T391 55T346 25T282 0T202 -11Q127 -11 81 37T34 159Z"></path><path id="MJX-9-TEX-N-36" d="M42 313Q42 476 123 571T303 666Q372 666 402 630T432 550Q432 525 418 510T379 495Q356 495 341 509T326 548Q326 592 373 601Q351 623 311 626Q240 626 194 566Q147 500 147 364L148 360Q153 366 156 373Q197 433 263 433H267Q313 433 348 414Q372 400 396 374T435 317Q456 268 456 210V192Q456 169 451 149Q440 90 387 34T253 -22Q225 -22 199 -14T143 16T92 75T56 172T42 313ZM257 397Q227 397 205 380T171 335T154 278T148 216Q148 133 160 97T198 39Q222 21 251 21Q302 21 329 59Q342 77 347 104T352 209Q352 289 347 316T329 361Q302 397 257 397Z"></path><path id="MJX-9-TEX-I-1D451" d="M366 683Q367 683 438 688T511 694Q523 694 523 686Q523 679 450 384T375 83T374 68Q374 26 402 26Q411 27 422 35Q443 55 463 131Q469 151 473 152Q475 153 483 153H487H491Q506 153 506 145Q506 140 503 129Q490 79 473 48T445 8T417 -8Q409 -10 393 -10Q359 -10 336 5T306 36L300 51Q299 52 296 50Q294 48 292 46Q233 -10 172 -10Q117 -10 75 30T33 157Q33 205 53 255T101 341Q148 398 195 420T280 442Q336 442 364 400Q369 394 369 396Q370 400 396 505T424 616Q424 629 417 632T378 637H357Q351 643 351 645T353 664Q358 683 366 683ZM352 326Q329 405 277 405Q242 405 210 374T160 293Q131 214 119 129Q119 126 119 118T118 106Q118 61 136 44T179 26Q233 26 290 98L298 109L352 326Z"></path><path id="MJX-9-TEX-S3-29" d="M34 1438Q34 1446 37 1448T50 1450H56H71Q73 1448 99 1423T144 1380T198 1319T260 1238T323 1137T385 1013T440 864T485 688T514 485T526 251Q526 134 519 53Q472 -519 162 -860Q139 -885 119 -904T86 -936T71 -949H56Q43 -949 39 -947T34 -937Q88 -883 140 -813Q428 -430 428 251Q428 453 402 628T338 922T245 1146T145 1309T46 1425Q44 1427 42 1429T39 1433T36 1436L34 1438Z"></path><path id="MJX-9-TEX-S4-221A" d="M983 1739Q988 1750 1001 1750Q1008 1750 1013 1745T1020 1733Q1020 1726 742 244T460 -1241Q458 -1250 439 -1250H436Q424 -1250 424 -1248L410 -1166Q395 -1083 367 -920T312 -601L201 44L137 -83L111 -57L187 96L264 247Q265 246 369 -357Q470 -958 473 -963L727 384Q979 1729 983 1739Z"></path><path id="MJX-9-TEX-N-39" d="M352 287Q304 211 232 211Q154 211 104 270T44 396Q42 412 42 436V444Q42 537 111 606Q171 666 243 666Q245 666 249 666T257 665H261Q273 665 286 663T323 651T370 619T413 560Q456 472 456 334Q456 194 396 97Q361 41 312 10T208 -22Q147 -22 108 7T68 93T121 149Q143 149 158 135T173 96Q173 78 164 65T148 49T135 44L131 43Q131 41 138 37T164 27T206 22H212Q272 22 313 86Q352 142 352 280V287ZM244 248Q292 248 321 297T351 430Q351 508 343 542Q341 552 337 562T323 588T293 615T246 625Q208 625 181 598Q160 576 154 546T147 441Q147 358 152 329T172 282Q197 248 244 248Z"></path></defs><g stroke="currentColor" fill="currentColor" stroke-width="0" transform="scale(1,-1)"><g data-mml-node="math"><g data-mml-node="mtable"><g data-mml-node="mtr" transform="translate(0,2779.5)"><g data-mml-node="mtd"><g data-mml-node="mi"><use data-c="1D465" xlink:href="#MJX-9-TEX-I-1D465"></use></g></g><g data-mml-node="mtd" transform="translate(572,0)"><g data-mml-node="mi"></g><g data-mml-node="mo" transform="translate(277.8,0)"><use data-c="3D" xlink:href="#MJX-9-TEX-N-3D"></use></g><g data-mml-node="mroot" transform="translate(1333.6,0)"><g><g data-mml-node="mrow" transform="translate(1056,0)"><g data-mml-node="mrow"><g data-mml-node="mo" transform="translate(0 -0.5)"><use data-c="28" xlink:href="#MJX-9-TEX-S3-28"></use></g><g data-mml-node="mfrac" transform="translate(736,0)"><g data-mml-node="mrow" transform="translate(381,676)"><g data-mml-node="mo"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="msup" transform="translate(778,0)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mn" transform="translate(462,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><g data-mml-node="mrow" transform="translate(220,-719.2)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use><use data-c="37" xlink:href="#MJX-9-TEX-N-37" transform="translate(500,0)"></use></g><g data-mml-node="msup" transform="translate(1000,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><rect width="2165.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(3363.8,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="mfrac" transform="translate(4364,0)"><g data-mml-node="mrow" transform="translate(521.8,676)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mi" transform="translate(429,0)"><use data-c="1D450" xlink:href="#MJX-9-TEX-I-1D450"></use></g></g><g data-mml-node="mrow" transform="translate(220,-719.9)"><g data-mml-node="mn"><use data-c="36" xlink:href="#MJX-9-TEX-N-36"></use></g><g data-mml-node="msup" transform="translate(500,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g></g><rect width="1665.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(6491.8,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="mfrac" transform="translate(7492,0)"><g data-mml-node="mi" transform="translate(474.5,676)"><use data-c="1D451" xlink:href="#MJX-9-TEX-I-1D451"></use></g><g data-mml-node="mrow" transform="translate(220,-686)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g><g data-mml-node="mi" transform="translate(500,0)"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g></g><rect width="1229" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(8961,0) translate(0 -0.5)"><use data-c="29" xlink:href="#MJX-9-TEX-S3-29"></use></g></g><g data-mml-node="mo" transform="translate(9919.2,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="msqrt" transform="translate(10919.4,0)"><g transform="translate(1020,0)"><g data-mml-node="msup"><g data-mml-node="mrow"><g data-mml-node="mo" transform="translate(0 -0.5)"><use data-c="28" xlink:href="#MJX-9-TEX-S3-28"></use></g><g data-mml-node="mfrac" transform="translate(736,0)"><g data-mml-node="mrow" transform="translate(381,676)"><g data-mml-node="mo"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="msup" transform="translate(778,0)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mn" transform="translate(462,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><g data-mml-node="mrow" transform="translate(220,-719.2)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use><use data-c="37" xlink:href="#MJX-9-TEX-N-37" transform="translate(500,0)"></use></g><g data-mml-node="msup" transform="translate(1000,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><rect width="2165.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(3363.8,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="mfrac" transform="translate(4364,0)"><g data-mml-node="mrow" transform="translate(521.8,676)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mi" transform="translate(429,0)"><use data-c="1D450" xlink:href="#MJX-9-TEX-I-1D450"></use></g></g><g data-mml-node="mrow" transform="translate(220,-719.9)"><g data-mml-node="mn"><use data-c="36" xlink:href="#MJX-9-TEX-N-36"></use></g><g data-mml-node="msup" transform="translate(500,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g></g><rect width="1665.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(6491.8,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="mfrac" transform="translate(7492,0)"><g data-mml-node="mi" transform="translate(474.5,676)"><use data-c="1D451" xlink:href="#MJX-9-TEX-I-1D451"></use></g><g data-mml-node="mrow" transform="translate(220,-686)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g><g data-mml-node="mi" transform="translate(500,0)"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g></g><rect width="1229" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(8961,0) translate(0 -0.5)"><use data-c="29" xlink:href="#MJX-9-TEX-S3-29"></use></g></g><g data-mml-node="mn" transform="translate(9730,1176.6) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g><g data-mml-node="mo" transform="translate(10355.8,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="msup" transform="translate(11356,0)"><g data-mml-node="mrow"><g data-mml-node="mo" transform="translate(0 -0.5)"><use data-c="28" xlink:href="#MJX-9-TEX-S3-28"></use></g><g data-mml-node="mfrac" transform="translate(736,0)"><g data-mml-node="mi" transform="translate(518,676)"><use data-c="1D450" xlink:href="#MJX-9-TEX-I-1D450"></use></g><g data-mml-node="mrow" transform="translate(220,-686)"><g data-mml-node="mn"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g><g data-mml-node="mi" transform="translate(500,0)"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g></g><rect width="1229" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(2427.2,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="mfrac" transform="translate(3427.4,0)"><g data-mml-node="msup" transform="translate(520,676)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mn" transform="translate(462,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g><g data-mml-node="mrow" transform="translate(220,-719.9)"><g data-mml-node="mn"><use data-c="39" xlink:href="#MJX-9-TEX-N-39"></use></g><g data-mml-node="msup" transform="translate(500,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g></g><rect width="1665.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(5333,0) translate(0 -0.5)"><use data-c="29" xlink:href="#MJX-9-TEX-S3-29"></use></g></g><g data-mml-node="mn" transform="translate(6102,1176.6) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><g data-mml-node="mo" transform="translate(0,214.2)"><use data-c="221A" xlink:href="#MJX-9-TEX-S4-221A"></use></g><rect width="17861.5" height="60" x="1020" y="1904.2"></rect></g></g></g><g data-mml-node="mn" transform="translate(278,720.5) scale(0.5)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g><g data-mml-node="mo" transform="translate(0,-140.5)"><use data-c="E001" xlink:href="#MJX-9-TEX-S4-E001" transform="translate(0,1945)"></use><use data-c="23B7" xlink:href="#MJX-9-TEX-S4-23B7" transform="translate(0,-165)"></use><svg width="1056" height="1361" y="670" x="0" viewBox="0 295.5 1056 1361"><use data-c="E000" xlink:href="#MJX-9-TEX-S4-E000" transform="scale(1,3.195)"></use></svg></g><rect width="29801" height="60" x="1056" y="2349.5"></rect></g></g></g><g data-mml-node="mtr" transform="translate(0,-1180.5)"><g data-mml-node="mtd" transform="translate(572,0)"></g><g data-mml-node="mtd" transform="translate(572,0)"><g data-mml-node="mi"></g><g data-mml-node="mo" transform="translate(222.2,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="mroot" transform="translate(1222.4,0)"><g><g data-mml-node="mrow" transform="translate(1056,0)"><g data-mml-node="mrow"><g data-mml-node="mo" transform="translate(0 -0.5)"><use data-c="28" xlink:href="#MJX-9-TEX-S3-28"></use></g><g data-mml-node="mfrac" transform="translate(736,0)"><g data-mml-node="mrow" transform="translate(381,676)"><g data-mml-node="mo"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="msup" transform="translate(778,0)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mn" transform="translate(462,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><g data-mml-node="mrow" transform="translate(220,-719.2)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use><use data-c="37" xlink:href="#MJX-9-TEX-N-37" transform="translate(500,0)"></use></g><g data-mml-node="msup" transform="translate(1000,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><rect width="2165.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(3363.8,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="mfrac" transform="translate(4364,0)"><g data-mml-node="mrow" transform="translate(521.8,676)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mi" transform="translate(429,0)"><use data-c="1D450" xlink:href="#MJX-9-TEX-I-1D450"></use></g></g><g data-mml-node="mrow" transform="translate(220,-719.9)"><g data-mml-node="mn"><use data-c="36" xlink:href="#MJX-9-TEX-N-36"></use></g><g data-mml-node="msup" transform="translate(500,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g></g><rect width="1665.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(6491.8,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="mfrac" transform="translate(7492,0)"><g data-mml-node="mi" transform="translate(474.5,676)"><use data-c="1D451" xlink:href="#MJX-9-TEX-I-1D451"></use></g><g data-mml-node="mrow" transform="translate(220,-686)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g><g data-mml-node="mi" transform="translate(500,0)"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g></g><rect width="1229" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(8961,0) translate(0 -0.5)"><use data-c="29" xlink:href="#MJX-9-TEX-S3-29"></use></g></g><g data-mml-node="mo" transform="translate(9919.2,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="msqrt" transform="translate(10919.4,0)"><g transform="translate(1020,0)"><g data-mml-node="msup"><g data-mml-node="mrow"><g data-mml-node="mo" transform="translate(0 -0.5)"><use data-c="28" xlink:href="#MJX-9-TEX-S3-28"></use></g><g data-mml-node="mfrac" transform="translate(736,0)"><g data-mml-node="mrow" transform="translate(381,676)"><g data-mml-node="mo"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="msup" transform="translate(778,0)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mn" transform="translate(462,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><g data-mml-node="mrow" transform="translate(220,-719.2)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use><use data-c="37" xlink:href="#MJX-9-TEX-N-37" transform="translate(500,0)"></use></g><g data-mml-node="msup" transform="translate(1000,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><rect width="2165.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(3363.8,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="mfrac" transform="translate(4364,0)"><g data-mml-node="mrow" transform="translate(521.8,676)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mi" transform="translate(429,0)"><use data-c="1D450" xlink:href="#MJX-9-TEX-I-1D450"></use></g></g><g data-mml-node="mrow" transform="translate(220,-719.9)"><g data-mml-node="mn"><use data-c="36" xlink:href="#MJX-9-TEX-N-36"></use></g><g data-mml-node="msup" transform="translate(500,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g></g><rect width="1665.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(6491.8,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="mfrac" transform="translate(7492,0)"><g data-mml-node="mi" transform="translate(474.5,676)"><use data-c="1D451" xlink:href="#MJX-9-TEX-I-1D451"></use></g><g data-mml-node="mrow" transform="translate(220,-686)"><g data-mml-node="mn"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g><g data-mml-node="mi" transform="translate(500,0)"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g></g><rect width="1229" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(8961,0) translate(0 -0.5)"><use data-c="29" xlink:href="#MJX-9-TEX-S3-29"></use></g></g><g data-mml-node="mn" transform="translate(9730,1176.6) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g><g data-mml-node="mo" transform="translate(10355.8,0)"><use data-c="2B" xlink:href="#MJX-9-TEX-N-2B"></use></g><g data-mml-node="msup" transform="translate(11356,0)"><g data-mml-node="mrow"><g data-mml-node="mo" transform="translate(0 -0.5)"><use data-c="28" xlink:href="#MJX-9-TEX-S3-28"></use></g><g data-mml-node="mfrac" transform="translate(736,0)"><g data-mml-node="mi" transform="translate(518,676)"><use data-c="1D450" xlink:href="#MJX-9-TEX-I-1D450"></use></g><g data-mml-node="mrow" transform="translate(220,-686)"><g data-mml-node="mn"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g><g data-mml-node="mi" transform="translate(500,0)"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g></g><rect width="1229" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(2427.2,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="mfrac" transform="translate(3427.4,0)"><g data-mml-node="msup" transform="translate(520,676)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mn" transform="translate(462,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g><g data-mml-node="mrow" transform="translate(220,-719.9)"><g data-mml-node="mn"><use data-c="39" xlink:href="#MJX-9-TEX-N-39"></use></g><g data-mml-node="msup" transform="translate(500,0)"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,289) scale(0.707)"><use data-c="32" xlink:href="#MJX-9-TEX-N-32"></use></g></g></g><rect width="1665.6" height="60" x="120" y="220"></rect></g><g data-mml-node="mo" transform="translate(5333,0) translate(0 -0.5)"><use data-c="29" xlink:href="#MJX-9-TEX-S3-29"></use></g></g><g data-mml-node="mn" transform="translate(6102,1176.6) scale(0.707)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g></g></g><g data-mml-node="mo" transform="translate(0,214.2)"><use data-c="221A" xlink:href="#MJX-9-TEX-S4-221A"></use></g><rect width="17861.5" height="60" x="1020" y="1904.2"></rect></g></g></g><g data-mml-node="mn" transform="translate(278,720.5) scale(0.5)"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g><g data-mml-node="mo" transform="translate(0,-140.5)"><use data-c="E001" xlink:href="#MJX-9-TEX-S4-E001" transform="translate(0,1945)"></use><use data-c="23B7" xlink:href="#MJX-9-TEX-S4-23B7" transform="translate(0,-165)"></use><svg width="1056" height="1361" y="670" x="0" viewBox="0 295.5 1056 1361"><use data-c="E000" xlink:href="#MJX-9-TEX-S4-E000" transform="scale(1,3.195)"></use></svg></g><rect width="29801" height="60" x="1056" y="2349.5"></rect></g></g></g><g data-mml-node="mtr" transform="translate(0,-4041)"><g data-mml-node="mtd" transform="translate(572,0)"></g><g data-mml-node="mtd" transform="translate(572,0)"><g data-mml-node="mi"></g><g data-mml-node="mo" transform="translate(222.2,0)"><use data-c="2212" xlink:href="#MJX-9-TEX-N-2212"></use></g><g data-mml-node="mfrac" transform="translate(1222.4,0)"><g data-mml-node="mi" transform="translate(520,676)"><use data-c="1D44F" xlink:href="#MJX-9-TEX-I-1D44F"></use></g><g data-mml-node="mrow" transform="translate(220,-686)"><g data-mml-node="mn"><use data-c="33" xlink:href="#MJX-9-TEX-N-33"></use></g><g data-mml-node="mi" transform="translate(500,0)"><use data-c="1D44E" xlink:href="#MJX-9-TEX-I-1D44E"></use></g></g><rect width="1229" height="60" x="120" y="220"></rect></g></g></g></g></g></g></svg>
diff --git a/static/files/posts/mathyd-easy-tex-to-svg/cubic.tex.txt b/static/files/posts/mathyd-easy-tex-to-svg/cubic.tex.txt
new file mode 100644
index 0000000..6ca948c
--- /dev/null
+++ b/static/files/posts/mathyd-easy-tex-to-svg/cubic.tex.txt
@@ -0,0 +1,38 @@
+% solution to ax^3 + bx^2 + cx + d = 0
+% https://math.vanderbilt.edu/schectex/courses/cubic/
+\begin{align*}
+% first term
+x &= \sqrt[3]{
+ % first term, first subterm
+ \left ( \frac{-b^3}{27a^3} + \frac{bc}{6a^2} - \frac{d}{2a} \right ) +
+
+ \sqrt{
+ % first term, second subterm
+ \left ( \frac{-b^3}{27a^3} + \frac{bc}{6a^2} - \frac{d}{2a} \right )^2 +
+
+ % first term, third subterm
+ \left ( \frac{c}{3a} - \frac{b^2}{9a^2} \right )^3
+ }
+} \\
+
+&+
+
+% second term
+\sqrt[3]{
+ % first term, second subterm
+ \left ( \frac{-b^3}{27a^3} + \frac{bc}{6a^2} - \frac{d}{2a} \right ) -
+
+ \sqrt{
+ % second term, second subterm
+ \left ( \frac{-b^3}{27a^3} + \frac{bc}{6a^2} - \frac{d}{2a} \right )^2 +
+
+ % second term, third subterm
+ \left ( \frac{c}{3a} - \frac{b^2}{9a^2} \right )^3
+ }
+} \\
+
+&-
+
+% third part
+\frac{b}{3a}
+\end{align*}
diff --git a/static/files/posts/mathyd-easy-tex-to-svg/logo.svg b/static/files/posts/mathyd-easy-tex-to-svg/logo.svg
new file mode 100644
index 0000000..0b570e7
--- /dev/null
+++ b/static/files/posts/mathyd-easy-tex-to-svg/logo.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 108 90"><g fill='white' stroke='black'><rect x='7' y='10' width='12' height='10'><animate dur='20s' begin='0.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='7' y='20' width='12' height='10'><animate dur='20s' begin='1.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='7' y='30' width='12' height='10'><animate dur='20s' begin='2.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='7' y='40' width='12' height='10'><animate dur='20s' begin='3.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='7' y='50' width='12' height='10'><animate dur='20s' begin='4.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='7' y='50' width='12' height='10'><animate dur='20s' begin='4.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='19' y='10' width='12' height='10'><animate dur='20s' begin='0.2s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='19' y='30' width='12' height='10'><animate dur='20s' begin='2.2s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='31' y='10' width='12' height='10'><animate dur='20s' begin='0.4s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='31' y='20' width='12' height='10'><animate dur='20s' begin='1.4s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='31' y='30' width='12' height='10'><animate dur='20s' begin='2.4s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='55' y='10' width='12' height='10'><animate dur='20s' begin='0.8s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='67' y='10' width='12' height='10'><animate dur='20s' begin='1.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='67' y='20' width='12' height='10'><animate dur='20s' begin='2.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='67' y='30' width='12' height='10'><animate dur='20s' begin='3.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='67' y='40' width='12' height='10'><animate dur='20s' begin='4.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='67' y='50' width='12' height='10'><animate dur='20s' begin='5.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='79' y='10' width='12' height='10'><animate dur='20s' begin='1.2s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='7' y='70' width='12' height='10'><animate dur='20s' begin='6.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='19' y='70' width='12' height='10'><animate dur='20s' begin='6.2s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='31' y='70' width='12' height='10'><animate dur='20s' begin='6.4s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='43' y='70' width='12' height='10'><animate dur='20s' begin='6.6s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='55' y='70' width='12' height='10'><animate dur='20s' begin='6.8s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='67' y='70' width='12' height='10'><animate dur='20s' begin='7.0s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect><rect x='79' y='70' width='12' height='10'><animate dur='20s' begin='7.2s' values='#ffffff;#4e86b1;#4eb179;#ffffff' keyTimes='0;0.333;0.666;1' attributeName='fill' repeatCount='indefinite'/></rect></g></svg>