PHP cashing dynamically generates pie, histogram, and line charts (GO)

PHP enables dynamic generation of pie, histogram, and line charts (GO)
PHP in the image operation is very good performance, we can only use the free access to the GD library can easily achieve the diagram, table sketch. Here are the PHP implementation of the pie chart, line and column chart and their use, the characteristics of these pieces of code is no need to copy them into your code, just to get the calculated data as parameters, you can get the corresponding graphic effect
For a description of all functions used in the code, see the PHP development documentation

Pie chart
Design ideas
A pie chart is a good way to view the percentage of a value as a percent of the total. We use PHP to implement a pie chart.
It is designed with the following ideas:
1 accept the parameter, get the sum of all the values, and get each value as a proportion of the total value.
2 calculates the circumference angle of each color block in the graph according to the scale
3 to create a stereoscopic effect, you just need to draw a shadow with a dark color.

Implementation process

 $tugao/2-5; $h-) {$kaishi =0; $jieshu =0;for ($i = 0; $i < count ($shuju); $i + +) {$kaishi = $kaishi +0; $jieshu = $kaishi + $jiaodu [$i];$ Yanse_i=fmod ($i), Imagefilledarc ($image, $yuanxin _x, $h, $tukuan, $tugao -20, $kaishi, $jieshu, $yanse [1][$yanse _i], Img_arc_pie); $kaishi + = $jiaodu [$i]; $jieshu + = $jiaodu [$i];}} Draw a light pie chart at the top (i.e., $h minimum), which produces a stereoscopic effect for ($i = 0; $i < count ($shuju), $i + +) {$kaishi = $kaishi +0; $jieshu =$, with a dark pie chart first kaishi+ $jiaodu [$i]; $yanse _i=fmod ($i); Imagefilledarc ($image, $yuanxin _x, $h, $tukuan, $tugao -20, $kaishi, $jieshu, $yanse [0][$yanse _i], Img_arc_pie), $kaishi + = $jiaodu [$i]; $jieshu + = $jiaodu [$i];} Set file header header (' Content-type:image/png ');//Output Image imagepng ($image);//Release Resource Imagedestroy ($image); >

How to use

Insert the following code where you want the image to appear

The text format of a is a string of several data concatenated by ",", get passed in.

Line Chart

Design ideas

It is a good choice to use a line chart to see the trend of a particular data in the unit time frame. We use PHP to implement a dynamic line chart.
It is designed with the following ideas:
1 accept the parameter, get all the values and the maximum value of the data to determine the maximum scale value of the longitudinal axis
2 Determine the width of the image according to the number of data, and draw the horizontal and vertical axis coordinates and scale
3 Draw straight lines to connect each point, fill a 2*2 rectangle for each point, position the highlight point
4 The data values for each point are labeled 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 image resource $image = Imagecreate ($img _kuan, $img _gao);//gray background $ White = Imagecolorallocate ($image, 0xEE, 0xEE, 0xEE);//The axes are shown in black $zuobiao_yanse = Imagecolorallocate ($image, 0x00, 0x00, 0x00);//The line is shown in blue $xian_yanse = Imagecolorallocate ($image, 0x00, 0x00, 0xFF);//Draw coordinates//horizontal axis imageline ($image, $zuo, $img _gao-$ Xia, $img _kuan-$you/2, $img _gao-$xia, $zuobiao _yanse);//Vertical Axis imageline ($image, $zuo, $shang/2, $zuo, $img _gao-$xia, $ Zuobiao_yanse);//Get coordinates for each point for ($i =0; $i
 
  Count ($shuju)) {Imageline ($image, $p _x[$i], $p _y[$i], $p _x[$i +1], $p _y[$i +1], $xian _yanse); Imagefilledrectangle ($ Image, $p _x[$i]-1, $p _y[$i]-1, $p _x[$i]+1, $p _y[$i]+1, $xian _yanse);}} The last loop did not draw the final point effect, there are additional imagefilledrectangle ($image, $p _x[count ($shuju) -1]-1, $p _y[count ($shuju) -1]-1, $p _x[ Count ($shuju) -1]+1, $p _y[count ($shuju) -1]+1, $xian _yanse);//Callout data value for ($i =0; $i
  
   
  
 

How to use

Insert the following code where you want the image to appear

Where A's value is calculated by yourself
The text format of a is a string of several data concatenated by ",", get passed in.

Since writing to the graphics in Chinese requires more PHP environment configuration, here is an HTML solution that is practical and flexible:
You just need to dynamically generate a table to place the horizontal axis scale name on the basis of the number of data, like this

 
  
   ". $i." Month ";}? > 
    

Bar Chart

Design ideas

Or do you want to first determine the scale value of the longitudinal axis and determine the maximum scale of the longitudinal axis?
Then the width of the image is determined based on the number of data obtained, then the image can be created.
Calculates the height of each color bar and calculates the fill range of the excellent column with height
To draw an axis with a line, mark the scale value
Fill the color column with a rectangle and label the data values above the color bars
Draw the required horizontal coordinate name in HTML

Implementation process

 $zuidashujuzhi) $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 column Color $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), Imagecolorallocate ($image, 0x66, 0xFF, 0x99));//Axis color $ Zuobiao_yanse = Imagecolorallocate ($image, 0x00, 0x00, 0x00);//Horizontal Imageline ($image, $zuo, $img _gao-$xia, $img _kuan-$you /2, $img _gao-$xia, $zuobiao _yanse);//longitudinal axis imageline ($image, $zuo, $shang/2, $zuo, $img _gao-$xia, $zuobiao _yanse);//Vertical Axis scale, A total of 4 points on the vertical axis, so I can be calculated separatelyMageline ($image, $zuo, $shang, $zuo +6, $shang, $zuobiao _yanse), Imagestring ($image, 3, $zuo/4, $shang, round ($zuidashuju Zhi), $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 + ($img _gao-$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 of each bar for ($i =0; $i
 
  
 

How to use

Insert the following code where you want the image to appear

Where A's value is calculated by yourself
The text format of a is a string of several data concatenated by ",", get passed in.

Also use an HTML solution that solves the problem with the horizontal scale name:
Dynamically generate a table to place the horizontal axis scale name on the basis of the number of data, like this

 
  
   ". $i." Month ";}? > 
    

