The JSON format is very popular because it is easily understandable for users. WebDataRocks supports a certain kind of JSON data – an array of objects, where each object is an unordered collection of key-value pairs. Here is a sample of valid JSON data for WebDataRocks:
[ { "Product": "Apple", "Price": 2.50 }, { "Product": "Cherry", "Price": 5.25 } ]
If JSON data is already on the page (for example, in yourJSONData
variable), specify it in the report:
<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> var pivot = new WebDataRocks({ container: "#wdr-component", toolbar: true, report: { dataSource: { data: yourJSONData } } }); </script> </body> </html>
For getting the data from the file, specify the URL to this file:
<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> var pivot = new WebDataRocks({ container: "#wdr-component", toolbar: true, report: { dataSource: { filename: "URL-to-your-JSON-file" } } }); </script> </body> </html>
Learn more