AreaChart.js

Summary
AreaChart.js
AreaChartA visualization that displays stacked area charts.
Functions
loadJSONLoads JSON data into the visualization.
updateJSONUse this method when updating values for the current JSON data.
filterFilter selected stacks, collapsing all other stacks.
restoreSets all stacks that could have been filtered visible.
getLegendReturns an object containing as keys the legend names and as values hex strings with color values.
getMaxValueReturns the maximum accumulated value for the stacks.

AreaChart

A visualization that displays stacked area charts.

Constructor Options

See Options.AreaChart.

Summary
Functions
loadJSONLoads JSON data into the visualization.
updateJSONUse this method when updating values for the current JSON data.
filterFilter selected stacks, collapsing all other stacks.
restoreSets all stacks that could have been filtered visible.
getLegendReturns an object containing as keys the legend names and as values hex strings with color values.
getMaxValueReturns the maximum accumulated value for the stacks.

Functions

loadJSON

loadJSON: function(json)

Loads JSON data into the visualization.

Parameters

jsonThe JSON data format.  This format is described in http://blog.thejit.org/2010/04/24/new-javascript-infovis-toolkit-visualizations/#json-data-format.

Example

var areaChart = new $jit.AreaChart(options);
areaChart.loadJSON(json);

updateJSON

updateJSON: function(json,
onComplete)

Use this method when updating values for the current JSON data.  If the items specified by the JSON data already exist in the graph then their values will be updated.

Parameters

json(object) JSON data to be updated.  The JSON format corresponds to the one described in AreaChart.loadJSON.
onComplete(object) A callback object to be called when the animation transition when updating the data end.

Example

areaChart.updateJSON(json, {
  onComplete: function() {
    alert('update complete!');
  }
});

filter

filter: function(filters,
callback)

Filter selected stacks, collapsing all other stacks.  You can filter multiple stacks at the same time.

Parameters

filters(array) An array of strings with the name of the stacks to be filtered.
callback(object) An object with an onComplete callback method.

Example

areaChart.filter(['label A', 'label C'], {
    onComplete: function() {
        console.log('done!');
    }
});

See also

AreaChart.restore.

restore

restore: function(callback)

Sets all stacks that could have been filtered visible.

Example

areaChart.restore();

See also

AreaChart.filter.

getLegend

getLegend: function()

Returns an object containing as keys the legend names and as values hex strings with color values.

Example

var legend = areaChart.getLegend();

getMaxValue

getMaxValue: function()

Returns the maximum accumulated value for the stacks.  This method is used for normalizing the graph heights according to the canvas height.

Example

var ans = areaChart.getMaxValue();

In some cases it could be useful to override this method to normalize heights for a group of AreaCharts, like when doing small multiples.

Example

//will return 100 for all AreaChart instances,
//displaying all of them with the same scale
$jit.AreaChart.implement({
  'getMaxValue': function() {
    return 100;
  }
});
loadJSON: function(json)
Loads JSON data into the visualization.
updateJSON: function(json,
onComplete)
Use this method when updating values for the current JSON data.
filter: function(filters,
callback)
Filter selected stacks, collapsing all other stacks.
restore: function(callback)
Sets all stacks that could have been filtered visible.
getLegend: function()
Returns an object containing as keys the legend names and as values hex strings with color values.
getMaxValue: function()
Returns the maximum accumulated value for the stacks.
AreaChart options.
Close