Jpgraph Chinese user manual text and font control tutorial

Source: Internet
Author: User
Tags italic font italic font style
The installation and configuration methods of jpgraph fonts have been introduced in the phpjpgraph installation and configuration tutorial. the use of fonts and texts in the jpgraph class library is very important, jpgraph can control text rotation, alignment, font size, and introduce user-defined fonts. The jpgraph tool SymChar can be used to find related special characters (such as mathematical operators) to facilitate the installation and configuration of jpgraph fonts in the previous php jpgraph installation and configuration tutorial, the use of fonts and texts in the jpgraph class library is very important. jpgraph can control text rotation, alignment, font size, and introduce user-defined fonts. The jpgraph tool SymChar can be used to find related special characters (such as mathematical operators) to facilitate text description of charts. The jpgraph class library supports Chinese, Japanese, and English character encoding configurations to adapt to different language environments.

Before starting this tutorial, make sure that you have installed and supported TTF fonts. For more information, see the jpgraph font installation and configuration tutorial.

To better display quality and display all characters, we recommend that you use the TTF font instead of the Bitmap font.

All files in the jpgraph class library are UTF-8 encoded.

  Different types of fonts

The class library supports two basic fonts.

1,Bitmap font

There are three built-in Bitmap fonts: FF_FONT0, FF_FONT1, and FF_FONT2. The advantage of Bitmap font is that it can always be used after GD is installed. However, the Bitmap font only supports 7-bit ASCII, so it is impossible to use the Bitmap font if you need to display any characters. The available Bitmap font sizes are also limited. The three corresponding fonts, FF_FONT0 is the smallest, and FF_FONT2 is the largest available Bitmap font.

  Example of jpgraph font usage: The following script shows a typical Bitmap font usage.

1
2
3
4
5
6
$ Graph = new Graph (....);

// Adjust the title to use the largest built-in Bitmap font and bold it
$ Graph-> title-> SetFont (FF_FONT2, FS_BOLD );
?>

2,TTF font

TTF font can improve the visual quality of text. The TTF font supports all sizes and more fonts. All fonts except the three Bitmap fonts are TTF fonts. To use these fonts, the installation of fonts must be configured according to the requirements of the class library.

  Example of jpgraph TTF font usage: The following script shows a typical usage of the image title using the Arial TTF font

1
2
3
4
5
6
$ Graph = new Graph (....);

// Adjust the title size to 14 and use both the Arial font and bold
$ Graph-> title-> SetFont (FF_ARIAL, FS_BOLD, 14 );
?>

  Font family and font type

  Default TTF font

Before version 3.5, the Bitmap font is used by default. you can specify from FF_FONT0 to FF_FONT2. From version 3.5, the default font is now set to the open-source TTF DejaVu font (FF_DV_SANSSERIF, DejaVuSans. ttf ). This TTF font is included in the source code of jpgraph (src/font) and does not need to be specified.

You can change the default font by changing the FF_DEFAULT value defined in the jpgraph_ttf.inc.php file. To use another font, you must prepare the corresponding font file.

If the FreeType library is not supported in your PHP environment configuration, you can use the original Bitmap font to ensure compatibility.

When using text, all graphic objects allow you to specify the font by calling the SetFont () method, which has three parameters.

1,Font family. For example, Arial, Times roman TTF font, or Bitmap font of medium size can be used when Bitmap is used. The font family must be specified by the prefix FF. For all supported font generations, see the Latin font family standard diagrams supported in Table 8.2 in the jpgraph help documentation.

2,Font style. It is italic, bold, or bold. By default, all font styles are normal. The font style can be specified by prefix FS. Supported font styles include FS_NORMAL (normal font style), FS_BOLD (bold font style), FS_ITALIC (italic font style), and FS_BOLDITALIC bold italic (font family must be supported)

3,Font size. An integer in the unit of pt.

  Note:: According to the DejaVu font version installed on the system, there are two naming conventions for font files. The jpgraph class library tries to use these two naming methods to check whether the font file can be found.

  Learn about text alignment and anchor

