[This article was first published on rud.is"In God we trust. All others must bring data"R, and kindly contributed to R-bloggers]. (You can report issue about the content on this page here)
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.WebR 0.1.0 was released! I had been git-stalking George (the absolute genius who we all must thank for this) for a while and noticed the GH org and repos being updated earlier this week, So, I was already pretty excited.
It dropped today, and you can hit that link for all the details and other links.
I threw together a small demo to show how to get it up and running without worrying about fancy “npm projects” and the like.
View-source on that link, or look below for a very small (so, hopefully accessible) example of how to start working with WASM-ified R in a web context.
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>WebR Super Simple Demo</title><link rel="stylesheet" href="/style.css" type="text/css"><style>li { font-family:monospace;}.nospace { margin-bottom: 2px;}</style></head><body><div id="main"><p>Simple demo to show the basics of calling the new WebR WASM!!!!</p><p><code>view-source</code> to see how the sausage is made</code></p><p class="nospace">Input a number, press "Call R" (when it is enabled) and magic will happen.</p><!-- We'll pull the value from here --><input type="text" id="x" value="10"><!-- This button is disabled until WebR is loaded --><button disabled="" id="callr">Call R</button><!-- Output goes here --><div id="output"></div><!-- WebR is a module so you have to do this. --><!-- NOTE: Many browsers will not like it if `.mjs` files are served --><!-- with a content-type that isn't text/javascript --><!-- Try renaming it from .mjs to .js if you hit that snag. --><script type="module"> // https://github.com/r-wasm/webr/releases/download/v0.1.0/webr-0.1.0.tar.gz // // I was lazy and just left it in one directory import { WebR } from '/webr-d3-demo/webr.mjs'; // service workers == full path starting with / const webR = new WebR(); // get ready to Rumble await webR.init(); // shot's fired console.log("WebR"); // just for me b/c I don't trust anything anymore // we call this function on the button press async function callR() { let x = document.getElementById('x').value.trim(); // get the value we input; be better than me and do validation console.log(`x = ${x}`) // as noted, i don't trust anything let result = await webR.evalR(`rnorm(${x},5,1)`); // call some R! let output = await result.toArray(); // make the result something JS can work with document.getElementById("output").replaceChildren() // clear out the <div> (this is ugly; be better than me) // d3 ops d3.select("#output").append("ul") const ul = d3.select("ul") ul.selectAll("li") .data(output) .enter() .append("li") .text(d => d) } // by the time we get here, WebR is ready, so we tell the button what to do and re-enable the button document.getElementById('callr').onclick = callR; document.getElementById('callr').disabled = false;</script><!-- d/l from D3 site or here if you trust me --><script src="d3.min.js"></script></div></body></html>
To leave a comment for the author, please follow the link and comment on their blog: rud.is"In God we trust. All others must bring data"R.
R-bloggers.com offers daily e-mail updates about R news and tutorials about learning R and many other topics. Click here if you're looking to post or find an R/data-science job.
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.Continue reading: WebR IS HERE!