Interactive Graph with R

Jacob Cheng


Introduction

While interactive and dynamic visualization becomes more popular in the data science world, RStudio recently offers new techniques to allow users to generate the interactive graphs, either standalone or embed in a document, through Shiny, ggvis and RMarkdown. The interactive graph defined here is being able to take the user input for recalculation and reflect the changes accordingly with Shiny client-server framework heavily leveraged. Below are three simple examples made by RStudio and then published to the web with free personal account. Please click on the key word to be directed to the applications. Enjoy them and have fun!


Example


Statistical Application

You could leverage this integrated platform to develop mathematically advanced tools or functional dashboards that excel cannot handle for both internal use or prototyping an online analytical application. The professional plan can authenticate users with password protected access for privacy and security without idle operation status. For more information please visit the Shiny (by RStudio) website at the following link: https://shiny.rstudio.com.


Dynamic Plot

By way of contrast, a fancy visualization without recalculation is another type of interactive graph that I usually call dynamic plot (actually the name is arbitrary and sometimes used interchangeably). A very popular way to generate dynamic plots is with plotly while some more specialized tools also available. These plots are based on htmlwidgets framework for embedding many front-end techniques (such as HTML, CSS and JavaScrips) into R automatically to to build dynamic and polished formatting. Once generated are portable html documents across platforms, so you can post them online or viem them locally with an internet browser. Below are three simple examples. More examples can be found in RPubs (by RStudio) website at the following link: https://rpubs.com.


Reporting Dashboard

Nowadays dynamic plots are very often seen in an online dashboard but building a dynamic dashboard requires more works. A dashboard can have multiple pages (themes) and each page usually include multiple graphs and tables together. Also, all the garaphs and tables in a page should be linked together so as to be changed together according to userโ€™s interactive input such as filtering the population or changing the metrics. These works can be done relatively easy with the help of BI tools (such as Tableau). Here is an example to embed an external dashboard by Google Data Studio in RMarkdwon document.


Last update: 4/11/2020

