JavaScript library for data visualization and reporting. Free dev tool. Your thoughts?

AKrus — Tue, 04 Dec 2018 13:38:02 +0000

Hi to all the community!

Want to share with you a non-commercial project our team is working on.

We truly believe that visualization and analysis totally rock the business. Also, our team believes that the future is oriented towards web solutions. That's why we've named our product WebDataRocks :)

This tool is created by developers and for developers. Thus, we’ll really appreciate a tech community opinion.

Briefly about WebDataRocks Pivot Table

It’s a free embeddable JavaScript library to visualize data in an aggregated manner.

To be even more specific, it’s an Excel-like pivot table that allows creating dynamic reports in a browser. It works with CSV and JSON data up to 1MB.

Main value for a developer

It’s free ready-made and well-designed tool. Simply integrates with frameworks and other libraries. Customizable and localizable.

Thus, any developer can add it to any web project where data analysis is needed.

Interested? - To get you an idea of what this tool does, let me tell you a bit more about its core features.

Analysis

You have a non-aggregated data, here what you can do with it using a web reporting tool:

Organize data with the Field List by dragging the needed members into rows and columns
Filter data by choosing the needed members that you want to be shown in the report
Group data via multi-level hierarchies

WebDataRocks supports 13 types of aggregations like sum, count, average, min, max, difference etc. If it’s not enough for your report, there are calculated values where you can set your own function.

Visualization

When your report has already been configured, additionally you can:

Expand, collapse and sort values
Drill through the cell to see non-aggregated values
Format cells to set the needed number formatting
Colorize cells by setting the conditional formatting and highlight the needed values

Pivot Grid looks like that.

As a bonus
Predefined themes, localization files, readymade integration wrappers - all that can facilitate developer’s work.

Plus: Reports can be saved, exported (PDF, Excel, HTML) and printed.

Let’s test it and create a report:

Firstly, download WebDataRocks (there are a few options for how to do it, choose the most suitable for you. I’ll refer to CDN in this example)

Secondly, add WebDatarocks into your HTML file between the <body> tags:


<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: "https://cdn.webdatarocks.com/data/data.csv"
        }
    }
});
</script>
</body>
</html>

The last step - load your data:

Add your URL to CSV or JSON file directly into the report. Just specify the URL to your file in the filename:

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

DEV Community: AKrus

JavaScript library for data visualization and reporting. Free dev tool. Your thoughts?

Briefly about WebDataRocks Pivot Table

Main value for a developer

Analysis

Visualization