suppressPackageStartupMessages(library(googleVis))
## Warning: package 'googleVis' was built under R version 3.3.3
## Creating a generic function for 'toJSON' from package 'jsonlite' in package 'googleVis'
M <- gvisMotionChart(Fruits, "Fruit", "Year",
options=list(width=600, height=400))
print(M, "chart")
“gvis + ChartType” Motion charts: gvisMotionChart Interactive maps: gvisGeoChart Interactive tables: gvisTable Line charts: gvisLineChart Bar charts: gvisColumnChart Tree maps: gvisTreeMap
http://cran.r-project.org/web/packages/googleVis/googleVis.pdf
G <- gvisGeoChart(Exports, locationvar="Country",
colorvar="Profit",options=list(width=800, height=600))
print(G,"chart")
## <!-- GeoChart generated in R 3.3.2 by googleVis 0.6.2 package -->
## <!-- Wed Aug 30 12:31:51 2017 -->
##
##
## <!-- jsHeader -->
## <script type="text/javascript">
##
## // jsData
## function gvisDataGeoChartID362026af4a3c () {
## var data = new google.visualization.DataTable();
## var datajson =
## [
## [
## "Germany",
## 3
## ],
## [
## "Brazil",
## 4
## ],
## [
## "United States",
## 5
## ],
## [
## "France",
## 4
## ],
## [
## "Hungary",
## 3
## ],
## [
## "India",
## 2
## ],
## [
## "Iceland",
## 1
## ],
## [
## "Norway",
## 4
## ],
## [
## "Spain",
## 5
## ],
## [
## "Turkey",
## 1
## ]
## ];
## data.addColumn('string','Country');
## data.addColumn('number','Profit');
## data.addRows(datajson);
## return(data);
## }
##
## // jsDrawChart
## function drawChartGeoChartID362026af4a3c() {
## var data = gvisDataGeoChartID362026af4a3c();
## var options = {};
## options["width"] = 800;
## options["height"] = 600;
##
##
## var chart = new google.visualization.GeoChart(
## document.getElementById('GeoChartID362026af4a3c')
## );
## chart.draw(data,options);
##
##
## }
##
##
## // jsDisplayChart
## (function() {
## var pkgs = window.__gvisPackages = window.__gvisPackages || [];
## var callbacks = window.__gvisCallbacks = window.__gvisCallbacks || [];
## var chartid = "geochart";
##
## // Manually see if chartid is in pkgs (not all browsers support Array.indexOf)
## var i, newPackage = true;
## for (i = 0; newPackage && i < pkgs.length; i++) {
## if (pkgs[i] === chartid)
## newPackage = false;
## }
## if (newPackage)
## pkgs.push(chartid);
##
## // Add the drawChart function to the global list of callbacks
## callbacks.push(drawChartGeoChartID362026af4a3c);
## })();
## function displayChartGeoChartID362026af4a3c() {
## var pkgs = window.__gvisPackages = window.__gvisPackages || [];
## var callbacks = window.__gvisCallbacks = window.__gvisCallbacks || [];
## window.clearTimeout(window.__gvisLoad);
## // The timeout is set to 100 because otherwise the container div we are
## // targeting might not be part of the document yet
## window.__gvisLoad = setTimeout(function() {
## var pkgCount = pkgs.length;
## google.load("visualization", "1", { packages:pkgs, callback: function() {
## if (pkgCount != pkgs.length) {
## // Race condition where another setTimeout call snuck in after us; if
## // that call added a package, we must not shift its callback
## return;
## }
## while (callbacks.length > 0)
## callbacks.shift()();
## } });
## }, 100);
## }
##
## // jsFooter
## </script>
##
## <!-- jsChart -->
## <script type="text/javascript" src="https://www.google.com/jsapi?callback=displayChartGeoChartID362026af4a3c"></script>
##
## <!-- divChart -->
##
## <div id="GeoChartID362026af4a3c"
## style="width: 800; height: 600;">
## </div>
Specifying Region
G2 <- gvisGeoChart(Exports, locationvar="Country",
colorvar="Profit",options=list(width=600, height=400,region="150"))
print(G2,"chart")
## <!-- GeoChart generated in R 3.3.2 by googleVis 0.6.2 package -->
## <!-- Wed Aug 30 12:31:52 2017 -->
##
##
## <!-- jsHeader -->
## <script type="text/javascript">
##
## // jsData
## function gvisDataGeoChartID362068a9200a () {
## var data = new google.visualization.DataTable();
## var datajson =
## [
## [
## "Germany",
## 3
## ],
## [
## "Brazil",
## 4
## ],
## [
## "United States",
## 5
## ],
## [
## "France",
## 4
## ],
## [
## "Hungary",
## 3
## ],
## [
## "India",
## 2
## ],
## [
## "Iceland",
## 1
## ],
## [
## "Norway",
## 4
## ],
## [
## "Spain",
## 5
## ],
## [
## "Turkey",
## 1
## ]
## ];
## data.addColumn('string','Country');
## data.addColumn('number','Profit');
## data.addRows(datajson);
## return(data);
## }
##
## // jsDrawChart
## function drawChartGeoChartID362068a9200a() {
## var data = gvisDataGeoChartID362068a9200a();
## var options = {};
## options["width"] = 600;
## options["height"] = 400;
## options["region"] = "150";
##
##
## var chart = new google.visualization.GeoChart(
## document.getElementById('GeoChartID362068a9200a')
## );
## chart.draw(data,options);
##
##
## }
##
##
## // jsDisplayChart
## (function() {
## var pkgs = window.__gvisPackages = window.__gvisPackages || [];
## var callbacks = window.__gvisCallbacks = window.__gvisCallbacks || [];
## var chartid = "geochart";
##
## // Manually see if chartid is in pkgs (not all browsers support Array.indexOf)
## var i, newPackage = true;
## for (i = 0; newPackage && i < pkgs.length; i++) {
## if (pkgs[i] === chartid)
## newPackage = false;
## }
## if (newPackage)
## pkgs.push(chartid);
##
## // Add the drawChart function to the global list of callbacks
## callbacks.push(drawChartGeoChartID362068a9200a);
## })();
## function displayChartGeoChartID362068a9200a() {
## var pkgs = window.__gvisPackages = window.__gvisPackages || [];
## var callbacks = window.__gvisCallbacks = window.__gvisCallbacks || [];
## window.clearTimeout(window.__gvisLoad);
## // The timeout is set to 100 because otherwise the container div we are
## // targeting might not be part of the document yet
## window.__gvisLoad = setTimeout(function() {
## var pkgCount = pkgs.length;
## google.load("visualization", "1", { packages:pkgs, callback: function() {
## if (pkgCount != pkgs.length) {
## // Race condition where another setTimeout call snuck in after us; if
## // that call added a package, we must not shift its callback
## return;
## }
## while (callbacks.length > 0)
## callbacks.shift()();
## } });
## }, 100);
## }
##
## // jsFooter
## </script>
##
## <!-- jsChart -->
## <script type="text/javascript" src="https://www.google.com/jsapi?callback=displayChartGeoChartID362068a9200a"></script>
##
## <!-- divChart -->
##
## <div id="GeoChartID362068a9200a"
## style="width: 600; height: 400;">
## </div>
More options line chart
df <- data.frame(label=c("US", "GB", "BR"), val1=c(1,3,4), val2=c(23,12,32))
Line <- gvisLineChart(df, xvar="label", yvar=c("val1","val2"),
options=list(title="Hello World", legend="bottom",
titleTextStyle="{color:'red', fontSize:18}",
vAxis="{gridlines:{color:'red', count:3}}",
hAxis="{title:'My Label', titleTextStyle:{color:'blue'}}",
series="[{color:'green', targetAxisIndex: 0},
{color: 'blue',targetAxisIndex:1}]",
vAxes="[{title:'Value 1 (%)', format:'##,######%'},
{title:'Value 2 (\U00A3)'}]",
curveType="function", width=500, height=300
))
print(Line, "chart")
## <!-- LineChart generated in R 3.3.2 by googleVis 0.6.2 package -->
## <!-- Wed Aug 30 12:31:52 2017 -->
##
##
## <!-- jsHeader -->
## <script type="text/javascript">
##
## // jsData
## function gvisDataLineChartID362073742b21 () {
## var data = new google.visualization.DataTable();
## var datajson =
## [
## [
## "US",
## 1,
## 23
## ],
## [
## "GB",
## 3,
## 12
## ],
## [
## "BR",
## 4,
## 32
## ]
## ];
## data.addColumn('string','label');
## data.addColumn('number','val1');
## data.addColumn('number','val2');
## data.addRows(datajson);
## return(data);
## }
##
## // jsDrawChart
## function drawChartLineChartID362073742b21() {
## var data = gvisDataLineChartID362073742b21();
## var options = {};
## options["allowHtml"] = true;
## options["title"] = "Hello World";
## options["legend"] = "bottom";
## options["titleTextStyle"] = {color:'red', fontSize:18};
## options["vAxis"] = {gridlines:{color:'red', count:3}};
## options["hAxis"] = {title:'My Label', titleTextStyle:{color:'blue'}};
## options["series"] = [{color:'green', targetAxisIndex: 0},
## {color: 'blue',targetAxisIndex:1}];
## options["vAxes"] = [{title:'Value 1 (%)', format:'##,######%'},
## {title:'Value 2 (£)'}];
## options["curveType"] = "function";
## options["width"] = 500;
## options["height"] = 300;
##
##
## var chart = new google.visualization.LineChart(
## document.getElementById('LineChartID362073742b21')
## );
## chart.draw(data,options);
##
##
## }
##
##
## // jsDisplayChart
## (function() {
## var pkgs = window.__gvisPackages = window.__gvisPackages || [];
## var callbacks = window.__gvisCallbacks = window.__gvisCallbacks || [];
## var chartid = "corechart";
##
## // Manually see if chartid is in pkgs (not all browsers support Array.indexOf)
## var i, newPackage = true;
## for (i = 0; newPackage && i < pkgs.length; i++) {
## if (pkgs[i] === chartid)
## newPackage = false;
## }
## if (newPackage)
## pkgs.push(chartid);
##
## // Add the drawChart function to the global list of callbacks
## callbacks.push(drawChartLineChartID362073742b21);
## })();
## function displayChartLineChartID362073742b21() {
## var pkgs = window.__gvisPackages = window.__gvisPackages || [];
## var callbacks = window.__gvisCallbacks = window.__gvisCallbacks || [];
## window.clearTimeout(window.__gvisLoad);
## // The timeout is set to 100 because otherwise the container div we are
## // targeting might not be part of the document yet
## window.__gvisLoad = setTimeout(function() {
## var pkgCount = pkgs.length;
## google.load("visualization", "1", { packages:pkgs, callback: function() {
## if (pkgCount != pkgs.length) {
## // Race condition where another setTimeout call snuck in after us; if
## // that call added a package, we must not shift its callback
## return;
## }
## while (callbacks.length > 0)
## callbacks.shift()();
## } });
## }, 100);
## }
##
## // jsFooter
## </script>
##
## <!-- jsChart -->
## <script type="text/javascript" src="https://www.google.com/jsapi?callback=displayChartLineChartID362073742b21"></script>
##
## <!-- divChart -->
##
## <div id="LineChartID362073742b21"
## style="width: 500; height: 300;">
## </div>
G <- gvisGeoChart(Exports, "Country", "Profit",options=list(width=200, height=100))
T1 <- gvisTable(Exports,options=list(width=200, height=270))
M <- gvisMotionChart(Fruits, "Fruit", "Year", options=list(width=400, height=370))
GT <- gvisMerge(G,T1, horizontal=FALSE)
GTM <- gvisMerge(GT, M, horizontal=TRUE,tableOptions="bgcolor=\"#CCCCCC\" cellspacing=10")
Things you can do with Google Vis
The visualizations can be embedded in websites with HTML code Dynamic visualizations can be built with Shiny, Rook, and R.rsp Embed them in R markdown based documents Set results=“asis” in the chunk options Can be used with knitr and slidify