LS0tDQpvdXRwdXQ6IA0KICBodG1sX25vdGVib29rOg0KICAgICB0aGVtZTogbHVtZW4NCi0tLQ0KDQpgYGB7ciBzZXR1cCwgaW5jbHVkZT1GQUxTRX0NCmtuaXRyOjpvcHRzX2NodW5rJHNldChlY2hvPVQpDQpgYGANCg0KPGgxPiBJbnRlcmFjdGl2ZSBHcmFwaCB3aXRoIFIgIDxpbWcgc3JjPSJsb2dvLnBuZyIgYWxpZ249InJpZ2h0IiB3aWR0aD0iMTYwIiBoZWlnaHQ9IjUwIiAvPiA8L2gxPg0KDQo8aDQ+IDxlbT5KYWNvYiBDaGVuZzwvZW0+IDwvaDQ+DQoNCioqKg0KIyMjIEludHJvZHVjdGlvbg0KV2hpbGUgaW50ZXJhY3RpdmUgYW5kIGR5bmFtaWMgdmlzdWFsaXphdGlvbiBiZWNvbWVzIG1vcmUgcG9wdWxhciBpbiB0aGUgZGF0YSBzY2llbmNlIHdvcmxkLCAqKlJTdHVkaW8qKiByZWNlbnRseSBvZmZlcnMgbmV3IHRlY2huaXF1ZXMgdG8gYWxsb3cgdXNlcnMgdG8gZ2VuZXJhdGUgdGhlIGludGVyYWN0aXZlIGdyYXBocywgZWl0aGVyIHN0YW5kYWxvbmUgb3IgZW1iZWQgaW4gYSBkb2N1bWVudCwgdGhyb3VnaCBgU2hpbnlgLCBgZ2d2aXNgIGFuZCBgUk1hcmtkb3duYC4gVGhlIGludGVyYWN0aXZlIGdyYXBoIGRlZmluZWQgaGVyZSBpcyBiZWluZyBhYmxlIHRvIHRha2UgdGhlIHVzZXIgaW5wdXQgZm9yIHJlY2FsY3VsYXRpb24gYW5kIHJlZmxlY3QgdGhlIGNoYW5nZXMgYWNjb3JkaW5nbHkgd2l0aCBgU2hpbnlgIGNsaWVudC1zZXJ2ZXIgZnJhbWV3b3JrIGhlYXZpbHkgbGV2ZXJhZ2VkLiBCZWxvdyBhcmUgdGhyZWUgc2ltcGxlIGV4YW1wbGVzIG1hZGUgYnkgUlN0dWRpbyBhbmQgdGhlbiBwdWJsaXNoZWQgdG8gdGhlIHdlYiB3aXRoIGZyZWUgcGVyc29uYWwgYWNjb3VudC4gUGxlYXNlIGNsaWNrIG9uIHRoZSA8Zm9udCBjb2xvcj0iYmx1ZSI+PHU+a2V5IHdvcmQ8L3U+PC9mb250PiB0byBiZSBkaXJlY3RlZCB0byB0aGUgYXBwbGljYXRpb25zLiBFbmpveSB0aGVtIGFuZCBoYXZlIGZ1biENCg0KDQoqKioNCiMjIyBFeGFtcGxlDQoqICoqRGVtbyAxOioqIDx1PltLLU1lYW5zIENsdXN0ZXJpbmddKGh0dHBzOi8vamNoZW5nOTkuc2hpbnlhcHBzLmlvL2stbWVhbnNfY2x1c3RlcmluZyk8L3U+IC0gY2hvb3NlIGFueSBwYWlycyBvZiBkaW1lbnNpb25zIGFuZCBob3cgbWFueSBncm91cHMgeW91IHdhbnQgdG8gc2VnbWVudCB0aGUgb2JzZXJ2YXRpb25zLiBUaGlzIGlzIGEgc3RhbmRhbG9uZSBkeW5hbWljIGdyYXBoIHdpdGggYFNoaW55QXBwYCBmdW5jdGlvbiwgcG9zdGVkIG9uICpzaGlueWFwcHMuaW8qLg0KDQoqICoqRGVtbyAyOioqIDx1PltEaXN0cmlidXRpb24gU21vb3RoaW5nXShodHRwczovL2pjaGVuZzk5LnNoaW55YXBwcy5pby9JbnRlcmFjdGl2ZV9nZ3Zpc19wbG90KTwvdT4gLSBjaG9vc2UgdGhlIGRlbnNpdHkgZXN0aW1hdGlvbiBtZXRob2QgYW5kIGhvdyBzbW9vdGggeW91IHdhbnQgdG8gcGxvdCB0aGUgZGVuc2l0eSBjaGFydC4gVGhpcyBpcyBkeW5hbWljIGBnZ3Zpc2AgcGxvdCBlbWJlZCB3aXRoaW4gYFJNYXJrZHdvbmAgZG9jdW1lbnQsIHBvc3RlZCBvbiAqc2hpbnlhcHBzLmlvKi4NCg0KKiAqKkRlbW8gMzoqKiA8dT5bRGlzdHJpYnV0aW9uIEJpbnNdKGh0dHBzOi8vamNoZW5nOTkuc2hpbnlhcHBzLmlvL0ludGVyYWN0aXZlU2hpbnlBcHAvKTwvdT4gLSBjaG9vc2UgaG93IG1hbnkgYmlucyBhbmQgdGhlIGRpc3RyaWJ1dGlvbiB0eXBlIHlvdSB3YW50IHRvIGRpc3BsYXkgdGhlIGhpc3RvZ3JhbSBjaGFydC4gVGhpcyBpcyBhIHN0YW5kYXJkIGBTaGlueWAgYXBwIGJ1dCBlbWJlZCB3aXRoaW4gYFJNYXJrZHdvbmAgZG9jdW1lbnQsIHBvc3RlZCBvbiAqc2hpbnlhcHBzLmlvKi4NCg0KKiAqKk5vdGU6KiogU2hpbnkgZGVtbyBhcHBzIG1heSBiZSBpbiB0aGUgaWRsZSBzdGF0dXMgd2hlbiBub3Qgb2Z0ZW4gdXNlZCB3aXRoIGEgcGVyc29uYWwgYWNjb3VudC4gUGxlYXNlIGJlIHBhdGllbnQgaWYgaXQgdGFrZXMgYSBtb21lbnQgdG8gcmVzdW1lIHRoZSBvcGVyYXRpb24gaW4gdGhlIHNlcnZlciBzaWRlLg0KDQoNCioqKg0KIyMjIFN0YXRpc3RpY2FsIEFwcGxpY2F0aW9uDQpZb3UgY291bGQgbGV2ZXJhZ2UgdGhpcyBpbnRlZ3JhdGVkIHBsYXRmb3JtIHRvIGRldmVsb3AgbWF0aGVtYXRpY2FsbHkgYWR2YW5jZWQgdG9vbHMgb3IgZnVuY3Rpb25hbCBkYXNoYm9hcmRzIHRoYXQgZXhjZWwgY2Fubm90IGhhbmRsZSBmb3IgYm90aCBpbnRlcm5hbCB1c2Ugb3IgcHJvdG90eXBpbmcgYW4gb25saW5lIGFuYWx5dGljYWwgYXBwbGljYXRpb24uIFRoZSBwcm9mZXNzaW9uYWwgcGxhbiBjYW4gYXV0aGVudGljYXRlIHVzZXJzIHdpdGggcGFzc3dvcmQgcHJvdGVjdGVkIGFjY2VzcyBmb3IgcHJpdmFjeSBhbmQgc2VjdXJpdHkgd2l0aG91dCBpZGxlIG9wZXJhdGlvbiBzdGF0dXMuIEZvciBtb3JlIGluZm9ybWF0aW9uIHBsZWFzZSB2aXNpdCB0aGUgKipTaGlueSoqIChieSBSU3R1ZGlvKSB3ZWJzaXRlIGF0IHRoZSBmb2xsb3dpbmcgbGluazogPGh0dHBzOi8vc2hpbnkucnN0dWRpby5jb20+Lg0KDQoNCioqKg0KIyMjIER5bmFtaWMgUGxvdA0KQnkgd2F5IG9mIGNvbnRyYXN0LCBhIGZhbmN5IHZpc3VhbGl6YXRpb24gd2l0aG91dCByZWNhbGN1bGF0aW9uIGlzIGFub3RoZXIgdHlwZSBvZiBpbnRlcmFjdGl2ZSBncmFwaCB0aGF0IEkgdXN1YWxseSBjYWxsIGR5bmFtaWMgcGxvdCAoYWN0dWFsbHkgdGhlIG5hbWUgaXMgYXJiaXRyYXJ5IGFuZCBzb21ldGltZXMgdXNlZCBpbnRlcmNoYW5nZWFibHkpLiBBIHZlcnkgcG9wdWxhciB3YXkgdG8gZ2VuZXJhdGUgZHluYW1pYyBwbG90cyBpcyB3aXRoIGBwbG90bHlgIHdoaWxlIHNvbWUgbW9yZSBzcGVjaWFsaXplZCB0b29scyBhbHNvIGF2YWlsYWJsZS4gVGhlc2UgcGxvdHMgYXJlIGJhc2VkIG9uIGBodG1sd2lkZ2V0c2AgZnJhbWV3b3JrIGZvciBlbWJlZGRpbmcgbWFueSBmcm9udC1lbmQgdGVjaG5pcXVlcyAoc3VjaCBhcyBIVE1MLCBDU1MgYW5kIEphdmFTY3JpcHMpIGludG8gUiBhdXRvbWF0aWNhbGx5IHRvIHRvIGJ1aWxkIGR5bmFtaWMgYW5kIHBvbGlzaGVkIGZvcm1hdHRpbmcuIE9uY2UgZ2VuZXJhdGVkIGFyZSBwb3J0YWJsZSBodG1sIGRvY3VtZW50cyBhY3Jvc3MgcGxhdGZvcm1zLCBzbyB5b3UgY2FuIHBvc3QgdGhlbSBvbmxpbmUgb3IgdmllbSB0aGVtIGxvY2FsbHkgd2l0aCBhbiBpbnRlcm5ldCBicm93c2VyLiBCZWxvdyBhcmUgdGhyZWUgc2ltcGxlIGV4YW1wbGVzLiBNb3JlIGV4YW1wbGVzIGNhbiBiZSBmb3VuZCBpbiAqKlJQdWJzKiogKGJ5IFJTdHVkaW8pIHdlYnNpdGUgYXQgdGhlIGZvbGxvd2luZyBsaW5rOiA8aHR0cHM6Ly9ycHVicy5jb20+Lg0KDQoqICoqRGVtbyA0OioqIDx1PltCb3ggcGxvdHNdKGh0dHBzOi8vcnB1YnMuY29tL2NoZW5naGplLzU5NDgyNik8L3U+IC0gdHlwaWNhbCBgcGxvdGx5YCBncmFwaCB0byBjb21wYXJlIDUgZ3JvdXBzIHdpdGggZHluYW1pY2FseSBkaXNwbGF5ZWQgZGF0YSBsYWJsZXMgYW5kIGFkanVzdGFibGUgc2l6ZSwgcG9zdGVkIG9uICpycHVicy5jb20qLg0KDQoqICoqRGVtbyA1OioqIDx1PltUaW1lIFNlcmllc10oaHR0cHM6Ly9ycHVicy5jb20vY2hlbmdoamUvNTk0NjYxKTwvdT4gLSBkeW5hbWljIHRpbWUgc2VyaWVzIHBsb3Qgd2l0aCBhIGNoYW5nYWJsZSBkYXRlIHJhbmUsIGdlbmVyYXRlZCBieSBgZHlncmFwaGAgcGFja2FnZSBhbmQgcG9zdGVkIG9uICpycHVicy5jb20qLg0KDQoqICoqRGVtbyA2OioqIDx1PltTY2F0dGVyIFBsb3RdKGh0dHBzOi8vcnB1YnMuY29tL2NoZW5naGplLzU5NDczOCk8L3U+IC0gZHluYW1pYyBzY2F0dGVyIHBsb3Qgd2l0aCBpbnRlcmFjdGl2ZSB0b29scGl0LCBnZW5lcmF0ZWQgYnlgZ2dpcmFwaGAgcGFja2FnZSBhbmQgcG9zdGVkIG9uICpycHVicy5jb20qLg0KDQoqICoqTm90ZToqKiBObyBsaWtlIFNoaW55IGFwcGxpY2F0aW9ucywgdGhlc2UgcG9zdGVkIGR5bmFtaWMgcGxvdHMgY2FuIGJlIGFjY2Vzc2VkIG9ubGluZSByZWxhdGl2ZWx5IGZhc3QuDQoNCg0KKioqDQojIyMgUmVwb3J0aW5nIERhc2hib2FyZA0KTm93YWRheXMgZHluYW1pYyBwbG90cyBhcmUgdmVyeSBvZnRlbiBzZWVuIGluIGFuIG9ubGluZSBkYXNoYm9hcmQgYnV0IGJ1aWxkaW5nIGEgZHluYW1pYyBkYXNoYm9hcmQgcmVxdWlyZXMgbW9yZSB3b3Jrcy4gQSBkYXNoYm9hcmQgY2FuIGhhdmUgbXVsdGlwbGUgcGFnZXMgKHRoZW1lcykgYW5kIGVhY2ggcGFnZSB1c3VhbGx5IGluY2x1ZGUgbXVsdGlwbGUgZ3JhcGhzIGFuZCB0YWJsZXMgdG9nZXRoZXIuIEFsc28sIGFsbCB0aGUgZ2FyYXBocyBhbmQgdGFibGVzIGluIGEgcGFnZSBzaG91bGQgYmUgbGlua2VkIHRvZ2V0aGVyIHNvIGFzIHRvIGJlIGNoYW5nZWQgdG9nZXRoZXIgYWNjb3JkaW5nIHRvIHVzZXIncyBpbnRlcmFjdGl2ZSBpbnB1dCBzdWNoIGFzIGZpbHRlcmluZyB0aGUgcG9wdWxhdGlvbiBvciBjaGFuZ2luZyB0aGUgbWV0cmljcy4gVGhlc2Ugd29ya3MgY2FuIGJlIGRvbmUgcmVsYXRpdmVseSBlYXN5IHdpdGggdGhlIGhlbHAgb2YgQkkgdG9vbHMgKHN1Y2ggYXMgVGFibGVhdSkuIEhlcmUgaXMgYW4gZXhhbXBsZSB0byBlbWJlZCBhbiBleHRlcm5hbCBkYXNoYm9hcmQgYnkgR29vZ2xlIERhdGEgU3R1ZGlvIGluIGBSTWFya2R3b25gIGRvY3VtZW50Lg0KDQo8aWZyYW1lIHdpZHRoPSI3MDAiIGhlaWdodD0iNTAwIiBzcmM9Imh0dHBzOi8vZGF0YXN0dWRpby5nb29nbGUuY29tL2VtYmVkL3JlcG9ydGluZy8xV1J1LWpyS2NKNDNHT2hHMFdZanp1S1Q1QXN0SXlReGovcGFnZS9kMm5kIiBmcmFtZWJvcmRlcj0iMCIgc3R5bGU9ImJvcmRlcjowIiBhbGxvd2Z1bGxzY3JlZW4+PC9pZnJhbWU+DQoNCiogKipQYWdlIDE6KiogQ3VtaWxhdGl2ZSBtb3J0YWxpdHkgY291bnQsIGNhbiBzZWxlY3Qgc3ViZ3JvdXAgYnkgeWVhci4NCiogKipQYWdlIDI6KiogTGVudGggb2Ygc3RheSB2aWV3IChMT1MpLCBjYW4gc2VsZWN0IHViZ3JvdXAgYnkgeWVhciBhbmQgc2V2ZXJpdHkgbGV2ZWwuDQoqICoqUGFnZSAzOioqIE1vcnRhbGl0eSB2cyBMT1Mgc2NhdHRlcnBsb3QgKG1vbnRobHkgYWdncmVnYXRpb24pLCBjYW4gc2VsZWN0IHViZ3JvdXAgIGJ5IHllYXIuDQoqICoqUGFnZSA0OioqIE1vbnRobHkgbW9ydGFsaXR5IGFuZCBMT1MgcmVwb3J0IChiYXIgY2hhcnRzKSwgY2FuIHNlbGVjdCB1Ymdyb3VwICBieSB5ZWFyLg0KKiAqKlBhZ2UgNToqKiBNYXAgZm9yIG1vcnRhbGl0eSBjb3VudCwgY2FuIHNlbGVjdCB1Ymdyb3VwIGJ5IHN0YXRlIGFuZCBzZXZlcml0eSBsZXZlbC4NCg0KKioqDQpMYXN0IHVwZGF0ZTogNC8xMS8yMDIwDQo=