Skip to content

Making a Line / Bar / Area Chart

In this guide we will walk through the process of creating a line chart. In our example, we will build a line chart that displays actual revenue over time for different locations.

Simple Instructions

Required properties:

  • Plot Instructions: Set instructions that represent the x-axis of the chart.

  • Plot X Label: Labels along the X-axis.

  • Series Instructions: Set instructions that represent the contents of the chart.

  • Series Format: Determines what kind of chart the chart component is. In this example, we are selecting between Line, Rectangle and Area.

  • Series Title: Determines the legend labels and typically links to the dimension used in the Series Instructions.

  • Series Y Value:: Link to cube data to be shown on the chart.

Detailed Walkthrough

  1. To begin, drag a chart component into the card editor panel.

    In charts, there are five required properties to be edited in order for the chart to render:

    • Plot Instructions
    • Plot X Label
    • Series Instructions
    • Series Title
    • Series Y Value
  2. Click on the chart icon in the card editor to open the chart properties panel.

  3. Under the Plots section, open the Plot Instructions property by clicking on the set editor icon.

  4. Click on the "Add Item" button on the bottom left to add a row for instructions. Click on the blue plus button in the new row to add a dimension. Choose from the dropdown, and click "Select" to confirm the selection.

  5. Click on the pencil icon next to the dimension name to add dimension instructions.

    The elements selected here will define what shows on the x-axis of the chart. In this example, we are going to show values over a period of time and utilise the descendants of 2023 in the "Time" dimension.

    TIP

    Choose elements from the left panel of the Popup. They can be added to set instructions by double-clicking on individual elements, or right clicking on an element for a dropdown menu of more methods to quickly add elements.

  6. Under the Plots section, open the Plot X Label property by clicking on the formula editor icon. This property defines the horizontal label along the bottom of the chart. To pair it with the dimension chosen in the Plot Instructions, enter the ELEMENT() value. In this example, it will be ELEMENT("Time").

  7. Under the Series section, open the Series Instructions property by clicking on the set editor icon. Follow steps 4-5.

    The elements selected here will define the content of the chart. In this example,

  8. Under the Series section, open the Series Instructions property by clicking on the set editor icon. Follow steps 4-5. In this example we are going to select the "Location" dimension so that the chart compares locations over time.

  9. Under the Series section, open the Series Title property by clicking on the formula editor icon. This property defines the chart’s visual contents and colour-coded legend. To pair it with the dimension chosen in the Series Instructions, enter the ELEMENT() value. In this example, it will be ELEMENT("Location").

  10. Under the Series section, open the Series Y Value property by clicking on the formula editor icon. This property typically is linked to a cube to utilize the card's context and data within the chart, and supplies the actual numbers the chart will be pointing to.

  11. This stage is where the chart type is selected. Under the Series section, open the Series Format property.

    • For a Bar Chart select Rectangle. This is the default value.
    • For a Line Chart select Line
    • For an Area Chart select Area
  12. With all of the above values filled out, when hitting preview the chart will now appear.

  13. To ensure the correct numbers for what is intended to show are being shown, double check that the context of the card is using the correct locations. Since in this guide only two dimensions are given context in the chart (In our example, Time and Location), the rest would fall back on context.

    To ensure our exmaple is showing what we want (actual revenue), we must ensure the Scenario in the context panel is set to Actual and the Measures are set to Revenue.

Useful additional properties:

  • Chart Title

  • Chart Subtitle

  • Data Labels:

    Change to Yes to show amount labels for bars

  • Data Label Color

  • Plot Color Formula:

    Two easy ways to color a pie chart are by splitting a list of colors based on the plot index or a cascading if statement. More segments will require more colors listed in the split or multiple cascading IF functions to match the segment count

    Example:

    SPLIT("#FF4054,#323652",",",NUMBER(VARIABLE("plot-index")))

    or

    IF( ELEMENT("Sales Measures") = "Revenue", "#FF4054", "#323652")