Create Text Annotations
Prerequisites
What is Text Annotation?
Text annotation enriches textual data by adding metadata or labels, aiding both machine learning algorithms and human users. It involves identifying and marking elements like entities, sentiments, or classifications, which are crucial for natural language processing (NLP) and machine learning. Various forms of annotation, such as entity recognition and sentiment analysis, extract valuable insights from unstructured text, enabling accurate predictions and enhanced understanding.
You can use annotated anchor charts to add notes, labels, or any other contextual text information that you may want to make available to your users.
A column 2D chart rendered using text annotations is shown below:
Click here to edit the above chart.
The text "Promotional activities for Butterfinger made it surpass Snickers, the highest selling brand for 3 years" is a text annotation.
Adding this text to the chart makes it self-descriptive and easy for a user to understand the chart. You can add multiple text annotations on a chart that can be notes, labels, or any text that adds more context to the chart.
The JSON structure for creating text annotations is given below:
{
"chart": {
...
},
"data": [{
...
}],
"annotations": {
"groups": [{
"items": [{
//Text annotation 1
"type": "text",
//Define the attributes needed to create a text annotation
...
}, {
//Text annotation n
"type": "text",
//Define the attributes needed to create a text annotation
...
}]
}]
}
}
Use the following attributes to text annotations, to add notes, labels, or any other contextual text information to charts.
Set a unique identification for the annotation using the
id
attribute. You can then use it to identify and change other properties of the annotation.Set the type of annotation to be rendered using the
type
attribute. In this instance, set it to text.Set the x coordinate of the position of the text annotation for the leftmost position (taken as zero) of the chart using the
x
attribute.Set the y coordinate of the position of the text annotation for the topmost position (taken as zero) of the chart using the
y
attribute.Set the font family for the text annotation using the
font
attribute.Set the font size for the text annotation using the
fontSize
attribute.Set the horizontal alignment of the text annotation using the
align
attribute, which acceptsleft
,center
(default), orright
as value.Set the vertical alignment of the text annotation using the
vAlign
attribute, which acceptstop
,middle
(default), orbottom
as values.Set the value of
bold
attribute to1
, to render the annotation text in bold formatting.Set the value of
italic
attribute to1
, to render the annotation text in italic formatting.Set the color of the text annotation using the
color
attribute, which accepts hex codes of colors.Set the transparency of the annotation using the
alpha
attribute, which accepts values between0
(transparent) and100
(opaque, default).Set the background color of the text annotation using the
bgColor
attribute, which accepts hex codes of colors.Set a fixed margin in pixels, to the left of the text, using the
leftMargin
attribute.Rotate the text annotation using the rotateText attribute, which accepts
0
(default),1
,left
, orright
as values.Set the value of the
wrap
attribute to1
, to enable text wrapping for the annotation.Set the width after which the text will be wrapped, using the
wrapWidth
attribute. You can also set thetoX
andtoY
attributes if you provide the text wrapping dimensions in absolute pixels from the origin coordinates of the annotation group.Set the maximum height the text can occupy, using the
wrapHeight
attribute. The chart will append ellipses to the end of the annotation whenever the text overflows beyond the vertical space that you allocate using thewrapHeight
ortoY
attribute.
Enhance Charts with Text Annotations in FusionCharts XT
Start enhancing your charts with text annotations today to provide valuable context and insights to your users. Utilize FusionCharts Suite XT to create visually appealing charts enriched with annotations. Dive into the documentation and begin annotating your charts for enhanced clarity and comprehension.
Enrich your charts with valuable insights using FusionCharts Suite XT's annotate anchor chart today!
FAQs
What are the benefits of using text annotations in charts?
Text annotations enrich charts by providing additional context and insights, making them easier to understand for users. Annotations can highlight key points, provide explanations, or label specific data points, enhancing the overall clarity of the chart.
Can I add multiple text annotations to a single chart?
Yes, you can add multiple text annotations to a chart. These annotations can be notes, labels, or any other contextual information that adds value to the visualization. Each annotate anchor chart can have its own unique properties and styling.
How do I customize the appearance of text annotations in FusionCharts?
Text annotations can be customized extensively using various attributes such as font family, font size, alignment, color, and background color. You can also apply formatting styles like bold or italic to the text, adjust transparency, and enable text wrapping for better presentation.
Is it possible to dynamically update or change text annotations on the chart?
Yes, you can dynamically update or modify text annotations on the chart. By assigning a unique identification (ID) to each annotation, you can easily target and manipulate specific annotations as needed, either through direct interaction or programmatically.
Are there any limitations to text annotations in FusionCharts Suite XT?
While annotate anchor chart offers great flexibility and customization options, it's important to note any limitations regarding performance or compatibility with certain chart types or configurations. Refer to the documentation for detailed information on best practices and potential constraints.