How to use PHP dynamically generated pie chart, histogram and line chart

xiaoxiao2021-03-06  113

All content: How to use PHP dynamically generated pie chart, line chart and histogram topic discussion area: http://hh.cc163.com/Form/ Home: http://hh.cc163.com/

table of Contents

Preface

Design Ideas Realization Process Usage Implementation Map

Designing Ideas Implementation Process Usage Realization Effects Column

Design Ideas Implementation Process Usage Real Reference Related Links

sequence

PHP performs very well in image operation, we only need to make a picture, and the table is checked. Hereinafter, the author's scorpion map, a line diagram, and a histogram, and the method of using them. The characteristics of these codes are not needed to copy them into your code, just need to calculate the data. Parameter is incorporated, you can get the corresponding graphics effect

Development Environment: PHP Version 4.3.6 GD Version bundled (2.0.22 compatible)

Because the author is limited, there is a mistake in the article, I will be very grateful to your point

For instructions for all functions in the code, see the PHP Development Document Click here to get the latest version.

pie chart

Design ideas

The cake graph is a good method for viewing a percentage of a total value. We use PHP to implement a pie chart. Its design ideas are: 1 accept parameters, get all values, get the ratio of each value accounting for the sum of the quotations. 2 Calculate the circumference of each color block according to the proportion of the circumferential angle 3 to generate a stereo effect, only need to draw a shadow with deep color.

Implementation process

/ / Define an array to store the angle range of each color block $ jIAODU = array (); // Define storage data and variable $ total = 0; // Traverse the number of components and for ($ I = 0; $ I

// Create an image $ image = imagecreate ($ TUKUAN, $ TUGAO); // Defines a gray background color, this color is actually a very familiar page color 16 enrollment numbers represent # eeeeee $ white = imagecolorlocate ($ image 0xee, 0xee, 0xee);

// Remail the color of 10 pairs of deep shadows, deposit 2D array $ yanse = array (imagecolroomlocate ($ image, 0x97, 0xbd, 0x00), ImageColorallocate ($ image, 0x00, 0x99, 0x00), ImageColorlocate ($ image, 0xcc, 0x33, 0x00), imagecolorallocate ($ image, 0xff, 0xcc, 0x00), imagecolorallocate ($ image, 0x33, 0x66, 0xcc), imagecolorallocate ($ image, 0x33, 0xcc, 0x33), imagecolorallocate ($ image, 0xff, 0x99, 0x33), imagecolorallocate ($ image, 0xcc, 0xcc, 0x99), imagecolorallocate ($ image, 0x99, 0xcc, 0x66), imagecolorallocate ($ image, 0x66, 0xff, 0x99)), array (imagecolorallocate ($ image , 0x4f, 0x66, 0x00), imagecolorallocate ($ image, 0x00, 0x33, 0x00), imagecolorallocate ($ image, 0x48, 0x10, 0x00), imagecolorallocate ($ image, 0x7d, 0x64, 0x00), imagecolorallocate ($ image, 0x17 , 0x30, 0x64), imagecolorallocate ($ image, 0x1a, 0x6a, 0x1a), imagecolorallocate ($ image, 0x97, 0x4b, 0x00), imagecolorallocate ($ image, 0x78, 0x79, 0x3c), imagecolorallocate ($ image, 0x55, 0x7e , 0x27), ImageColo Rallocate ($ image, 0x00, 0x93, 0x37))))); // 10 pixels from the bottom to top 5 pixels, as a shadow $ yuanxin_x = $ TUKUAN / 2; for ($ h = $ tugao / 2 5; $ H> $ 5 {$ kaishi = 0; $ jieshu = 0; for ($ I = 0; $ I ) {$ Kaishi = $ Kaishi 0; $ jieshu = $ kaishi $ jiaodu [$ I]; $ yanse_i = fmod ($ I, 10); ImageFilleDarc ($ Image, $ YUANXIN_XIN_X, $ H, $ TUKUAN, $ TUGAO-20, $ Kaishi $ Jieshu, $ Yanse [1] [$ yanse_i], IMG_ARC_PIE); $ Kaishi = $ JIAODU [$ I]; $ Jieshu = $ JIAODU [$ I];}}

// Painted a light-color pie chart at the highest (that is, $ H), this light figure with the dark pie chart of the first painted, can produce a three-dimensional effect for FOR ($ I = 0; $ I How to use

Inserting the following code is inserted into the image A of the text format of "," connection, a string, GET method Incoming. Color maps are now, please arrange themselves:

Achieve effect

line chart

Design ideas

Seeing the change in a variation of a data in a line chart is a good choice. We use PHP to implement a dynamic line chart. Its design ideas are: 1 accept parameters, get all values, to obtain the maximum value of the data to determine the maximum scale value of the vertical axis determine the width of the image according to the number of data, and draw the horizontal axis and longitudinal axis coordinates and scale 3 Painting straight line connection, fill a 2 * 2 rectangle for each point, the position of the protrusion 4 labels the data value of each point at the top right of each point

