# Line (lv_line) (/widgets/line)



Overview [#overview]

The Line widget draws straight lines between a set of points.

Set points [#set-points]

<LvglExample name="lv_example_line_points" path="widgets/line/lv_example_line_points" />

A Line's points have to be stored in an <ApiLink name="lv_point_precise_t" /> array and passed to
the Widget by the <ApiLink name="lv_line_set_points" display="lv_line_set_points(lines, point_array, point_cnt)" />
function.

Their coordinates can either be specified as raw pixel coordinates
(e.g. `{5, 10}`), or as a percentage of the Line's bounding box using
<ApiLink name="lv_pct" display="lv_pct(x)" />. In the latter case, the Line's width/height may need to
be set explicitly using <ApiLink name="lv_obj_set_width" /> and <ApiLink name="lv_obj_set_height" />,
as percentage values do not automatically expand the bounding box.

Auto-size [#auto-size]

By default, the Line's width and height are set to <ApiLink name="LV_SIZE_CONTENT" />.
This means it will automatically set its size to fit all the points. If
the size is set explicitly, parts of the Line may not be visible.

Invert y [#invert-y]

By default, the *y == 0* point is at the top of the Widget. The y
coordinates can be inverted with
<ApiLink name="lv_line_set_y_invert" display="lv_line_set_y_invert(line, true)" />, placing *y == 0*
at the bottom. *y invert* is disabled by default.

Styling [#styling]

<ApiLink name="LV_PART_MAIN" /> uses the [typical background](/common-widget-features/styles/overview)
and line style properties.