View Source Luminous.Panel behaviour (luminous v2.6.1)
A panel represents a single visual element (chart) in a dashboard
that can contain many queries. A panel is "refreshed" when the live
view first loads, as well as when a variable or the time range are
updated. The panel's data (as returned by the queries) are stored in
Luminous.Dashboard
.
The module defines a behaviour that must be implemented by concrete
panels either inside Luminous (e.g. Luminous.Panel.Chart
,
Luminous.Panel.Stat
etc.) or on the client side.
When a Panel is refreshed (refresh/3
), the execution flow is as follows:
- for each query:
- execute the query (
Luminous.Query.execute()
) transform/2
the query result
- execute the query (
reduce/3
(aggregate) the transformed query results
Link to this section Summary
Callbacks
A list of the available panel actions that will be transmitted as events using JS.dispatch
using the format "panel:${panel_id}:${event}"
The label
will be shown in the dropdown.
This is an optional callback -- if undefined (or if it returns []), then the dropdown is not rendered
Define the panel type's supported data attributes These will be used to parse, validate and populate the client's input
Define custom attributes specific to the concrete panel type These will be used to parse, validate and populate the client's input
aggregate all transformed results to a single map that will be sent for visualization
The phoenix function component that renders the panel. The panel's
title, description tooltip, contextual menu etc. are rendered
elsewhere. See Luminous.Components.panel/1
for a description of the available assigns.
transform a query result to view data acc. to the panel type
Functions
Initialize a panel. Verifies all supplied options both generic and the concrete panel's attributes. Will raise if the validation fails. The supported generic attributes are
Refresh all panel queries.
Link to this section Types
@type t() :: map()
Link to this section Callbacks
A list of the available panel actions that will be transmitted as events using JS.dispatch
using the format "panel:${panel_id}:${event}"
The label
will be shown in the dropdown.
This is an optional callback -- if undefined (or if it returns []), then the dropdown is not rendered
@callback data_attributes() :: Luminous.Attributes.Schema.t()
Define the panel type's supported data attributes These will be used to parse, validate and populate the client's input
@callback panel_attributes() :: Luminous.Attributes.Schema.t()
Define custom attributes specific to the concrete panel type These will be used to parse, validate and populate the client's input
@callback reduce(list(), t(), Luminous.Dashboard.t()) :: map()
aggregate all transformed results to a single map that will be sent for visualization
@callback render(map()) :: Phoenix.LiveView.Rendered.t()
The phoenix function component that renders the panel. The panel's
title, description tooltip, contextual menu etc. are rendered
elsewhere. See Luminous.Components.panel/1
for a description of the available assigns.
@callback transform(Luminous.Query.result(), t()) :: any()
transform a query result to view data acc. to the panel type
Link to this section Functions
Initialize a panel. Verifies all supplied options both generic and the concrete panel's attributes. Will raise if the validation fails. The supported generic attributes are:
:type
(atom/0
) - Required.:id
(atom/0
) - Required.:title
(String.t/0
) - The default value is""
.:hook
- The default value isnil
.:queries
(list of struct of type Luminous.Query):description
- The default value isnil
.:attributes
(keyword/0
) - The default value is[]
.:data_attributes
- The default value is%{}
.
@spec refresh(t(), [Luminous.Variable.t()], Luminous.TimeRange.t()) :: [any()]
Refresh all panel queries.