This example shows how to draw and style spline-series.
First create the series using chart method.
// Add a spline series using default X and Y axes. const splineSeries = chart.addSplineSeries()
Option 1: Styling using a style object.
The first option for styling of series is to create a new object that contains the necessary information about visual settings. In the case of line-series, the object must be type of SolidLine to be visible.
// Create a new instance of visible solid line-style. const strokeStyle = new SolidLine() // Set desired fill style of the stroke. .setFillStyle( // SolidLine can have only SolidFill fill-style. new SolidFill().setColor(ColorRGBA(96, 204, 232)), ) // Set thickness of the stroke. .setThickness(5.0) // Apply styling settings to the series. splineSeries.setStrokeStyle(strokeStyle)
Option 2: Styling using a mutator function.
Usually, it can be even more easy to simply modify the existing Style of a component, rather than constructing a new one. This is done using so-called mutator-functions. Here's an example:
// Modify the previous Stroke style of a SplineSeries, by overriding its previous thickness. splineSeries.setStrokeStyle((strokeStyle) => strokeStyle.setThickness(1.0))
Our coding practices include fluent, self-returning API, which allows us to easily call multiple setters in one statement.
splineSeries .setStrokeStyle(strokeStyle) // 'transparentFill' is a static constant // that needs to be imported from the library in order to be used. // It is used to draw things with transparent fill that aren't disposable // - like the points of a PointLineSeries. .setPointFillStyle(transparentFill)