Introduction to 'jQWidgets jqxTreeMap colorRange' Property

The 'jQWidgets jqxTreeMap colorRange' property is used to customize the colors used to display ranges in a tree map chart. Ranges are created by specifying a minimum and maximum value, and colors are assigned to each range.

Syntax

The syntax for the 'jQWidgets jqxTreeMap colorRange' property is as follows:

colorRange: {
    colorScheme: string,
    min: number,
    max: number,
    startValue: number,
    endValue: number,
    colors: string[]
}

• colorScheme: The color scheme used to generate the range colors. The available options are: scheme01, scheme02, scheme03, scheme04, scheme05, scheme06, scheme07, scheme08, scheme09, scheme10, scheme11, scheme12.

• min: The minimum value for the range.

• max: The maximum value for the range.

• startValue: The starting value for the range.

• endValue: The ending value for the range.

• colors[]: An array of color strings to assign to the range.

Example

var settings = {
    source: data,
    colorRange: {
        colorScheme: 'scheme03',
        min: 0,
        max: 100,
        startValue: 0,
        endValue: 100,
        colors: ['#008000', '#FFFF00', '#FF0000']
    }
};

In this example, the 'jQWidgets jqxTreeMap colorRange' property is used to assign a color range to a tree map chart with data provided in the data variable. The color range is generated using the scheme03 color scheme, starting at 0 and ending at 100, with a range of values from 0 to 100. The colors green, yellow, and red are assigned to the range using the colors array.

Conclusion

The 'jQWidgets jqxTreeMap colorRange' property is a valuable tool for customizing the colors used in tree map charts. By specifying a range of values and assigning colors to that range, developers can create charts that are not only informative, but also visually appealing.