IntervalsLegend.TextHorizontalAlignment

Syntax

TextHorizontalAlignment: PP.HorizontalAlignment;

Description

The TextHorizontalAlignment property determines horizontal alignment of legend items' text.

Comments

Use JSON or the setTextHorizontalAlignment method to set the property value, and the getTextHorizontalAlignment method to get the property value.

Example

To execute the example, the HTML page must contain the BubbleChart component named bubbleChart (see Example of Creating the BubbleChart Component). Determine and set array of legend element name mappings with colors. Set right-border alignment for items' text and spacing between markers and legend items' text. Enable items highlighting, process the Selecting and Selected events by executing the following example in the browser console:

// Get interval legend
var legend = bubbleChart.getLegend();
// Determine array of mappings between names and legend element colors
var c = new PP.Color();
var el1 = {
    Name: "Element1",
    Color: c
}
var el2 = {
    Name: "Element2",
    Color: c
}
var arr = new Array();
arr[0] = el1;
arr[1] = el2;
// Set mappings between names and legend element colors
legend.setItems(arr);
// Set right text alignment
legend.setTextHorizontalAlignment(PP.HorizontalAlignment.Right);
// Set spacing between legend element text and marker
legend.setTextSpacing(30);
// Refresh chart
bubbleChart.refresh();
// Activate element highlight
legend.setDoHighlight(true);
var processSelectedEvent = true;
// Handle the Selecting event
legend.Selecting.add(function () {
    console.log("The Selecting event is initiated")
});
// Handle the Selected event
legend.Selected.add(function () {
    if (processSelectedEvent) {
        console.log("The Selected event is initiated");
        processSelectedEvent = false;
    }
});

Place the mouse cursor over a legend item.

After executing the example, the array of legend element name mappings with coloes is set. Items text is aligned to the right edge, and spacing between text of legend items and markers is defined:

The browser console informs that the processed events have been fired:

Selecting event initialized

Selected event initialized

See also:

IntervalsLegend