Implementation process

$ zuidashujuzhi) $ zuidashujuzhi = $ shuju [$ I];} // get Image Width $ IMG_KUAN = $ zuo $ YOU COUNT ($ SHUJU) * $ jiange; // then create an image resource $ image = imagecreate ($ IMG_KUAN, $ IMG_GAO); // Gray background $ white = imagecolorallocate ($ image, 0xee 0xee, 0xee); // The coordinate axis displays $ zuobiao_yanse = imagecolorlocate ($ image, 0x00, 0x00, 0x00); // Paste, 4 = ImageColorAllocate ($ image, 0x00, 0x00, 0xff); // Painted coordinate // Horizontal ImageLine ($ IMG_GAO- $ xia, $ IMG_KUAN- $ YOA, $ IMG_GAO- $ xia, $ zuobiao_yanse); // vertical axis imagelineline ($ image, Zuo, $ SHANG / 2, $ Zuo, $ IMG_GAO- $ xia, $ zuobiao_yanse; // Get each point of coordinate for ($ I = 0; $ SHUJU); $ I ) {Array_Push ( $ p_x, $ zuo $ i * $ jiange); A Rray_push ($ P_Y, $ SHANG ROUND ($ IMG_GAO- $ XIA) * (1- $ SHUJU [$ I] / $ zuidashujuzhi)));}

// Longitudinal axis imaging ($ zuo 6, $ shang, $ zuobiao_yanse; imageString ($ Image, 1, $ Zuo / 4, $ SHANG, $ zuidashujuzhi, $ zuobiao_yanse; Imageline ($ Imageline ($ IMG_GAO- $ SHANG- $ xia) * 1/4, $ zuo 6, $ Shanghai ($ IMG_GAO- $ SHANG- $ xia) * 1/4, $ zuobiao_yanse ImageString ($ Image, 1, $ Zuo / 4, $ shang ($ IMG_GAO- $ SHANG- $ xia) * 1/4, $ zuidashujuzhi * 3/4, $ zuobiao_yanse; imageline ($ images, $ zuo, $ Shang ($ IMG_GAO- $ SHANG- $ xia) * 2/4, $ ZuO 6, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 2/4, $ zuobiao_yanse; imagestring ($ image, 1, $ Zuo / 4, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 2/4, $ zuidashujuzhi * 2/4, $ zuobiao_yanse; imageline ($ zuo, $ shang ($ IMG_GAO- $ SHANG- $ XIA) * 3/4, $ zuo 6, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 3/4, $ zuobiao_yanse; ImagesTring ($ Image, 1, $ Zuo / 4, $ SHANG ($ IMG_GAO - $ SHANG- $ xia) * 3/4, $ zuidashujuzhi * 1/4, $ zuobiao_yanse); // Horizontal scale for ($ I = 0; $ 6); $ i ) {imagelineline $ IMAGE ($ IMG_GAO- $ xia, $ zuo $ I * $ JIANGE, $ IMG_GAO- $ xia-6, $ zuobiao_yanse; imageString ($ image, 1, $ zuo $ i * $ @ $ * Jiange- $ J IANGE / 4, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) 2, $ y_name [$ I], $ zuobiao_yanse;}

// Passer $ shuju_yanse_int = 0; for ($ I = 0; $ I How to use

Insert the following code of the value by you It is calculated that the text format of a A ",", ",", ",", GET, incorporated.

Since writing in Chinese is required to write Chinese, there is more PHP environment configuration, so it will be given an HTML solution. It is also very flexible: everyone only needs to dynamically generate a table to place the horizontal axis coordinate scale according to the number of data. , Like this

For ($ I = 0; $ I <12; $ I ) {

Echo "

"" "month ";

}

?>

Achieve effect

Histogram

Design ideas

Still first determine the scale value of the longitudinal axis, determine the maximum value of the longitudinal axis and then determine the width of the image based on the number of data obtained. At this time, the image can be created to calculate the height of each hue, and the high degree can be calculated. The fill range draws the coordinate axis with a line, and the scale value is filled with a rectangular fill color column, and the data value is labeled in the html method to draw the required horizontal axis coordinate name.

Implementation process

