<link href="https://cdn.webdatarocks.com/latest/webdatarocks.min.css" rel="stylesheet"/>
<script src="https://cdn.webdatarocks.com/latest/webdatarocks.toolbar.min.js"></script>
<script src="https://cdn.webdatarocks.com/latest/webdatarocks.js"></script>
<button onclick="saveReport()">Save your report</button>
<div id="wdr-component"></div>
button {
border: 2px solid #0598df;
background: #fff;
color: #0598df;
text-transform: uppercase;
cursor: pointer;
margin: 5px 0;
display: inline-block;
-webkit-transition: all .3s;
transition: all .3s;
font-weight: normal;
padding: 10px 10px;
font-size: 14px;
}
button:hover {
background: #0598df;
color: #fff;
}
button:focus {
outline: none;
}
function saveReport() {
webdatarocks.save({
filename: 'reportingResults.json'
});
}
var pivot = new WebDataRocks({
container: "#wdr-component",
height: 345,
report: "https://cdn.webdatarocks.com/reports/report.json"
});
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.