When the position specified by the text string is the screen position, the default position is the alignment at the top left corner of the string boundary box that can be obtained. The upper left corner is the anchor of the text string. You can adjust the anchor alignment by calling the Text: SetAlignment ($ aHorAlign, $ vertAlign) method. The two parameters are used as text strings. the acceptable parameter values are as follows:

  Horizontal alignment: 'Left', 'center', 'right'

  Vertical alignment: 'Bottom ', 'center' (or 'middle'), 'top'

  Note:: Even if Bitmap and TTF fonts are viewed from the API perspective, sharing the same user API interfaces varies widely. There are many subtle differences between the built-in bitmap font and TrueType font on the screen.

It is most useful to manually set anchor alignment when you add text objects to charts to achieve the desired alignment effect. You can see how the anchor changes.


Text alignment supported by jpgraph


  Note:: The SetAlignment () method may look strange. in the true sense, it uses the SetAnchor () method. This is due to the historical reasons of the naming scheme.

  Use jpgraph to rotate text

Bitmap font and TTF font support rotating text to varying degrees. Bitmap fonts may only use horizontal or vertical text, such as 0-or 90-degree rotation. TTF fonts support any angle.

If you use the Bitmap font and specify an angle other than 0 or 90 degrees, an error is displayed.

The most common usage of rotating text is to adjust the x axis labels so that they are displayed at a 45 degree angle. Axis: SetLabelAngle () is required to rotate the label ().

In addition to the label axis, you can also rotate almost all text objects, except the chart title, which can only be horizontally oriented. To add a Text object to any position on the chart, you must use the Text: SetAngle () method to specify the desired Text angle. Another common feature is that text labels can be rotated when a single data point is labeled.

  Note:: When a text section is rotated, the alignment in the section is always reset to left. It is not possible to use center or right section alignment in Rotated text.

  Format text paragraphs

The text rendering engine in the jpgraph class library provides some basic text section formats.

1. the jpgraph class library supports multiline text as a segment

2. the jpgraph class library can adjust the text alignment in a paragraph: left, right, or center.

3. automatic line feed is supported if text rendering is enabled.

All text processing is performed by using the text processing class (defined in the jpgraph_text.inc.php file). It can be used to add any text to the chart, or to operate the text on labels and titles in the class library. All these texts are examples of text classes.

The section alignment control is mainly implemented through the Text: SetParagraphAlign ($ aAlignment) method. The parameter is one of the text strings 'left', 'right', and 'center '.

The jpgraph class library does not support the padding alignment between individual characters in a paragraph. This is more complex.

Section alignment


Different section alignment modes supported by jpgraph


Inserting a linefeed "\ n" in the text will lead to a line break and start the next line. Note that line breaks must use double quotation marks instead of single quotation marks.

Bitmap font rotation. for example, automatic line feed is not supported in vertical la s. If the vertical text needs to wrap, the TTF font must be used.

  How to add common TTF fonts

In addition to predefined fonts, the jpgraph class library can easily use three custom fonts. This is done by first specifying the name of the font file to be used, and then specifying one of the FF_USERFONT1, FF_USERFONT2 or FF_USERFONT3 font3 font family. Install a new font by calling one or more methods.

Graph: SetUserFont1 ($ aNormal, $ aBold, $ aItalic, $ aBoldIt) (same name function SetUserFont ())

Graph: SetUserFont2 ($ aNormal, $ aBold, $ aItalic, $ aBoldIt)

Graph: SetUserFont3 ($ aNormal, $ aBold, $ aItalic, $ aBoldIt)

The parameters of these methods must be the font file name containing the full path. All parameters except $ aNormal are optional.

The following is an example of specifying and installing a user-specified font:

1
2
3
4
5
6
7
8
9
10
11
//...
$ Graph-> SetUserFont ('/usr/share/fonts/ttf/digital. ttf ');

$ Graph-> title-> SetFont (FF_USERFONT, FS_NORMAL, 12 );

$ Graph-> title-> Set ('test title'. $ pi );

//...

?>

  Insert Unicode object

One of the reasons for using TTF fonts is that Unicode characters/entities can be inserted. With the extended characters that cannot be normally used on the Western European keyboard, you can use them.

For example, classical mathematical symbols, such as Greek letters of PI. To make these and other commonly used special characters easier to use, the jpgraph class library provides a tool class that can be easily used without the need to find the corresponding Unicode entity each time.

