PHP drawing

xiaoxiao2021-03-06  59

I really don't dare to "tell" the GD library here, because I have only one or two in GD, the vast majority of the functions have not

There is access to it. But the three-way bamboo is warmly sent me, I have to write my own experience. hope to

Enough to the effect of throwing bricks.

In fact, we implement the effect of "Figure" in the web page is not necessarily with GD, it is easier to solve the column

Figure - You can solve it with HTML. such as:

</ title></p> <p><style></p> <p><! -</p> <p>TD {font-size: 9pt}</p> <p>-></p> <p></ style></p> <p></ hEAD></p> <p><body></p> <p><table border = 0></p> <p><tr Valign = "bottom"> / * (1) * /</p> <p><? for ($ I = 0; $ I <8; $ I ) {?> <td align = "center"></p> <p><table height = "<? echo $ b [$ I];?>" Border = 0> / * (2) * /</p> <p><tr></p> <p><TD BGCOLOR = "# 3f7f9f" width = "40"> </ td> / * (3) * /</p> <p></ TR></p> <p></ table> <br> <font color = "# 3f7f9f"> <? Echo $ b [$ I];?> </ font> / * (4) * /</p> <p></ td> <?}?></p> <p></ TR></p> <p></ TABLE></p> <p></ body></p> <p></ html></p> <p><? $ b = array (150, 110, 125, 180, 160, 175, 230, 220);?> Is a set of data, where is the data, is no</p> <p>If you turn off, you will look at your needs; I need to say two words in the code. I have added a comment, and now explain it.</p> <p>(1) It should be noted here that valign = "bottom" is to align the content of the cell's content. Why add in <TR></p> <p>? You can let the contents of this line in the form, you don't have to specify in each <TD>, so</p> <p>To save dozens of bytes to the original code of the HTML page of the PHP execution result! Saving the valuable time of the viewer.</p> <p>(2) Note that the most critical thing is here! <table height = "xxx">, we use the Table's Height property.</p> <p>Realize the "column" of different heights. I will see you clearly, the original data has not been scaled.</p> <p>If your data is particularly large, or it is particularly small, it is not appropriate to directly assign it directly to the height property, but should</p> <p>The status is scaled according to the appropriate proportion. For example, you estimate that every number of this data will be between 3000 and 8000,</p> <p>It can be considered to shrink them 25 times, ie Height = "<? Echo floor (b [$ I] / 25);?>" (3) Let's take the bgcolor = "# xxxxxx" in this line, this is the column Color (RGB). In fact, the real histogram should be</p> <p>Every column is used in a color, here is simple as possible, I use this for loop, so there is no way to give</p> <p>Each cylinder specifies a color. - In fact, there is also a way. I just don't have to write again for this example.</p> <p>A function of extracting color is dizzy. So, that part is perfect by yourself.</p> <p>(4) Display real data herein with the same color as the column. Of course, you can also choose to put this figure on the top of the column.</p> <p>On, it may be more professional. However, I am still accustomed to putting it below.</p> <p>With HTML Table, we can construct various histograms, this example is to use BGColor to display the color block.</p> <p>In addition, it is also possible to use a background = "(picture)", the picture is a pattern, so the column of the histogram has a pattern.</p> <p>And you put the real data with a large color, the <TD> shown in the <TD> shown above (3), is also a good effect.</p> <p>The front is an effective way to avoid GD, but to do a complex graphic, it is not available in GD.</p> <p>Sadly's PHP4 Chinese manual, saying 44 functions in the GD function library, but I look at the latest version of the English php4 manual,</p> <p>There are more than 80 functions of GD! Because the author is relatively poor, read English manuals can only cover it, so it cannot be sure</p> <p>Does the new GD library re-support GIF? Anyway, I think that since we are using a completely free PHP, why</p> <p>"Adventure" to use the copyright-owned GIF? Why not free, use PNG? As long as you don't need to use animation, PNG can also make</p> <p>As small as a GIF!</p> <p>Below I will combine a program, a code, a code, talk about commonly used GD functions.</p> <p>Start from the beginning.</p> <p><?</p> <p>Header ("Content-Type: Image / PNG");</p> <p>// This is to send an HTTP header, telling the browser: "You listen, this is an image, you can make a text to show it!"</p> <p>// Due to my personal preferences, I used PNG, of course, you can also use Header ("Content-Type: Image / GIF");</p> <p>// or Header ("Content-Type: Image / JPEG");</p> <p>$ IM = ImageCreate (50, 100);</p> <p>// Create an image. Note that the image is not specified in the image format when it is created.</p> <p>// ImageCreate function, two parameters, no doubt, this is the width and height of the created image.</p> <p>// The return value is an int value, this value is quite important, you continue to draw this image,</p> <p>// until you output this image, there is nowhere to this value, we call the ID of the image.</p> <p>// Because the frequency used is quite high, we assign it to a variable that is relatively short.</p> <p>// Now let's draw a line first. The function of the line is like this:</p> <p>// imageline (int ign, int x1, int y1, int x2, int y2, int co);</p> <p>/ / The first parameter IM is the ID of the image, the back X1, Y1, X2, Y2, no need to say, // is the coordinates of the starting point (X1, Y1) endpoint (x2, y2)! (The upper left corner coordinate of the image is (0,0))</p> <p>// What is the last parameter? Is color! GD requires a color to define colors for image, and is made with these colors.</p> <p>// Why define color to image? I guess, for the "palette" for images such as GIF, PNG.</p> <p>// This involves the knowledge of the image itself, and will not be described here.</p> <p>// Therefore, before the line, we must first define the color (really trouble).</p> <p>// $ colalocate ($ IM, 255, 192, 192);</p> <p>// This function is four parameters, the first $ IM ... still used to say every time? Don't say it next time!</p> <p>// The three parameters later are the red (R), green (G), blue (B) of the color to be defined, between 0 and 255.</p> <p>// This is also involved in physical - optical knowledge. Red, green, blue three original color of the original color,</p> <p>// produce a thousand variable colors. This color, red 255, green 192, blue 192, blue 192.</p> <p>// If you don't make a mistake, this is a brighter red. Waiting for a while, let's draw a line to try.</p> <p>// Why wait for a while? Because a picture has only one color, what can't be seen!</p> <p>// We make the background to black first!</p> <p>// Although there is no clear expression on the manual, I found the first color to be default the background.</p> <p>$ colorAllocate ($ IM, 0, 0, 0);</p> <p>// Define a color, red, green, and blue, natural black, black.</p> <p>/ / Then define the color of the drawer:</p> <p>$ colorAllocate ($ IM, 255, 192, 192);</p> <p>/ / Can now start drawing the red line:</p> <p>Imageline ($ IM, 10, 20, 45, 85, $ col_red);</p> <p>// Don't worry, you can't see the image after this sentence.</p> <p>ImagePNG ($ IM);</p> <p>// This sentence outputs an image, imagepng () outputs a PNG image, imagejpeg outputs a JPEG image,</p> <p>// ImageGIF output GIF image ...</p> <p>/ / Don't forget that there is a parameter, if you are displayed on the screen, not saved as a file,</p> <p>// omit this parameter - the file name saved. If you want to save it as a file,</p> <p>// should write this: imagePng ($ IM, "Test.png");</p> <p>// If you don't specify a path, this file is saved in your web current directory.</p> <p>// If it is JPEG, then one more parameters is JPEG mass (0 ~ 100).</p> <p>// If you want to display on the screen, imagejpeg ($ IM, ", 80);</p> <p>// If you want to save, ImageJpeg ($ IM, "Test.jpg", 80);</p> <p>// Note, if you want to save this image as a file,</p> <p>// You can't use Header ("Content-Type: Image / PNG"); transfer means the HTTP header of the image,</p> <p>// Because of this, you will indicate that you will output an image.</p> <p>ImageDestroy ($ IM);</p> <p>// Destroy the image in the memory to release memory space.</p> <p>// This is fine: a picture of the simplest GD work. // By testing, this image file is generated, only 131 bytes in PNG format,</p> <p>// and use JPEG format, even with the worst quality (0), it takes 855 bytes, and the image quality is bad.</p> <p>// The highest JPEG quality requires 2360 bytes, but the color is still not as bright as PNG.</p> <p>// This shows that the image of such a number of colors is much more cost-effective than JPEG than JPEG.</p> <p>?></p> <p>This time, I will say this, I will strive to continue writing as soon as possible.</p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-84909.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="84909" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.033</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = 'pL86JdHw7LGx4JhGtLm1gVsVra_2BMqPl3F55UdboHxA1_2BhBCHUw6r1_2Bse0S14kSiqXpbv0BrHMUSdTdLRmCKkrQ_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>