$ zuidashujuzhi = $ shuju [$ i];} // calculate image width $ IMG_KUAN = $ Zuo $ YOU $ JIANGE Count ($ SHUJU) * ($ Kuan $ jiange); // Image High $ IMG_GAO = 170; // Storage Column Height Array $ zhugaodu = array (); $ image = imagecreate ($ IMG_Kuan , $ img_gao); $ white = imagecolorallocate ($ image, 0xEE, 0xEE, 0xEE); // color Col $ shuju_yanse = array (imagecolorallocate ($ image, 0x97, 0xbd, 0x00), imagecolorallocate ($ image, 0x00, 0x99 , 0x00), imagecolorallocate ($ image, 0xcc, 0x33, 0x00), imagecolorallocate ($ image, 0xff, 0xcc, 0x00), imagecolorallocate ($ image, 0x33, 0x66, 0xcc), imagecolorallocate ($ image, 0x33, 0xcc, 0x33 ), ImagecolorAllocate ($ image, 0xff, 0x99, 0x33), ImageColoralLocate ($ image, 0xcc, 0xcc, 0x99), ImageColoralLocate ($ image, 0x99, 0xcc, 0x66), Image ColoralLocate ($ image, 0x66, 0xff, 0x99)); // Coordinate shaft color $ zuobiao_yanse = imagecolorallocate ($ image, 0x00, 0x00, 0x00); // Horizontal axis ImagelineLine ($ 轴, $ IMG_GAO- $ xia $ IMG_KUAN- $ YOU / 2, $ IMG_GAO- $ xia, $ zuobiao_yanse; // Longitudinal axis ImagelineLine ($ zuo, $ shang / 2, $ zuo, $ IMG_GAO- $ xia, $ zuobiao_yanse;

// Longitudinal axis, a total of 4 points on the vertical axis, so it is calculated separately ($ image, $ zuo, $ shang, $ zuo 6, $ shang, $ zuobiao_yanse); imageString ($ image, 3 $ Zuo / 4, $ SHANG, Round ($ zuidashujuzhi), $ zuobiao_yanse; Imageline ($ IMAGE, $ ZUO, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 1/4, $ zuo 6, Round ($ shang ($ IMG_GAO- $ SHANG- $ xia) * 1/4), $ zuobiao_yanse; imageString ($ Image, 3, $ zuo / 4, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 1 / 4, Round ($ zuidashujuzhi * 3/4), $ zuobiao_yanse; Imageline ($ IMAGE, $ ZUO, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 2/4, $ zuo 6, $ SHANG ($ Img_gao- $ shang- $ xia) * 2/4, $ zuobiao_YANSE); ImageString ($ Image, 3, $ ZUO / 4, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 2/4, Round ($ zuidashujuzhi * 2/4), $ zuobiao_yanse; Imageline ($ IMAGE, $ ZUO, $ SHANG $ xia) * 3/4, $ zuo 6, $ SHANG ($ IMG_GAO- $ SHANG- $ XIA) * 3/4, $ zuobiao_yanse; imageString ($ Image, 3, $ ZUO / 4, $ SHANG ($ IMG_GAO- $ SHANG- $ xia) * 3/4, Round ($ zuidashujuzhi * 1/4), $ zuobiao_yanse;

// Get the height for each column ($ I = 0; $ SHUJU); $ I ) {Array_Push ($ zhugaodu, Round ($ IMG_GAO- $ SHANG- $ xia) * $ SHUJU [$ I] / $ zuidashujuzhi);} // Painted data column $ SHUJU_YANSE_INT = 0; for ($ I = 0; $ I ) {ImageFilledRectangle ($ image, $ zuo $ jiange $ i * ($ Kuan $ JIANGE), $ SHANG ($ izg_gao- $ shang- $ xia) - $ zhugaodu [$ I], $ zuo $ jiange $ i * ($ Kuan $ jiange) $ Kuan, ($ IMG_GAO- $ XIA) -1, $ shuju_yanse [$ shuju_yanse_int]); // Because only 10 colors are defined, here is a loop IF ($ shuju_yanse_int == 9) {$ shuju_yanse_int = 0;} else {$ shuju_yanse_int ;}} // Take the data value on the data column for ($ I = 0; $ shuju); $ i ) {imagestring ($ image, 1, $ zuo $ jiange $ i * ($ kuan $ jiange) 2 $ SHANG ($ IMG_GAO- $ SHANG- $ xia) - $ zhugaodu [$ I] -10, $ SHUJU [$ I], $ Zuobiao_YANSE);} Header ('content-type: image / png'); imagePNG (iMagePNG); imagepng $ image); imageDestroy ($ image);?> How to use

Insert the image as needed to display the following code where A is required by you It is calculated that the text format of a A ",", ",", ",", GET, incorporated.

Also use an HTML solution to solve the problem of horizontal scale name: Dynamically generate a table to place the horizontal axis coordinate scale name, like this

For ($ I = 0; $ I <12; $ I ) {

Echo "

"". $ i. "Month ";

}

?>

Achieve effect

references

PHP manual http://www.php.net/docs.php

Related Links

Original full version http://hh.cc163.com/php/phpimagehowto/default.htm

All content downloads: http://h.cc163.com/php/phpimagehowto/phpimagehowto.rar

The discussion area http://h.cc163.com/mm/

Home http://h.cc163.com/

转载请注明原文地址:https://www.9cbs.com/read-101196.html

New Post(0)
CopyRight © 2020 All Rights Reserved
Processed: 0.040, SQL: 9