Version: 1.0.0

Custom time scale

The CustomTimeScale module provides full control over the X-axis appearance, including text colors, grid lines, font, and axis background.

Overview

Edit custom-timescale.js to call window.ChartingAPI.setTimeScaleSettings(). Leave color fields empty for automatic theme-aware values.

Settings API

window.ChartingAPI.setTimeScaleSettings({
  textColor: '#707584', // Label text color
  lineColor: 'rgba(0,0,0,0.08)', // Grid line color
  lineWidth: 0.5, // Grid line thickness
  lineDash: [4, 4], // Grid dash pattern
  fontSize: '10px', // Label font size
  fontFamily: 'Inter, Arial, sans-serif',
  axisBackgroundColor: '#1a1a24' // X-axis row background
});

Options Reference

Option	Type	Description
textColor	string	Color of time labels on the X-axis.
lineColor	string	Color of vertical grid lines.
lineWidth	number	Grid line thickness in pixels.
lineDash	number[]	Dash pattern for grid lines.
fontSize	string	CSS font size string for time labels.
fontFamily	string	CSS font family for time labels.
axisBackgroundColor	string	X-axis row background color.