Supported Charts

The current list of stardust (supported) charts in nebula.js can be found in the visualizations section.

Sense chart names

Rendering existing objects created in Sense requires matching types, so that Nebula can correctly use the correct visualization for the correct data. The list below aims to cover all the Sense native and bundled charts, formatted as a JS object.

const clientNames = {
  bar: 'barchart', // @nebula.js/sn-bar-chart
  boxplot: 'boxplot', // @nebula.js/sn-boxplot
  bullet: 'bulletchart', // @nebula.js/sn-bullet-chart
  button: 'action-button', // @nebula.js/sn-action-button
  combo: 'combochart', // @nebula.js/sn-combo-chart
  distributionplot: 'distributionplot', // @nebula.js/sn-distributionplot
  funnel: 'qlik-funnel-chart', // @nebula.js/sn-funnel-chart
  grid: 'sn-grid-chart', // @nebula.js/sn-grid-chart
  histogram: 'histogram', // @nebula.js/sn-histogram
  kpi: 'kpi', // @nebula.js/sn-kpi
  line: 'linechart', // @nebula.js/sn-line-chart
  map: 'map', // @nebula.js/sn-map
  mekko: 'mekkochart', // @nebula.js/sn-mekko-chart
  org: 'sn-org-chart', // @nebula.js/sn-org-chart
  pie: 'piechart', // @nebula.js/sn-pie-chart
  pivot: 'pivot-table', // @nebula.js/sn-pivot-table
  sankey: 'qlik-sankey-chart-ext', // @nebula.js/sn-sankey-chart
  scatter: 'scatterplot', // @nebula.js/sn-scatter-plot
  table: 'table', // @nebula.js/sn-table
  video: 'sn-video-player', // @nebula.js/sn-video-player
  waterfall: 'waterfallchart', // @nebula.js/sn-waterfall
};

Of the charts listed, not all are a one-to-one match with the object created inside Sense. Specifically these charts are not the same when rendered using Nebula:

  • Map
  • Pivot table
  • Table

Chart conversion

Converting a visualization to a different registered type:

const viz = await n.render({
  element: document.querySelector('.object'),
  type: 'barchart',
  fields: ['title', '=avg(rating)'],
});
viz.convertTo('piechart');

You first render a bar chart, then pie chart is the registered type to convert to. The API Reference of convertTo can be found here.

You can find an example using charts conversion in the nebula.js repository, here.

Was this page helpful?