Version

Configuring Graph Background

Purpose

This topic explains, with code examples, how to configure a background for the bullet graph. This includes setting the background’s size, position, color, and border.

Required background

The following topics are prerequisites to understanding this topic:

Topic Purpose

This topic provides conceptual information about the UltraBulletGraph™ control including its main features, minimum requirements, and user functionality.

This topic explains how to add the UltraBulletGraph control to a Windows Forms application.

In this topic

This topic contains the following sections:

Configuring the Background

Background configuration summary

The background of the UltraBulletGraph control is configurable in terms of spread, position and look-and-feel (fill and border). The spread and position are configurable in the dimension across the scale (through the BackingInnerExtent and BackingOuterExtent properties); along the scale, the background always spreads from one edge of the control to the other. The fill color and the border are managed by a set of properties available in the style template.

The following picture demonstrates a background color of a variety of orange and a cyan border with a thickness of 3 pixels. The background extent is made smaller by providing values for its BackingInnerExtent and BackingOuterExtent properties.

BulletGraph Configuring the Background 1.png

Background configuration summary chart

The following table explains briefly the configurable aspects of UltraBulletGraph control’s background and maps them to properties that configure them.

Configurable aspects Property Default value

Spread and position (across the scale)

0

Spread and position (across the scale)

1.0

Fill color

Defined in the default theme

Border color

Defined in the default theme

Border thickness

2.0

Property settings

The following table maps the desired behavior to its respective property settings.

In order to configure: Details Use this property: And set it to:

Bottom Left edge position

The position of the lower edge of the background (at horizontal orientation) or the left edge (at vertical orientation) relative to the bottom edge of the Graph area at horizontal orientation or to its left edge – at vertical orientation.

The desired value as a relative part of the height/width of the Graph area (depending on the orientation) presented as a fraction of 1 (e.g. 0.2)

Top / right edge position

The position of the top edge of the background at horizontal orientation or the right edge at vertical orientation relative to the lower edge of the Graph area at horizontal orientation or to its left edge – at vertical orientation.

The desired value as a relative part of the height/width of the Graph area (depending on the orientation) presented as a fraction of 1 (e.g. 0.2 )

Fill color

Fill color of the background

The desired color

Border thickness

Border thickness of the background

The desired value in pixels

Border color

Border color of the background

The desired color

Example

The screenshot below demonstrates how the UltraBulletGraph looks as a result of the following settings:

Property Value

“#ffffdab9”

“#ff00ffff”

“3”

“0.2”

“0.7”
BulletGraph Configuring the Background 2.png

Following is the code that implements this example.

In C#:

bulletGraph.BackingBrush = new SolidColorBrush(Color.FromArgb(255, 218, 185));
bulletGraph.BackingOutline = new SolidColorBrush(Color.FromArgb(0, 255, 255));
bulletGraph.BackingStrokeThickness = 3;
bulletGraph.BackingInnerExtent = .2;
bulletGraph.BackingOuterExtent = .7;

In VB:

bulletGraph.BackingBrush = new SolidColorBrush(Color.FromArgb(255, 218, 185))
bulletGraph.BackingOutline = new SolidColorBrush(Color.FromArgb(0, 255, 255))
bulletGraph.BackingStrokeThickness = 3
bulletGraph.BackingInnerExtent = .2
bulletGraph.BackingOuterExtent = .7

Related Content

Topics

The following topics provide additional information related to this topic.

Topic Purpose

This topic explains, with examples, how to configure the scale of the UltraBulletGraph control. This includes positioning the scale inside the control and configuring the scale tick marks and labels.

This topic explains, with examples, how to configure the performance bar of the UltraBulletGraph control. This includes the value indicated by the bar, its width, position, and formatting.

This topic explains, with code examples, how to configure the comparative measure marker of the UltraBulletGraph control. This includes the marker’s value, width, and formatting.

This topic explains, with code examples, how to configure ranges in the UltraBulletGraph control. This includes the number of ranges and their positions, lengths, widths, and formatting.