babbage.ui

A set of view components to visualise data returned by a Babbage API.

Quick start

Install from npm, and use in your app. See the docs, and below, for more information.

The library provides a DSL, query frontend and visualisation functions running against the Babbage Analytical Engine API. The intent is to make a re-usable set of angular-based front-end components for business intelligence.

Usage

<babbage slicer="http://host.org/slicer" cube="sales">
    <div class="row">
        <div class="col-md-4">
            <babbage-filter-panel></babbage-filter-panel>
        </div>
        <div class="col-md-8">
            <babbage-table></babbage-table>
        </div>
    </div>
</babbage>

Or, with inline config:

<babbage slicer="http://host.org/slicer" cube="sales">
    <babbage-treemap drilldown="region" measure="sales_usd" cut="time.year:2015">
    </babbage-treemap>
</babbage>

Example

Clone the repository and open index.html to see babbage in action, no pre-config required.

Dev installation

• Dev tool installation with npm: npm install (see package.json)
• Web packaging with Bower: bower install (see bower.json)
• Build automation with Grunt: grunt without arguments runs the default task (see Gruntfile.js)

A few links

• Sample API result
• vega tutorial
• nvd3 and angular-nvd3
• OffenerHaushalt Treemaps