This example shows the creation of a simple trading dashboard with multiple individual charts on a single pane.
The chart contains:
- Japanese candlesticks ( OHLC series ) to represent the market price data
- Mountains area ( AreaRange series ) to represent the difference between high & low values
- Mountains area ( Area series ) to represent the volume
Legend in this example is a UI object embedded to the chart using predefined simple builders for horizontal or vertical layout.
// Create a horizontal legend embedded to the chart. const legend = chart.addLegendBox( LegendBoxBuilders.HorizontalLegendBox )
// Create a horizontal legend embedded to the chart. const legend = chart.addLegendBox( LegendBoxBuilders.VerticalLegendBox )
The whole chart with contained series, the whole dashboard with contained charts and series, or the series individually can be easily attached to the legend box.
Adding a chart
// Attach the chart and its series to legend. // Creates a group with charts. // Return attached entries. const entries = legend.add( chart )
Adding a dashboard
// Attach the dashboard with charts with series to legend. // Creates groups of charts with series. // Return attached entries. const entries = legend.add( dashboard )
Adding a series
// Attach the individual series as a group to legend. // Creates a group from a single series. // Return attached entry. const entries = legend.add( series )
- XY cartesian chart: ChartXY
- Axis: Axis
- Axis tick strategies: AxisTickStrategies
- Horizontal legend box: HorizontalLegendBox
- Vertical legend box: VerticalLegendBox
- UI position origins: UIOrigins
- Solid FillStyle: SolidFill
- RGBA color factory: ColorRGBA
- Solid LineStyle: SolidLine
© Arction Ltd 2009-2020. All rights reserved.