Skip to content

Instantly share code, notes, and snippets.

@ramnathv
Created October 18, 2013 01:21
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 ramnathv/7035020 to your computer and use it in GitHub Desktop.
Save ramnathv/7035020 to your computer and use it in GitHub Desktop.
DataTables Options
library(rCharts)
dTable(iris,
# sort descending based on 2nd column (js indexes from 0)
aaSorting = list(c(1, "desc")),
# display 20 rows per page
iDisplayStart = 20
)
<!doctype HTML>
<meta charset = 'utf-8'>
<html>
<head>
<link rel='stylesheet' href="http://netdna.bootstrapcdn.com/bootswatch/2.3.1/cosmo/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" >
<link rel='stylesheet' href="http://getbootstrap.com/2.3.2/assets/js/google-code-prettify/prettify.css">
<link rel='stylesheet' href="http://aozora.github.io/bootplus/assets/css/docs.css">
<link rel='stylesheet' href='http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css'>
<script src='http://code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'></script>
<script src='http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js' type='text/javascript'></script>
<style>
.rChart {
display: block
margin: auto auto;
width: 100%;
height: 400px;
}
/*
body {
margin-top: 60px;
}
*/
</style>
</head>
<body>
<div class='container'>
<div class='row'>
<div class='span8'>
<div class="bs-docs-example">
<table id='chart1ab45cc9df2' class='rChart datatables'>
</table>
<br/>
<pre><code class='r'>library(rCharts)
dTable(iris,
# sort descending based on 2nd column (js indexes from 0)
aaSorting = list(c(1, &quot;desc&quot;)),
# display 20 rows per page
iDisplayStart = 20
)
</code></pre>
</div>
</div>
</div>
</div>
<script type="text/javascript" charset="utf-8">
var chartParamschart1ab45cc9df2 = {
"dom": "chart1ab45cc9df2",
"width": 700,
"height": 400,
"table": {
"aaData": [
[
5.1,
3.5,
1.4,
0.2,
"setosa"
],
[
4.9,
3,
1.4,
0.2,
"setosa"
],
[
4.7,
3.2,
1.3,
0.2,
"setosa"
],
[
4.6,
3.1,
1.5,
0.2,
"setosa"
],
[
5,
3.6,
1.4,
0.2,
"setosa"
],
[
5.4,
3.9,
1.7,
0.4,
"setosa"
],
[
4.6,
3.4,
1.4,
0.3,
"setosa"
],
[
5,
3.4,
1.5,
0.2,
"setosa"
],
[
4.4,
2.9,
1.4,
0.2,
"setosa"
],
[
4.9,
3.1,
1.5,
0.1,
"setosa"
],
[
5.4,
3.7,
1.5,
0.2,
"setosa"
],
[
4.8,
3.4,
1.6,
0.2,
"setosa"
],
[
4.8,
3,
1.4,
0.1,
"setosa"
],
[
4.3,
3,
1.1,
0.1,
"setosa"
],
[
5.8,
4,
1.2,
0.2,
"setosa"
],
[
5.7,
4.4,
1.5,
0.4,
"setosa"
],
[
5.4,
3.9,
1.3,
0.4,
"setosa"
],
[
5.1,
3.5,
1.4,
0.3,
"setosa"
],
[
5.7,
3.8,
1.7,
0.3,
"setosa"
],
[
5.1,
3.8,
1.5,
0.3,
"setosa"
],
[
5.4,
3.4,
1.7,
0.2,
"setosa"
],
[
5.1,
3.7,
1.5,
0.4,
"setosa"
],
[
4.6,
3.6,
1,
0.2,
"setosa"
],
[
5.1,
3.3,
1.7,
0.5,
"setosa"
],
[
4.8,
3.4,
1.9,
0.2,
"setosa"
],
[
5,
3,
1.6,
0.2,
"setosa"
],
[
5,
3.4,
1.6,
0.4,
"setosa"
],
[
5.2,
3.5,
1.5,
0.2,
"setosa"
],
[
5.2,
3.4,
1.4,
0.2,
"setosa"
],
[
4.7,
3.2,
1.6,
0.2,
"setosa"
],
[
4.8,
3.1,
1.6,
0.2,
"setosa"
],
[
5.4,
3.4,
1.5,
0.4,
"setosa"
],
[
5.2,
4.1,
1.5,
0.1,
"setosa"
],
[
5.5,
4.2,
1.4,
0.2,
"setosa"
],
[
4.9,
3.1,
1.5,
0.2,
"setosa"
],
[
5,
3.2,
1.2,
0.2,
"setosa"
],
[
5.5,
3.5,
1.3,
0.2,
"setosa"
],
[
4.9,
3.6,
1.4,
0.1,
"setosa"
],
[
4.4,
3,
1.3,
0.2,
"setosa"
],
[
5.1,
3.4,
1.5,
0.2,
"setosa"
],
[
5,
3.5,
1.3,
0.3,
"setosa"
],
[
4.5,
2.3,
1.3,
0.3,
"setosa"
],
[
4.4,
3.2,
1.3,
0.2,
"setosa"
],
[
5,
3.5,
1.6,
0.6,
"setosa"
],
[
5.1,
3.8,
1.9,
0.4,
"setosa"
],
[
4.8,
3,
1.4,
0.3,
"setosa"
],
[
5.1,
3.8,
1.6,
0.2,
"setosa"
],
[
4.6,
3.2,
1.4,
0.2,
"setosa"
],
[
5.3,
3.7,
1.5,
0.2,
"setosa"
],
[
5,
3.3,
1.4,
0.2,
"setosa"
],
[
7,
3.2,
4.7,
1.4,
"versicolor"
],
[
6.4,
3.2,
4.5,
1.5,
"versicolor"
],
[
6.9,
3.1,
4.9,
1.5,
"versicolor"
],
[
5.5,
2.3,
4,
1.3,
"versicolor"
],
[
6.5,
2.8,
4.6,
1.5,
"versicolor"
],
[
5.7,
2.8,
4.5,
1.3,
"versicolor"
],
[
6.3,
3.3,
4.7,
1.6,
"versicolor"
],
[
4.9,
2.4,
3.3,
1,
"versicolor"
],
[
6.6,
2.9,
4.6,
1.3,
"versicolor"
],
[
5.2,
2.7,
3.9,
1.4,
"versicolor"
],
[
5,
2,
3.5,
1,
"versicolor"
],
[
5.9,
3,
4.2,
1.5,
"versicolor"
],
[
6,
2.2,
4,
1,
"versicolor"
],
[
6.1,
2.9,
4.7,
1.4,
"versicolor"
],
[
5.6,
2.9,
3.6,
1.3,
"versicolor"
],
[
6.7,
3.1,
4.4,
1.4,
"versicolor"
],
[
5.6,
3,
4.5,
1.5,
"versicolor"
],
[
5.8,
2.7,
4.1,
1,
"versicolor"
],
[
6.2,
2.2,
4.5,
1.5,
"versicolor"
],
[
5.6,
2.5,
3.9,
1.1,
"versicolor"
],
[
5.9,
3.2,
4.8,
1.8,
"versicolor"
],
[
6.1,
2.8,
4,
1.3,
"versicolor"
],
[
6.3,
2.5,
4.9,
1.5,
"versicolor"
],
[
6.1,
2.8,
4.7,
1.2,
"versicolor"
],
[
6.4,
2.9,
4.3,
1.3,
"versicolor"
],
[
6.6,
3,
4.4,
1.4,
"versicolor"
],
[
6.8,
2.8,
4.8,
1.4,
"versicolor"
],
[
6.7,
3,
5,
1.7,
"versicolor"
],
[
6,
2.9,
4.5,
1.5,
"versicolor"
],
[
5.7,
2.6,
3.5,
1,
"versicolor"
],
[
5.5,
2.4,
3.8,
1.1,
"versicolor"
],
[
5.5,
2.4,
3.7,
1,
"versicolor"
],
[
5.8,
2.7,
3.9,
1.2,
"versicolor"
],
[
6,
2.7,
5.1,
1.6,
"versicolor"
],
[
5.4,
3,
4.5,
1.5,
"versicolor"
],
[
6,
3.4,
4.5,
1.6,
"versicolor"
],
[
6.7,
3.1,
4.7,
1.5,
"versicolor"
],
[
6.3,
2.3,
4.4,
1.3,
"versicolor"
],
[
5.6,
3,
4.1,
1.3,
"versicolor"
],
[
5.5,
2.5,
4,
1.3,
"versicolor"
],
[
5.5,
2.6,
4.4,
1.2,
"versicolor"
],
[
6.1,
3,
4.6,
1.4,
"versicolor"
],
[
5.8,
2.6,
4,
1.2,
"versicolor"
],
[
5,
2.3,
3.3,
1,
"versicolor"
],
[
5.6,
2.7,
4.2,
1.3,
"versicolor"
],
[
5.7,
3,
4.2,
1.2,
"versicolor"
],
[
5.7,
2.9,
4.2,
1.3,
"versicolor"
],
[
6.2,
2.9,
4.3,
1.3,
"versicolor"
],
[
5.1,
2.5,
3,
1.1,
"versicolor"
],
[
5.7,
2.8,
4.1,
1.3,
"versicolor"
],
[
6.3,
3.3,
6,
2.5,
"virginica"
],
[
5.8,
2.7,
5.1,
1.9,
"virginica"
],
[
7.1,
3,
5.9,
2.1,
"virginica"
],
[
6.3,
2.9,
5.6,
1.8,
"virginica"
],
[
6.5,
3,
5.8,
2.2,
"virginica"
],
[
7.6,
3,
6.6,
2.1,
"virginica"
],
[
4.9,
2.5,
4.5,
1.7,
"virginica"
],
[
7.3,
2.9,
6.3,
1.8,
"virginica"
],
[
6.7,
2.5,
5.8,
1.8,
"virginica"
],
[
7.2,
3.6,
6.1,
2.5,
"virginica"
],
[
6.5,
3.2,
5.1,
2,
"virginica"
],
[
6.4,
2.7,
5.3,
1.9,
"virginica"
],
[
6.8,
3,
5.5,
2.1,
"virginica"
],
[
5.7,
2.5,
5,
2,
"virginica"
],
[
5.8,
2.8,
5.1,
2.4,
"virginica"
],
[
6.4,
3.2,
5.3,
2.3,
"virginica"
],
[
6.5,
3,
5.5,
1.8,
"virginica"
],
[
7.7,
3.8,
6.7,
2.2,
"virginica"
],
[
7.7,
2.6,
6.9,
2.3,
"virginica"
],
[
6,
2.2,
5,
1.5,
"virginica"
],
[
6.9,
3.2,
5.7,
2.3,
"virginica"
],
[
5.6,
2.8,
4.9,
2,
"virginica"
],
[
7.7,
2.8,
6.7,
2,
"virginica"
],
[
6.3,
2.7,
4.9,
1.8,
"virginica"
],
[
6.7,
3.3,
5.7,
2.1,
"virginica"
],
[
7.2,
3.2,
6,
1.8,
"virginica"
],
[
6.2,
2.8,
4.8,
1.8,
"virginica"
],
[
6.1,
3,
4.9,
1.8,
"virginica"
],
[
6.4,
2.8,
5.6,
2.1,
"virginica"
],
[
7.2,
3,
5.8,
1.6,
"virginica"
],
[
7.4,
2.8,
6.1,
1.9,
"virginica"
],
[
7.9,
3.8,
6.4,
2,
"virginica"
],
[
6.4,
2.8,
5.6,
2.2,
"virginica"
],
[
6.3,
2.8,
5.1,
1.5,
"virginica"
],
[
6.1,
2.6,
5.6,
1.4,
"virginica"
],
[
7.7,
3,
6.1,
2.3,
"virginica"
],
[
6.3,
3.4,
5.6,
2.4,
"virginica"
],
[
6.4,
3.1,
5.5,
1.8,
"virginica"
],
[
6,
3,
4.8,
1.8,
"virginica"
],
[
6.9,
3.1,
5.4,
2.1,
"virginica"
],
[
6.7,
3.1,
5.6,
2.4,
"virginica"
],
[
6.9,
3.1,
5.1,
2.3,
"virginica"
],
[
5.8,
2.7,
5.1,
1.9,
"virginica"
],
[
6.8,
3.2,
5.9,
2.3,
"virginica"
],
[
6.7,
3.3,
5.7,
2.5,
"virginica"
],
[
6.7,
3,
5.2,
2.3,
"virginica"
],
[
6.3,
2.5,
5,
1.9,
"virginica"
],
[
6.5,
3,
5.2,
2,
"virginica"
],
[
6.2,
3.4,
5.4,
2.3,
"virginica"
],
[
5.9,
3,
5.1,
1.8,
"virginica"
]
],
"aoColumns": [
{
"sTitle": "Sepal.Length"
},
{
"sTitle": "Sepal.Width"
},
{
"sTitle": "Petal.Length"
},
{
"sTitle": "Petal.Width"
},
{
"sTitle": "Species"
}
],
"aaSorting": [
[ "1", "desc" ]
],
"iDisplayStart": 20
},
"id": "chart1ab45cc9df2"
}
$('#' + chartParamschart1ab45cc9df2.id).removeClass("rChart")
$(document).ready(function() {
drawDataTable(chartParamschart1ab45cc9df2)
});
function drawDataTable(chartParams){
var dTable = $('#' + chartParams.dom).dataTable(
chartParams.table
);
//first use rCharts width
$('#'+chartParams.id+"_wrapper").css("width",chartParams.width)
$('#'+chartParams.id+"_wrapper").css("width",chartParams.table.width)
//then if specified change to table width
$('#'+chartParams.id+"_wrapper").css("margin-left", "auto");
$('#'+chartParams.id+"_wrapper").css("margin-right", "auto");
dTable.fnAdjustColumnSizing();
}
</script>
</body>
<!-- Google Prettify -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/prettify/188.0.0/prettify.js"></script>
<script
src='https://google-code-prettify.googlecode.com/svn-history/r232/trunk/src/lang-r.js'>
</script>
<script>
var pres = document.getElementsByTagName("pre");
for (var i=0; i < pres.length; ++i) {
pres[i].className = "prettyprint linenums";
}
prettyPrint();
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment