Interface EngineSettings

Set preference for anti-aliasing.

If set to true or undefined and browser supports anti-aliasing then the chart will be anti-aliased. If set to false or browser doesn't support anti-aliasing then the chart will not be anti-aliased.

Configure device pixel ratio behavior. By default, LightningChart acts according to meta tag "viewport" width=device-width. If the tag is present, LightningChart will follow window.devicePixelRatio, otherwise defaulting to 1.0 device pixel ratio.

<meta name="viewport" content="width=device-width, initial-scale=1.0">

You can also set this to a specific number if you want to use a specific device pixel ratio for some reason.

By default if this option is not specified the ratio will be automatically decided based on the existence of the viewport meta tag and the content of the tag if found. So default value is true.

Flag that can be used to disable all user interactions from created chart components.

This can be useful in server side rendering applications and also on frontend side when the user interactions are not needed.

Disabling user interactions can provide significant benefits to the performance and loading speed of charts.

By default, charts are always interactable.

 // Example, create chart without user interactions.
 const chart = lightningChart().ChartXY({
     interactable: false,
 })

Set preference for high quality line anti-aliasing.

If set to true or undefined and browser supports OES_standard_derivatives or WebGL2 then the non-primitive lines (thickness !== -1) will be anti-aliased. If set to false or browser doesn't support the OES_standard_derivatives extension or WebGl2 then the lines will not be anti-aliased with high quality but the line might me anti-aliased with default hardware anti-aliasing.

Setting antialias to false will also disable line anti-aliasing.

Max FPS (frames-per-second). Setting this will postpone rendering events that would otherwise happen, if it would result in FPS higher than the value.

NOTE: This property can't be used to accurately specify actual FPS as it is dictated by the browser. The purpose for 'maxFps' is to limit unnecessary rendering loads where they are not needed.

Specify precision level for interacting on charts with mouse, touch and other pointer devices.

The required precision can have a significant effect on charts performance. By default, a relatively low precision is used. When required, the precision can be increased by supplying a different value with this parameter.

Possible values:

• undefined | Default picking precision.
• 'low' | Use lower precision than the default. This will result in better performance but less precision with mouse, touch and other pointers.
• 'high' | Use higher precision than the default. This will result in decreased performance but better precision with mouse, touch and other pointers.
• 'best' | Use the best available picking precision. This will result in decreased performance but better precision with mouse, touch and other pointers.

Example usage:

 // Specify picking precision when a chart or dashboard is created.
 const chart = lightningChart().ChartXY({
     pickingPrecision: 'high'
 })

Text snapping to pixel enabled or disabled. By default true.

Text quality is sharper and clearer with pixel snapping, but in some cases it can show as undesirable "moving" or "bouncing" of text. So far this has been observed in slowly scrolling applications. If this becomes an issue in your application, try disabling text pixel snapping like below:

 // Example, disable text pixel snapping
 const chart = lightningChart().ChartXY({ textPixelSnappingEnabled: false })

This is an experimental feature, meaning that if it should become deprecated it will likely be immediately removed even without a major release. However, in this case an alternative method or fix to the issues solved with textPixelSnappingEnabled will also be introduced.

If you need to use textPixelSnappingEnabled in your application, please consider informing the developers of LightningChart JS at https://lightningchart.com/js-charts/docs/contact You do not need to share any extensive details about yourself, your company or your use case. However, it is important for us to get some idea if users start depending on this property. A simple message like "Hi, I just encountered a problem related to text pixel snapping and had to disable it with the textPixelSnappingEnabled flag." will do perfectly fine.

Color theme for the component.

A collection of default implementations can be accessed by Themes.

 // Example, specify color theme of chart.
 const chart = LightningChart.ChartXY({
     theme: Themes.light
 })

For custom color themes, refer to Developer Documentation > Themes section.