Skip to main content
{% line_chart
    data="demo_daily_orders"
    x="date"
    y="sum(total_sales)"
    date_grain="month"
%}
    {% reference_point 
        x="2024-12-01" 
        y=4441307 
        label="Peak Month"
        color="green"
    /%}
{% /line_chart %}

​
Examples

​
Hardcoded Point

{% line_chart
    data="demo_daily_orders"
    x="date"
    y="sum(total_sales)"
    date_grain="month"
%}
    {% reference_point 
        x="2024-12-01" 
        y=4441307 
        label="Peak Month"
        color="green"
    /%}
{% /line_chart %}

​
Point from Data

```sql top_months
select 
    toStartOfMonth(date) as month,
    sum(total_sales) as sales,
    'Top ' || row_number() over (order by sum(total_sales) desc) as label
from demo_daily_orders
group by month
order by sales desc
limit 3
```

{% line_chart
    data="demo_daily_orders"
    x="date"
    y="sum(total_sales)"
    date_grain="month"
%}
    {% reference_point 
        data="top_months"
        x="month" 
        y="sales" 
        label="label"
        color="purple"
    /%}
{% /line_chart %}

​
Callout Style

{% line_chart
    data="demo_daily_orders"
    x="date"
    y="sum(total_sales)"
    date_grain="month"
%}
    {% reference_point 
        x="2021-02-01" 
        y=1754436 
        label="Lowest Month"
        color="red"
        label_options={
            variant="callout"
            position="top"
        }
    /%}
{% /line_chart %}

​
Custom Symbol

{% line_chart
    data="demo_daily_orders"
    x="date"
    y="sum(total_sales)"
    date_grain="month"
%}
    {% reference_point 
        x="2023-12-01" 
        y=3720260 
        label="Record High"
        symbol_options={
            shape="diamond"
            size=12
            color="gold"
        }
        label_options={
            position="right"
            color="orange"
        }
    /%}
{% /line_chart %}

​
Attributes

​
data
string
Query name to use for placing multiple points from data
​
label
string
Text label to display at the reference point
​
color
string
Color of the point marker
​
x
string | number
required
X-axis position of the point (e.g., a date or category)
​
y
string | number
required
Y-axis position of the point (e.g., a value)
​
label_options
options group
Styling options for the label
​
symbol_options
options group
Styling options for the point markerExample:
symbol_options={
  shape = "circle"
  size = 0
  color = "string"
}
Attributes:
  • shape: string
    • Allowed values:
      • circle
      • emptyCircle
      • rect
      • roundRect
      • triangle
      • diamond
      • pin
      • arrow
      • none
      • image://
      • path://
  • size: number
  • color: string

​
Allowed Parents