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)
label Bars label string (Column of dataset expected) Column name containing the label |
metaSerie     |
dataset   string Dataset |
meta     |
bars   object |
bars/showValues Show all bar values boolean |
lines   object |
lines/smoothLine Smooth line boolean | Interpolate between points to ‘smooth’ the line
lines/y Y axis string (Column of dataset expected) Column name containing y axis values |
lines/metaSerie     |
value Bars value string (Column of dataset expected) Column name containing the value |

Optional

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

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

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)
source   string |
colorSelectedBar   boolean |
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 |