JavaScript/jQuery Funnel - label

View Demo

See Also

• resolveLabelOverlapping

This property supports the following colors:

• Hexadecimal colors
• RGB colors
• RGBA colors
• Predefined/cross-browser color names
• Predefined SVG colors
• Paint server address

You can remove the label's background by setting this property to "none". In this case, the label's text is the same color as the funnel item.

View Demo

A label is always displayed near its funnel item, but separately from it. Use a connector to make the relationship between the funnel item and its label evident.

Set the label.connector.visible property to true to make the label connectors visible.

View Demo

See the format section for information on accepted values.

If you specify the format with an object, it can also contain the percentPrecision field. Funnel items have absolute and percentage values. The percentPrecision field specifies how many decimal digits the percentage values should have:

format: {
    type: "fixedPoint", // the format of absolute values
    precision: 1, // the precision of absolute values (123.456 --> 123.4)
    percentPrecision: 2 // the precision of percentage values (12.3456 % --> 12.34 %)
}

See Also

• customizeText
• Value Formatting

The number assigned to this property specifies the shift in pixels. A negative number shifts the labels to the left, a positive number - to the right.

View Demo

The following modes are available:

• "normal"
  Text breaks only at allowed breakpoints (for example, a space between two words).

• "breakWord"
  Words can be broken if there are no available breakpoints in the line.

• "none"
  Word wrap is disabled.

If the text overflows the container even after word wrap, the UI component applies the textOverflow property.