Making R source code chunk interactive inside HTML document

Here we add a button to activate interactivity in chunks. By clicking on this button, it will make the chunks interactive and it will launch an R kernel to execute some code from these interactive chunks.

clicking the below button will also launch the kernel and that could take some times to strat. Be patient…

Here is a chunk, not evaluated on purpose by Rmarkdown, and to be executed interactively, directly in this document.

print("Hello")

It is also possible to plot some data.

plot(iris)

The last two examples shows that variable are kept between chunks.

x <- "I am from the previous chunk"
cat(x)

what is to keep from this experiment ?

Without much change to existing tooling, it is possible to introduce interactivity in Rmarkdown html output, using a bit of js, custom attributes and classes, but mainly the existing open-source ecosytem offering great tooling for making this possible (thebelab, mybinder.org, jupyterlab API, irkernel, …)

This small and quick test shows that there is something to do on the R side to offer this kind of feature for Rmarkdown product.

LS0tDQp0aXRsZTogIlRlc3RpbmcgaW50ZXJhY3RpdmUgY29kZSBjaHVuayBpbiByZXN1bHRpbmcgaHRtbCBmcm9tIGFuIFJtZCBkb2N1bWVudCINCmF1dGhvcjogIkMuIERlcnZpZXV4Ig0KZGF0ZTogIjA1LzAzLzIwMjAiDQpvdXRwdXQ6IA0KICBodG1sX2RvY3VtZW50Og0KICAgIGNvZGVfZG93bmxvYWQ6IHRydWUNCi0tLQ0KDQo8IS0tIFNvbWUgc3R1ZmYgZnJvbSB0aGViZWxhYiByZXF1aXJlZCBmb3IgdGhlIG1hZ2ljIC0tPg0KPCEtLSBDb25maWd1cmUgYW5kIGxvYWQgVGhlYmUgIS0tPg0KPHNjcmlwdCB0eXBlPSJ0ZXh0L3gtdGhlYmUtY29uZmlnIj4NCiAgew0KICAgIHJlcXVlc3RLZXJuZWw6IHRydWUsDQogICAgYmluZGVyT3B0aW9uczogew0KICAgICAgcmVwbzogImJpbmRlci1leGFtcGxlcy9yIiwNCiAgICB9LA0KICAgIGtlcm5lbE9wdGlvbnM6IHsNCiAgICAgIG5hbWU6ICJSIiwNCiAgICAgIGtlcm5lbE5hbWU6ICJpciIsDQogICAgfSwNCiAgfQ0KPC9zY3JpcHQ+DQoNCjwhLS0gc2NyaXB0IGZvciB0aGViZWxhYiAtLT4NCjxzY3JpcHQgc3JjPSJodHRwczovL3VucGtnLmNvbS90aGViZWxhYkBsYXRlc3QvbGliL2luZGV4LmpzIj48L3NjcmlwdD4NCg0KYGBge3Igc2V0dXAsIGluY2x1ZGUgPSBGQUxTRX0NCmtuaXRyOjpvcHRzX2NodW5rJHNldChldmFsID0gRkFMU0UpDQpgYGANCg0KIyBNYWtpbmcgUiBzb3VyY2UgY29kZSBjaHVuayBpbnRlcmFjdGl2ZSBpbnNpZGUgSFRNTCBkb2N1bWVudA0KDQpIZXJlIHdlIGFkZCBhIGJ1dHRvbiB0byBhY3RpdmF0ZSBpbnRlcmFjdGl2aXR5IGluIGNodW5rcy4gQnkgY2xpY2tpbmcgb24gdGhpcw0KYnV0dG9uLCBpdCB3aWxsIG1ha2UgdGhlIGNodW5rcyBpbnRlcmFjdGl2ZSBhbmQgaXQgd2lsbCBsYXVuY2ggYW4gUiBrZXJuZWwgdG8NCmV4ZWN1dGUgc29tZSBjb2RlIGZyb20gdGhlc2UgaW50ZXJhY3RpdmUgY2h1bmtzLg0KDQo+IGNsaWNraW5nIHRoZSBiZWxvdyBidXR0b24gd2lsbCBhbHNvIGxhdW5jaCB0aGUga2VybmVsIGFuZCB0aGF0IGNvdWxkIHRha2Ugc29tZQ0KdGltZXMgdG8gc3RyYXQuIEJlIHBhdGllbnQuLi4NCg0KYGBge3IsIGV2YWwgPSBUUlVFLCBlY2hvID0gRkFMU0V9DQojIGFkIGEgYnV0dG9uDQpodG1sdG9vbHM6OnRhZ3MkYnV0dG9uKA0KICBpZCA9ICJhY3RpdmF0ZUJ1dHRvbiIsDQogIHN0eWxlPSJ3aWR0aDogMTAwcHg7IGhlaWdodDogNTBweDsgZm9udC1zaXplOiAxLjVlbTsiLCANCiAgIkFjdGl2YXRlIg0KKQ0KYGBgDQoNCmBgYHtqcywgZXZhbD1UUlVFLCBlY2hvID0gRkFMU0V9DQovLyB0aGViZWxhYiBqcyBzY3JpcHQNCnZhciBib290c3RyYXBUaGViZSA9IGZ1bmN0aW9uKCkgew0KICAgIHRoZWJlbGFiLmJvb3RzdHJhcCgpOw0KfQ0KZG9jdW1lbnQucXVlcnlTZWxlY3RvcigiI2FjdGl2YXRlQnV0dG9uIikuYWRkRXZlbnRMaXN0ZW5lcignY2xpY2snLCBib290c3RyYXBUaGViZSkNCmBgYA0KDQpIZXJlIGlzIGEgY2h1bmssIG5vdCBldmFsdWF0ZWQgb24gcHVycG9zZSBieSBSbWFya2Rvd24sIGFuZCB0byBiZSBleGVjdXRlZCBpbnRlcmFjdGl2ZWx5LCBkaXJlY3RseSBpbiB0aGlzIGRvY3VtZW50Lg0KDQpgYGB7ciwgYXR0ci5zb3VyY2UgPSBjKCdkYXRhLWV4ZWN1dGFibGU9InRydWUiJywgJ2RhdGEtbGFuZ3VhZ2U9InIiJyl9DQpwcmludCgiSGVsbG8iKQ0KYGBgDQoNCkl0IGlzIGFsc28gcG9zc2libGUgdG8gcGxvdCBzb21lIGRhdGEuIA0KDQpgYGB7ciwgYXR0ci5zb3VyY2UgPSBjKCdkYXRhLWV4ZWN1dGFibGU9InRydWUiJywgJ2RhdGEtbGFuZ3VhZ2U9InIiJyl9DQpwbG90KGlyaXMpDQpgYGANCg0KVGhlIGxhc3QgdHdvIGV4YW1wbGVzIHNob3dzIHRoYXQgdmFyaWFibGUgYXJlIGtlcHQgYmV0d2VlbiBjaHVua3MuDQoNCmBgYHtyLCBhdHRyLnNvdXJjZSA9IGMoJ2RhdGEtZXhlY3V0YWJsZT0idHJ1ZSInLCAnZGF0YS1sYW5ndWFnZT0iciInKX0NCnggPC0gIkkgYW0gZnJvbSB0aGUgcHJldmlvdXMgY2h1bmsiDQpgYGANCg0KYGBge3IsIGF0dHIuc291cmNlID0gYygnZGF0YS1leGVjdXRhYmxlPSJ0cnVlIicsICdkYXRhLWxhbmd1YWdlPSJyIicpfQ0KY2F0KHgpDQpgYGANCg0KIyB3aGF0IGlzIHRvIGtlZXAgZnJvbSB0aGlzIGV4cGVyaW1lbnQgPyANCg0KV2l0aG91dCBtdWNoIGNoYW5nZSB0byBleGlzdGluZyB0b29saW5nLCBpdCBpcyBwb3NzaWJsZSB0byBpbnRyb2R1Y2UNCmludGVyYWN0aXZpdHkgaW4gUm1hcmtkb3duIGh0bWwgb3V0cHV0LCB1c2luZyBhIGJpdCBvZiBqcywgY3VzdG9tIGF0dHJpYnV0ZXMgYW5kDQpjbGFzc2VzLCBidXQgbWFpbmx5IHRoZSBleGlzdGluZyBvcGVuLXNvdXJjZSBlY29zeXRlbSBvZmZlcmluZyBncmVhdCB0b29saW5nIGZvciBtYWtpbmcgdGhpcyBwb3NzaWJsZSAodGhlYmVsYWIsIG15YmluZGVyLm9yZywganVweXRlcmxhYiBBUEksIGlya2VybmVsLCAuLi4pIA0KDQpUaGlzIHNtYWxsIGFuZCBxdWljayB0ZXN0IHNob3dzIHRoYXQgdGhlcmUgaXMgc29tZXRoaW5nIHRvIGRvIG9uIHRoZSBSIHNpZGUgdG8gb2ZmZXIgdGhpcyBraW5kIG9mIGZlYXR1cmUgZm9yIFJtYXJrZG93biBwcm9kdWN0LiANCg0K