Barlinechart reference

To display 2 different metrics in bars and lines

Overview

📖 Learn More about the Barlinechart here.

📖 Find examples on the Barlinechart here.

Parameters

Required

You must fill these parameters to produce a Barlinechart

parameters label type description (placeholder | tooltip)
meta     |
lines   object |
lines/x X axis string (Column of dataset expected) Column name containing x axis values | Same as bars label
lines/y Y axis string (Column of dataset expected) Column name containing y axis values |
lines/metaSerie     |
lines/smoothLine Smooth line boolean | Interpolate between points to ‘smooth’ the line
label Bars label string (Column of dataset expected) Column name containing the label |
value Bars value string (Column of dataset expected) Column name containing the value |
metaSerie     |
bars   object |
bars/showValues Show all bar values boolean |

Optional

You can let these parameters unset if you do not need them

parameters label type description (placeholder | tooltip)
tutorial Tutorial object |
tutorial/alwaysShow Always show this tutorial boolean | By default the tutorial is shown once only
tutorial/content Message string Enter your message | This will be displayed to your users
tutorial/id   string Enter an ID | Change the ID to display the tutorial again. All tutorials with the same ID will be displayed only once.
disableZoomIn Disable zoom in animation boolean | The chart will be zoomable, but will not transition to a zoomed state. All bars will remain visible.
lines/domain Scale array | Use it to define the bars scale.Choose 2 boundsIf you’re displaying %, try a 0 to 100
lines/serie Groups string (Column of dataset expected) Column containing lines names | Optional - For multi-linechart
lines/zeroBaseline Y axis baseline   | Y value on which to position the x axisBy default, set to 0
lines/showValues Show all values on line boolean | Warning: this is not recommended
lines/dataset Lines dataset string Dataset for lines values | Use the same as the bars or create a new dataset
lines/displayBarsOnTop Display bars on top of lines boolean |
hideEmptyGroups Hide empty bar groups boolean |
legend     |
style Custom CSS class string amazing-class | Set a customm CSS class to target this specific chart with CSS
groupsOrder Groups order   | Use it to order groups
mobileSize Mobile Size number Enter a proportion of the total mobile screen | Use on multiple charts onlyEnter a number from 0 to 1
defaultSelected Default selected bar string | first, last or the name of the label
groups Bars groups string (Column of dataset expected) Column name containing grouping |
size Size number Enter a proportion of the total screen | Use on multiple charts onlyEnter a number from 0 to 1
yLegend Legend for the y axis string Enter text here |
commonScale Use same scale for bars and lines boolean |
disableZoom Disable zoom boolean | The chart will not be zoomable.All bars will remain visible.
bars/dataset Bars dataset string Dataset for bars values |
bars/zeroBaseline Y axis baseline   | Y value on which to position the x axisBy default, set at 0
bars/domain Scale array | Use it to define the bars scale.Choose 2 boundsIf you’re displaying %, try a 0 to 100
alignRightAtInit Scroll graph to the right boolean | At initialization
labelsOrder Labels order   | Use it to order labels
tickFormat Custom date tick format (for date bars label) string Insert d3 time format.i.e. ‘%Y’ to for years. | Click here for more info on format
xLegend Legend for the x axis string Enter text here |

Others

This parameters are either common to all charts, or hidden from studio. You can use them in code mode, but it’s not recommended !

parameters label type description (placeholder | tooltip)
comment   string |
crossfilter   object | Use it for crossfilter configurationShould be configured on the primary chart
crossfilter/datasets Select the filtered datasets array | Datasets that will be filtered on the ‘on’ column
crossfilter/on on column string (Column of dataset expected) Column existing in primary and filtered datasets |
labelsDomain   string |
colorSelectedBar   boolean |
source   string |