Fusionchart getting started 7

Source: Internet
Author: User

Font Style Type

 As you know, with the font style type, you can control the visual features of text on all charts. The following attributes are the extended Font types. AndCodeThe example is explained as follows:

 

Attribute

Brief Description

Example or valid value

Font

Set text font family

Verdana, Arial ..

Size

Font Size

10, 12 ..

Color

Set the font color, which is not included in hexadecimal code #

Ff0000, ffffdd

Bold

Whether the font is marked in bold

1Is a rough graph,0No

Italic

Italic or not

1Yes,0No

Underline

Underline or not

1Yes,0No

Bgcolor

Text font background color, no hexadecimal code #

Ff0000, ffffdd

Bordercolor

If you need to set the border color for this article, you need to set this attribute

 

Ishtml

Helps you set whether text should be rendered in HTML or plain text

 

Leftmargin

The left edge unit of the text is points.

 

Letterspacing

Number of spaces with consistent character distribution

 

Font family ,Size&Color

The basic attributes of a font include the font family, size, and color. You can use the preceding attributes to set them as shown in,
<Style name = 'myfirstfontstyle' type = 'font 'font = 'verdana' size = '12' color = 'ff000000'/>

 

Attribute

Format

Example

Font

Font ='Fontfamily'

Font ='Verdana'

Size

Size ='Fontsize'

Size ='12'

Color

Color ='Hexcode (#)'

Color ='Ff000000'

Here, the font refers to the font family of the end user's system (otherwise the default system font will now be used to draw text ). The color should be in hexadecimal format #

Bold,Italics&Underline Modify your text. You can use any of the above parameters.
<Style name = 'myfirstfontstyle' type = 'font' font = 'verdana 'size = '12' color = 'ff000000' Bold = '1' italic = '1' underline = '1'/>

 

Attribute

Format

Example

Bold

Bold ='Logicalvalue'

Bold ='1'Or bold ='0'

Italic

Italic ='Logicalvalue'

Italic ='1'Italic ='0'

Underline

Underline ='Logicalvalue'

Underline ='1'Or underline ='0'

The code above ensures that your font is displayed in bold, italic, and underline.

  Background ColorAnd Border color

If you plan to use the color or background color of the text box border on your chart, you can use the above two parameters to determine the hexadecimal color code (without #) as follows:
<Style name = 'myfirstfontstyle' type = 'font' font = 'verdana 'size = '12' color = 'ff000000' Bgcolor = 'ffffdd' bordercolor = '000000'/>

attribute

Format

example

bgcolor

bgcolor = 'value'

bgcolor = 'ffffffd'

bordercolor

bordercolor = 'value'

bordercolor = '000000'

When a text field (such as the title) is applied to a chart, the output style is as follows:

The chart title ("products per category") applies the border and background color.

Ishtml

This attribute is useful when you use HTML characters as part of your text, for example,"<5" or "> 5"Etc. By default, fusioncharts parses all textHtmlAnd"<5"Will be considered as not closedHtmlMarked but not displayed at all.

For example, if you want"<5"For a specific value, you should use:
<Set name = '& lt; 5' value = '7'/>
(Note:& Lt; Yes<Encoded format,This is inXMLData Files ).

The chart elements are defined as text styles:
<Style name = 'labelfont' type = 'font' font = 'arial' size = '10' Ishtml = '0'/>

 

Attribute

Format

For example

Ishtml

Ishtml = 'logicalvalue'

Ishtml = '1' or ishtml = '0'

 LeftmarginAndLetterspacing

Leftmargin allows you to set the left margin of the text. letterspacing allows you to control the evenly distributed space between characters-the number of bytes added to the space after each character specified by the value. Negative values are also allowed.

For example,
<Style name = 'myfirstfontstyle' type = 'font 'font = 'verdana' size = '12' color = 'ff000000' bgcolor = 'ffffffd' bordercolor = '000000' Leftmargin = '10' letterspacing = '3'/>

 

Attribute

Format

Example

Leftmargin

Leftmargin ='Value in pixels'

Leftmargin ='10'

Letterspacing

Letterspacing ='Value in pixels'

Letterspacing ='3'

The preceding style is applied to the chart title and the output is as follows:

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.