$(".selector").igFinancialChart({
dataSource: data,
xAxisLabelLeftMargin: 14,
xAxisLabelTextColor: "Green",
yAxisLabelTextColor: "Blue"
});
The igFinancialChart control allows you full control over configuring, formatting and styling the labels displayed along the x-axis and y-axis on your chart. By default, you do not need to explicitly set the labels.
This topic contains the following sections:
In the igFinancialChart control, you can change the rotation angle, margin, horizontal/vertical alignment, opacity, padding and visibility, of the x-axis and y-axis labels using the following properties:
The look and feel of the financial chart’s x-axis and y-axis labels can be styled in many aspects, the main of which are applying different font styles such as font type and colors to the labels. This can be achieved through the following properties:
The igFinancialChart control allows you to specify if the y-axis labels should display abbreviated numeric values on the y-axis. For label values that may appear too long, you can set YAxisAbbreviateLargeNumbers to true to enable this feature. This is set to true by default.
The following code example shows how to style labels on the x-axis using date formatting and other style properties:
In JavaScript:
$(".selector").igFinancialChart({
dataSource: data,
xAxisLabelLeftMargin: 14,
xAxisLabelTextColor: "Green",
yAxisLabelTextColor: "Blue"
});The following screenshot demonstrates the igFinancialChart control with the axis labels formatted and styled.
View on GitHub