<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"
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.