DXcharts supports multiple types of business-related events, displayed along the chart's X-axis.
Supported event types include:
- Earnings
- Dividends
- Splits
- Conference calls
Use the Events component API (available via chart.events) to display and configure event markers on the chart.
Adding events
Use chart.events.setEvents to add events to the chart:
Visibility
Use chart.events.setVisible to change visibility.
Interaction
You can subscribe to hover events using chart.events.observeEventHovered:
Customizing appearance
Event icons
You can override event icons using the chart.config.components.events.icons configuration.
Each event type has two icon states: normal and hover.
Be sure to define both if overriding.
Custom icon example
To customize event labels, set a formatter in the configuration:
After applying a formatter, events will display the updated labels:
Configuration reference
Events configuration
ChartConfigComponentsEvents visible Toggle events visibility. boolean eventsVisibility Toggle specific event type visibility (for example: dividends, splits, earnings). Record<EventType, boolean> height Height of events area in pixels number cursor Configure events cursor type. string xAxisLabelFormat Configure x axis labels DateTimeFormatConfig[] icons Configure icons, the format is string which contains svg tag, for example:
'<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.06066 6.5L6.5 1.06066L11.9393 6.5L6.5 11.9393L1.06066 6.5Z" stroke="#D92C40" stroke-width="1.5"/>
</svg>' ChartConfigComponentsEventsIcons earnings CustomIcon normal string hover string dividends CustomIcon splits CustomIcon conference-calls CustomIcon line Configure the event type vertical line appearance ChartConfigComponentsEventsLine earnings ChartConfigComponentsEventsLine_earnings dividends ChartConfigComponentsEventsLine_dividends splits ChartConfigComponentsEventsLine_splits conference-calls ChartConfigComponentsEventsLine_conference-calls
Events color configuration
ChartConfigComponentsEventsColors earnings EventColors line string normal string hover string color string dividends EventColors splits EventColors conference-calls EventColors
Events component methods
Further reading