Layouts

Here you can find various examples that show how a user can combine different charts, plugins and panels together.

Panel

LightweightCharts.LWCPanel — Type

LWCPanel

A type that allows you to combine multiple charts for visualization.

See also: lwc_panel.

source

LightweightCharts.lwc_panel — Function

lwc_panel(charts::LWCChart...; kw...) -> LWCPanel

Creates a panel combining several charts.

Keyword arguments

Name::Type	Default/Possible values	Description
`x::Int64`	`-999`	Panel's horizontal coordinates
`y::Int64`	`-999`	Panel's vertical coordinates
`name::String`	`"LightweightCharts ❤️ Julia"`	Panel name (will be displayed in the browser tab title).
`min_y::Union{Real,Nothing}`	`nothing`	Lower bound on the y-axis.
`left_min_y::Union{Real,Nothing}`	`nothing`	Lower bound on the left y-axis.
`right_min_y::Union{Real,Nothing}`	`nothing`	Lower bound on the right y-axis.
`max_y::Union{Real,Nothing}`	`nothing`	Upper bound on the y-axis.
`left_max_y::Union{Real,Nothing}`	`nothing`	Upper bound on the left y-axis.
`right_max_y::Union{Real,Nothing}`	`nothing`	Upper bound on the right y-axis.
`seconds_visible::Bool`	`false`	Seconds visibility on the x-axis.
`bar_spacing::Real`	`6`	Distance between the stripes in pixels.
`min_bar_spacing::Real`	`0.5`	Minimum distance between the stripes in pixels.
`copyright::Bool`	true	Enables a TradingView trademark symbol on the chart.
`tooltip::Bool`	true	Enables tooltip for points.
`tooltip_format::String`	`"${label_name}: (${time}, ${value})"`	String formatting of tooltip text. Display the variables "title", "time" and "value" in the desired format.
`min_charts_for_search`	`10`	Minimum number of charts to search.
`mode::LWC_PRICE_SCALE_MODE`	`0`	Price scale mode.
`crosshair_settings::CrosshairOptions`	`CrosshairOptions()`	Structure describing crosshair options.
`cursor::LWC_CURSOR`	`LWC_CURSOR_DEFAUL`	Cursor type.
`last_value_visible::Bool`	`false`	Shows the latest price label on the price scale.
`title_visible::Bool`	`false`	Shows the chart name next to the latest price label.
`default_legend_visible::Bool`	`true`	Shows the legend box with data charts names and colors.

source

Example

using LightweightCharts

t_values = round(Int64, time()) .+ collect(1:500)
x_values = map(x -> rand(1:500), collect(1:500))

panel = lwc_panel(
    lwc_line(
        t_values,
        x_values .+ 500.0;
        label_name = "lwc_line",
        line_color = "#f35B04",
        line_visible = false,
        point_markers_visible = true,
        price_scale_id = LWC_RIGHT,
    ),
    lwc_histogram(
        t_values,
        x_values;
        label_name = "lwc_histogram",
        base = 250.0,
        color = "rgba(118, 120, 237, 0.5)",
        price_scale_id = LWC_RIGHT,
    );
    name = "Panel example",
    crosshair_settings = CrosshairOptions(;
        mode = LWC_CROSSHAIR_NORMAL,
        vert_line = CrosshairLineOptions(;
            style = LWC_CROSSHAIR_SOLID,
            color = "#C3BCDB44",
            label_background_color = "#9B7DFF",
            width = 8,
        ),
        horz_line = CrosshairLineOptions(;
            color = "#9B7DFF",
            label_background_color = "#9B7DFF",
        )
    ),
)

lwc_save("panel_example.html", panel)

Layout

LightweightCharts.LWCLayout — Type

LWCLayout

Type describing the layout for arranging multiple panels.

Name::Type	Default (Possible) values	Description
`name::String`	`"LightweightCharts ❤️ Julia"`	Layout name (will be displayed in the browser tab title).
`sync::Bool`	`true`	Synchronization of chart scrolling.
`min_height::Integer`	`300`	Minimum of layout height in px.

Example

using Dates, NanoDates
using LightweightCharts

layout = lwc_layout(
    lwc_panel(
        lwc_baseline(
            NanoDate("2024-01-01") .+ Second.(1:500),
            map(x -> rand(1:500), collect(1:500));
            label_name = "lwc_baseline",
            base_value = LWCBaseValue("price", 250),
            top_line_color = "#6a994e",
            top_fill_color1 = "#a7c957",
            bottom_line_color = "#e76f51",
            bottom_fill_color2 = "#f4a261",
            line_style = LWC_SOLID,
            line_type = LWC_CURVED,
            line_width = 3,
            precision = 4,
            price_scale_id = LWC_RIGHT,
        );
        tooltip = false,
        last_value_visible = true,
        title_visible = true,
        x = 1,
        y = 1,
    ),
    lwc_panel(
        lwc_area(
            NanoDate("2024-01-01") .+ Second.(1:500),
            map(x -> sin(x / 10), collect(1:500));
            label_name = "lwc_area",
            line_color = "#2ec4b6",
            top_color = "#cbf3f0",
            bottom_color = "rgba(133, 242, 240, 0)",
            line_style = LWC_SOLID,
            line_type = LWC_STEP,
            line_width = 2,
            precision = 3,
            price_scale_id = LWC_RIGHT,
        ),
        lwc_line(
            NanoDate("2024-01-01") .+ Second.(1:500),
            map(x -> cos(x / 10), collect(1:500));
            label_name = "lwc_line",
            line_color = "#ff7d00",
            line_style = LWC_SPARSE_DOTTED,
            line_type = LWC_SIMPLE,
            line_width = 3,
            price_scale_id = LWC_RIGHT,
        );
        tooltip_format = "\${label_name}: \${value}",
        default_legend_visible = true,
        x = 1,
        y = 2,
    );
    min_height = 480,
    name = "Layout example",
)

lwc_save("layout_example.html", layout)