Quick start

Embedding WebDataRocks is a simple and quick process.

Please follow the steps:

Include
Add your data
See our reporting tool in your website

Step 1: Include

Get WebDataRocks now, open your HTML file and between <body> tags include WebDataRocks with some sample data.

<html>
<head></head>
<body>
<div id="wdr-component"></div>
<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>
<script>
const pivot = new WebDataRocks({
	container: "#wdr-component",
	toolbar: true,
	report: {
		dataSource: {
			filename: "https://cdn.webdatarocks.com/data/data.csv"
		}
	}
});
</script>
</body>
</html>

You can see how this code is working in our live demo on CodePen.

Step 2: Add your data

Add your own file with JSON or CSV data by specifying the URL to your file in filename:

filename: "URL-to-your-CSV-or-JSON-file"

Step 3: See our reporting tool in your website

Hooray! WebDataRocks is embedded and ready to use.

Quick start

Step 1: Include

Step 2: Add your data

Step 3: See our reporting tool in your website

See also