Stacked Area Chart (JavaScript)

This chart visualizes numerical values from multiple columns as stacked areas. Different stacking types can be chosen to guide the user's interpretation: The node can display Stacked Area Charts, Percentage Area Charts and Stream Graphs. Different interpolation methods can be chosen to give the graph an organic appearance.

The node supports custom CSS styling. You can simply put CSS rules into a single string and set it as a flow variable 'customCSS' in the node configuration dialog. You will find the list of available classes and their description on our documentation page.

Options

x-Axis Column (*): Choose the column for the x-axis. Dependent on the column's type, labels on the x-axis get rendered differently.
Sort for x-axis column: When checked, the table is sorted for the x-axis column.
Included Columns: Select the numeric columns which you wish to be included in the chart.

General Plot Options

Chart Type: Select the stacking types.
Interpolation Method: Select the interpolation method used to interpolate values in-between data items. -basis: a B-spline, with control point duplication on the ends. -linear: piecewise linear segments -step: alternate between horizontal and vertical segments
Title (*): The chart's title.
Subitle (*): The chart's subtitle.
Display legend: When checked, the legend is displayed.
Display tooltip: When checked, an interactive tooltip is displayed on hover.
Display fullscreen button: Check to display a button which switches the view into fullscreen mode. The button is only available in the KNIME WebPortal.
Subscribe to filter events: Check to subscribe to external filter events. The data will then be filtered according to the filters.
Image: Settings for image generation.

Axis Configuration

Show Grid: When checked, a grid is displayed in the chart.
x-axis label (*): The label used for the x-axis.
y-axis label (*): The label used for the y-axis.
x-Axis Number Format (*): d3-Format string for numbers on the x-Axis.
y-Axis Number Format (*): d3-Format string for numbers on the y-Axis.
Date Format: Choose how to format x-Axis ticks if the associated column is of any date or time type.

Control Options

Enable view controls: Check to enable controls in the chart.
Enable title editing: Check to enable the editing of the title within the view.
Enable subtitle editing: Check to enable the editing of the subtitle within the view.
Enable chart type change: Check to enable changing of the chart style within the view.
Enable interpolation method editing: Check to enable the editing of the interpolation method within the view.
Enable legend toggle: Check to enable toggling of the legend within the view.
Enable interactive guideline toggle: Check to enable toggling of the interactive pop-up within the view.
Enable show grid toggle: Check to enable toggling of the grid within the view.
Enable x-axis editing: Check to enable the editing of the x-axis label within the view.
Enable y-axis editing: Check to enable the editing of the y-axis label within the view.

Input Ports

: Data table containing the values to be plotted in the Stacked Area Chart. Rows with missing values get excluded.
: Data table containing one column with the column names of the first table. Each column name has a color assigned.

Output Ports

: SVG image of the Stacked Area Chart chart.

Popular Predecessors

Popular Successors

Views

Interactive View: JavaScript Stacked Area Chart: A NVD3.js implementation of a Stacked Area Chart.

Workflows

Developers

You want to see the source code for this node? Click the following button and we’ll use our super-powers to find it for you.

Installation

To use this node in KNIME, install the extension KNIME JavaScript Views from the below update site following our NodePit Product and Node Installation Guide:

v5.4

A zipped version of the software site can be downloaded here.

Plugin provider: KNIME AG, Zurich, Switzerland

Plugin version: 5.4.0.v202407231410

On NodePit since: 2024-12-06

Last update: 2024-12-21

KNIME versions: v5.4, v5.3, v5.2, v5.1, v5.0, v3.7, v3.6

Deploy, schedule, execute, and monitor your KNIME workflows locally, in the cloud or on-premises – with our brand new NodePit Runner.

Try NodePit Runner!