Tutorial 5: HPCC Platform Workunit Data + Column Chart

Tutorial 5: HPCC Platform Workunit Data + Column Chart

Fetching data from a HPCC Platform Workunit and rendering it in a Visualization:

1 - Create an empty Column chart and render it:

var columnChart = new Column()
    .target("placeholder")
    .columns(["Location", "Males", "Females", "Total"])
    .yAxisTitle("Population")
    .render()
    ;

2 - Attach to an existing Workunit:

var wu = Workunit.attach({ baseUrl: "https://play.hpccsystems.com:18010" }, "W20160918-054119");

3 - Fetch a list of the Workunit results (returns a Promise)

wu.fetchResults().then(results => { ... });

4 - Pick the first result and fetch its content (returns a Promise)

results[0].fetchRows().then(rows => {...});

5 - Map the rows to a data array:

var data = rows.map(row => [row.location, row.males, row.females, row.total]);

6 - Update the Column chart with the mapped data:

columnChart
    .data(data)
    .render()
    ;