To specify characters that cannot be used on the keyboard, the commonly used method is to specify Unicode code. the text string must contain the prefix &#. For example, if the Unicode character pi is hex 03C0, you need to write it in the string: this is PI π. Note that the given decimal code in the string always uses four digits (if necessary, pre-fill 0 ). The jpgraph class library provides a simple method for searching for special character encoding.

  Tool class SymChar

Because finding the corresponding values of all character codes is boring, to simplify this work, the SymChar class allows you to find these characters in common English names. For example, you can create a Greek character PI.

1
2
3
4
5
6
7
8
//...
$ Pi = SymChar: Get ('pi ');

$ Graph-> title-> Set ('test is pi '. $ pi );

//...
?>

Table 8.3 lists all objects with symbolic names supported by the SymChar class.

SymChar: The first parameter of Get () should be the object name.

  Character encoding

Skip this section if you do not use Japanese, Chinese, Spanish, Greek or Hebrew languages.

The core issue of the jpgraph class library is that it does not know the encoding of the input string. Because the TTF font is required, it is very useful to tell the class library input encoding so that the class library can do the necessary character encoding conversion to generate UTF-8 or UTF-16 encoding. The main supported language environment encoding options are described as follows.

The JpGraph library files and by default all instances are UTF-8 encoded.

All the information mentioned below can be found in the jpgraph_ttf.inc.php file.

  Japanese encoding options

Only one possible option can be specified.

ASSUME_EUCJP_ENCODINGTrue/falseAssume that you have entered Japanese text in the EUC-JP encoding environment. If this definition is true, using the PHP mbstring library in the jpgraph class library can automatically convert from EUC-JP to UTF8. Note that multi-byte extensions in PHP are generally not enabled.

Otherwise, it is assumed that the entered character encoding uses a UTF-8. Note: to display Japanese characters (Kanji, Hiragana and Katakana), you must specify a Japanese font family (FF_MINCHO, FF_PMINCHO, FF_GOTHIC or FF_PGOTHIC)

  Chinese Character Options

GB2312 is converted to a UTF-8 if the font is specified as the built-in FF_SIMSUN Library. The conversion table is stored in the jpgraph_gb2312.inc.php file.

If the font is specified as FF_CHINESE, it is not converted because assuming that the input string is already a UTF-8, only the effect of changing the default Chinese font family for the font is true.

If the font is specified as FF_BIG5, it is assumed that the input string is BIG5 encoded and the internal conversion to UTF-8 encoding is done through the iconv () function. This means that PHP must have built-in support for iconv (). By default, this is not compiled into PHP (some PHP installation versions in Windows are supported, and Unix needs to be compiled manually and configured with "-width-iconv "). If this method does not exist, the jpgraph class library will generate an error message.

  Spanish text encoding options

To perform the correct conversion, LANGUAGE_CYRILLIC must be defined as true. if you are running the jpgraph class library in a multi-user environment, you may need to adjust the LANGUGAE_CHARSET option. its definition is as follows:

LANGUAGE_CYRILLICTrue/falseWhether or not it supports the special Unicode Spanish support.

CYRILLIC_FROM_WINDOWSTrue/falseIf you set it to true, it will assume that the entered character encoding is Windows1251, and if it is false, it will assume that it is a KOI8-R.

LANGUAGE_CHARSETStringThis constant is used to automatically detect whether the sieril conversion is really necessary if enabled. You only need to specify the encoding method used, such as "Windows-1251 ".

Typical string UTF-8 or UTF-8, which is case-insensitive. If the character set is not a derived character set of 'koi8-R' or 'windows-1251 ', the conversion will not occur. This constant is very important in multi-user and multi-language environments.

Usage:

1
2
3
Define ('language _ CHARSET ', $ locale_char_set );
?>

$ Locale_char_set is a global string variable.

  Greek character encoding options

To correctly translate from Greek to Unicode, LANGUAGE_GREEK should be specified as true

LANGUAGE_GREEKTrue/falseWhether the Greek language supports special Unicode characters

GREEK_FROM_WINDOWSTrue/falseIf you set this definition to true, the conversion of Greek characters will assume that the input text is Windows1251.

So far, the jpgraph class library has completed the tutorial on text character and font control instructions. it is essential to be familiar with and master the font and text control methods to use jpgraph to draw charts, I hope it will be helpful to my friends who use jpgraph.

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.