Skip to content

Latest commit

 

History

History
95 lines (81 loc) · 2.09 KB

readme.md

File metadata and controls

95 lines (81 loc) · 2.09 KB

Kii-Reporting Framework

image

Description

Kii Reporting Framework is designed to be a Elastic Search compatable and query-view schema based reporting charts renderer. The main advantages are:

  • Powerful interactive UI.
  • No more data formatter for complex Elastic Search Response. Data formating is done by framework.
  • Easy to ember in H5 project. The project is pure javascript implementation.
  • Intuitive JSON data structure.
// a simple pie chart schema
var opts = {
  "chartOptions": {
    "pie": {
    	"series": [{
        "field": "Position>CALC"
      }]
    }
  },
  "chartQuery": {
    "filter": {
    	"must_not": [],
      "must": [
        {
          "terms": {
            "state.target": [
              "th.f83120e36100-870b-6e11-b1d8-026da82a",
              "th.f83120e36100-870b-6e11-b1d8-034dff1a"
            ]
          }
        },
        {
          "range": {
            "state.date": {
              "gte": 1454406685000,
              "lte": 1486115485121,
              "format": "epoch_millis"
            }
          }
        }
      ]
    },
    "aggregation": {
      "Position": {
        "aggs": {
          "CALC": {
            "sum": {
              "field": "state.CO2"
            }
          }
        },
        "terms": {
          "field": "state.target"
        }
      }
    }
  }
};

// es response 
let response = '...';
// init framework
let {
  formatterEngine, chartEngine
} = bootstrap();

// get data formatter
let parser = new KRQueryParser();
let formatter = parser.parseQuery(opts.chartQuery);

// formatter data
let dataDict = formatterEngine.format(response, formatter);

// rendering chart on target element
let target = document.getElementById('target');
chartEngine.render(target, opts.chartOptions, dataDict, formatter);

Development Guide

Prerequisite

  • nodejs > 4.0
  • typescript > 2.0

CLI

  • run on development mode by npm start, and visit http://localhost:3001
  • build production by npm run build:prod