Skip to content

Instantly share code, notes, and snippets.

@timelyportfolio
Last active August 29, 2015 14:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save timelyportfolio/9a07c4b0bd514479399d to your computer and use it in GitHub Desktop.
Save timelyportfolio/9a07c4b0bd514479399d to your computer and use it in GitHub Desktop.
animated turkey sketch with R and vivus.js

Lovingly created with an iPhone (Sketchbook), Inkscape, R, and vivus.js. Happy Thanksgiving!

library(htmltools)
library(pipeR)
library(rvest)
library(XML)
html("https://gist.githubusercontent.com/timelyportfolio/9a07c4b0bd514479399d/raw/371eecc635124360cedabee3aafc24201451f954/turkey_sketch.svg") %>>%
(svg ~
html_nodes(svg,"path") %>>%
xmlApply(function(x){saveXML(x) %>>% HTML }) %>>%
(
tagList(
tags$button(
onclick="vTurkey.reset().play();"
,"replay"
)
,tags$div( style = "height:500px;width:500px"
,tagAppendChildren(
tag("svg",c(html_attrs(html_node(svg,"svg"))["viewbox"],id="turkey"))
,.
)
)
,tags$script(
"var vTurkey = new Vivus('turkey',{type: 'delayed',start:'autostart',delay:0,duration:500})"
#"new Vivus('rplot',{type: 'oneByOne',start:'autostart',delay:0,duration:500})"
)
)
)
) %>>%
attachDependencies(
htmlDependency(
name="vivus"
,version="0.1"
,src=c("href"=
"http://maxwellito.github.io/vivus/dist"
)
,script = "vivus.min.js"
)
) %>>%
html_print
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <script src="http://maxwellito.github.io/vivus/dist/vivus.min.js"></script> </head> <body> <button onclick="vTurkey.reset().play();">replay</button> <div style="height:500px;width:500px"> <svg viewbox="0 0 670.77075 831.70784" id="turkey"> <path id="path4245" d="m 219.4957,831.4839 c -13.45209,0.70812 -71.44753,-16.41889 -37.7184,-25.75523 36.32342,0.1119 83.03819,26.87454 108.88048,-12.06112 32.55368,-33.36221 -10.17605,-76.6837 -2.14055,-116.37472 -0.83481,-17.67378 3.25957,-28.40674 4.42586,-3.9431 23.57768,21.39269 28.87578,63.41926 23.92539,94.94097 -8.73407,35.84731 -47.67017,66.36082 -85.93534,63.39845 l -5.12394,0.0137 -6.31548,-0.22004 0.002,10e-4 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4243" d="m 311.00552,746.86381 c 3.5642,-21.83 -18.2726,-89.54994 -12.79076,-34.43008 1.90914,2.02512 7.69313,62.14085 12.79076,34.43008 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4241" d="m 463.90066,812.79124 c -23.80114,-2.69174 -62.43604,-9.67044 -73.85684,-22.79518 36.18871,0.11147 82.85095,27.35447 112.16204,-2.13689 18.93081,-36.16276 -11.45325,-72.13867 -35.43407,-96.87717 -15.13753,-23.25967 -48.54719,-39.58871 -55.70561,-63.36658 24.32702,16.81351 45.56435,46.17536 69.00206,67.48019 30.88747,25.28353 56.6107,78.45805 20.85752,110.2524 -10.62567,7.8611 -24.46119,7.68623 -37.0251,7.44323 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4239" d="m 290.73858,647.50261 c -58.34372,0.72035 -126.94547,-12.8945 -157.5095,-68.71553 -22.35623,-41.04424 -38.559375,-90.11575 -27.46397,-136.61434 11.38385,54.38154 16.62485,116.18331 58.96783,157.03438 60.3038,47.31504 152.72787,47.69734 215.09419,3.67375 29.14491,-17.82598 58.97483,-43.76221 61.9378,-79.98218 -27.56564,-7.54928 9.00039,-8.96369 10.77298,-16.32664 19.42101,13.06871 65.56299,2.80914 96.42991,4.27027 39.97774,-5.79536 82.10659,-22.42203 107.49884,-54.93153 10.9937,-44.93106 -49.7686,-50.41084 -80.76411,-46.16405 -33.31572,1.09334 -66.68644,3.56323 -99.70268,7.82139 -14.50031,24.46609 -12.26032,63.54582 -0.42905,77.16085 -6.97058,-21.55043 -21.6948,-42.23273 -37.91293,-13.07946 -36.3996,32.48832 -80.39662,66.89595 -132.3764,59.41477 -14.4346,3.84892 -67.36162,-4.99181 -27.4989,-11.48898 34.62162,-1.39467 72.05781,4.13903 101.59022,-18.46621 20.15954,-19.35084 72.09577,-38.14198 62.91092,-68.89493 -28.12158,-25.66563 -53.08048,-58.44636 -90.1793,-71.91347 -110.65516,51.67395 -152.04973,98.87383 -22.23867,-4.99496 -27.5841,-4.6617 -59.55851,2.07327 -87.85915,-9.84937 -32.06628,-15.83354 -46.84671,-55.06174 -40.33265,-88.94687 9.05693,39.69732 31.51021,90.93771 81.32406,84.76472 37.33034,10.54734 18.35049,-32.04694 19.05573,-51.49778 -3.81288,-55.92178 -22.81817,-111.17309 -16.32297,-167.45232 13.86031,-58.284897 68.92809,5.6683 71.4949,37.59253 11.61788,17.26174 28.64761,-36.51361 49.38987,-39.23502 30.11141,-21.72435 70.43413,-1.96846 84.61646,28.93036 17.30783,29.8066 14.6291,66.17884 4.57565,97.70146 35.7006,-22.13376 69.16537,-59.53084 114.64555,-56.94879 42.91039,15.32937 18.42215,74.19827 1.54111,102.78406 -25.63493,42.09724 -66.28719,72.32718 -107.75146,97.23619 46.76601,3.14662 97.73191,-13.70971 142.31932,6.81377 42.91421,22.35154 19.51597,77.18149 -19.22777,89.31363 -42.52029,27.3946 -94.97563,29.25503 -143.4325,30.15499 -38.11503,-19.88195 -40.7755,16.72584 -53.22556,42.15506 -33.20255,43.66194 -86.56878,72.04632 -139.93777,78.68025 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4237" d="m 455.02928,443.35759 c 27.02852,-43.20178 -47.79842,-12.76095 0,0 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4235" d="m 439.68357,410.15666 c 39.74075,-9.66401 -14.87008,-64.34819 -41.61812,-47.92932 -22.73924,-3.29495 -39.31548,3.67747 -11.99091,17.10736 18.26426,9.57111 30.07513,43.19299 53.60903,30.82196 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4233" d="M 483.41203,395.08062 C 545.14791,367.1011 606.02242,317.26502 620.51682,247.9668 634.95906,194.5791 568.62014,213.82359 546.88038,235.87649 500.66274,266.12891 462.21385,306.19656 427.576,348.862 c 31.48528,1.01371 28.89695,61.46602 55.83603,46.21862 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4231" d="m 355.5197,354.28706 c 17.25593,-9.52802 47.92107,2.04991 59.65447,-9.54895 18.54851,-35.37034 57.36531,-58.80258 70.12496,-98.55186 16.24497,-39.4433 2.40366,-99.73589 -42.69307,-111.91008 -35.90661,-2.06412 -60.87698,32.43118 -75.14842,61.32436 -5.55526,38.45537 4.48417,78.27864 -1.59749,117.16841 -23.22442,22.36885 -16.05815,-51.54128 -19.35001,-69.46846 5.6411,-42.24081 4.03848,-91.17768 -32.06923,-120.63479 -33.92695,-3.54572 -15.43099,61.068 -15.36397,84.92841 6.66219,47.04008 7.63615,94.60184 10.77007,141.83697 14.5839,3.10423 30.80371,7.97062 45.67269,4.85599 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path d="m 148.40194,535.21589 c -16.47993,-43.45184 -11.76605,-92.90917 -35.23877,-134.3107 -20.169927,-27.99635 -29.519391,-75.62913 -64.733085,-85.1931 -34.603891,1.26674 -26.470707,-25.69605 -0.921814,-30.24634 -9.6744,-29.8243 4.567249,-62.5496 -34.620824,-73.57308 -30.855997,-20.8229 3.59029,-38.4354 26.09375,-31.85943 C 38.441874,133.92186 24.274999,80.213221 55.652544,39.575546 82.998072,1.4165055 135.25419,-0.15267132 177.74738,0.71153125 223.77044,4.5869455 247.42373,58.956358 237.3643,97.222508 175.25544,333.48509 230.94994,56.608307 216.55874,44.246153 187.63156,19.397482 137.52476,13.942602 104.98385,18.964024 57.707529,29.691461 40.021774,83.595422 42.875063,126.9664 c -4.401876,30.45502 -1.825739,67.22232 38.684161,60.22554 31.317166,1.21363 77.910366,14.11024 111.036016,13.27884 76.12765,-1.47801 33.79976,72.42576 -26.97525,55.7626 -36.93367,-0.59052 -73.721982,-10.99339 -109.073968,-17.31162 -10.625466,32.7 16.004527,62.83445 28.8998,91.93152 29.249928,45.66345 55.277858,95.58587 56.092018,151.15397 0.81136,17.80002 3.84546,36.59003 6.8641,53.20864 z" style="fill:none;stroke:#a84a29;stroke-opacity:1" id="path4229"/> <path id="path4227" d="m 54.489085,302.82291 c -0.176625,-15.6333 -21.244899,5.75284 0,0 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path4223" d="M 205.3917,236.68426 C 243.40176,218.27754 -15.491301,181.66523 25.195042,206.28397 38.03888,214.8964 193.56159,253.9515 205.3917,236.68426 Z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> <path id="path3376" d="m 90.702998,273.35831 c -14.810002,-31.30892 40.208532,-6.60398 8.6234,3.52839 l -4.819966,-0.61889 -3.802947,-2.9099 -4.87e-4,4e-4 z" style="fill:none;stroke:#a84a29;stroke-opacity:1"/> </svg> </div> <script>var vTurkey = new Vivus('turkey',{type: 'delayed',start:'autostart',delay:0,duration:500})</script> </body> </html>
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment