In the field of image processing, the drawing skills of transparent images are very important, especially when you need to implement complex polygonal graphics overlay effects. As a popular server-side programming language, PHP provides some built-in image processing functions. imageopenpolygon() is one of the functions that can be used to draw polygons. This article will introduce how to use the imageopenpolygon() function and how to combine transparent background to achieve transparent overlay effect of polygons.
In PHP, the imageopenpolygon() function is mainly used to draw a closed polygon. It takes an array of points and connects them with straight lines to form a polygon. However, by default, polygons drawn by PHP are not transparent. To achieve transparency, we need to use image formats that support transparency (such as PNG) and do some additional configuration.
First, we need to create an image that supports transparency. In PHP, you can create a true color canvas through the imagecreatetruecolor() function and set a transparent background. The code is as follows:
<?php
// Create a 500x500 Transparent background image
$image = imagecreatetruecolor(500, 500);
// Turn on transparent support
imagesavealpha($image, true);
$transparent = imagecolorallocatealpha($image, 0, 0, 0, 127); // 127 To be completely transparent
imagefill($image, 0, 0, $transparent);
// Output image
header('Content-Type: image/png');
imagepng($image);
imagedestroy($image);
?>
In the above code, imagecreatetruecolor() creates a 500x500 pixel canvas, imagesavealpha() enables transparent channels for the image, and sets transparent colors through imagecolorallocatealpha() .
Next, use the imageopenpolygon() function to draw a polygon on the created image. First, you need to define the vertex coordinates of the polygon and fill it with the appropriate color. To achieve transparent overlay, we will set a translucent color.
<?php
// Define the vertex coordinates of a polygon
$points = [
250, 100, // vertex1
350, 200, // vertex2
300, 300, // vertex3
200, 300, // vertex4
150, 200 // vertex5
];
// Create transparent colors
$polygonColor = imagecolorallocatealpha($image, 255, 0, 0, 64); // Translucent red
// Draw polygons
imagefilledpolygon($image, $points, 5, $polygonColor);
// Output image
imagepng($image);
imagedestroy($image);
?>
In the above code, imagefilledpolygon() is used to draw a solid polygon, while imagecolorallocatealpha() creates a translucent red with a transparency value of 64 , thus achieving the transparent overlay effect of the figure.
Suppose you have a background image and want to draw transparent polygons on it, we can use imagecreatefrommpng() or other image read function to load the background image and then draw it. Here is an example of loading the background image and drawing transparent polygons:
<?php
// Loading background image
$background = imagecreatefrompng('background.png');
// Get image size
$width = imagesx($background);
$height = imagesy($background);
// Create a透明画布并合并到背景图
$image = imagecreatetruecolor($width, $height);
imagesavealpha($image, true);
$transparent = imagecolorallocatealpha($image, 0, 0, 0, 127);
imagefill($image, 0, 0, $transparent);
// Merge background image onto new image
imagecopy($image, $background, 0, 0, 0, 0, $width, $height);
// 定义多边形vertex坐标
$points = [
100, 100,
200, 100,
200, 200,
100, 200
];
// 使用半透明的颜色Draw polygons
$polygonColor = imagecolorallocatealpha($image, 0, 255, 0, 64); // Translucent green
imagefilledpolygon($image, $points, 4, $polygonColor);
// Output the final image
header('Content-Type: image/png');
imagepng($image);
imagedestroy($image);
imagedestroy($background);
?>
In this code, we first load a PNG background image, create a new transparent image, and then copy the background image to the new image. Next, a transparent green polygon is drawn, superimposed on the background image.
With imageopenpolygon() and imagefilledpolygon() we can easily draw polygon figures. By using the transparency settings rationally and combining the transparent image technology in PHP, multiple overlay effects can be created. These tips provide a lot of flexibility and creative space for web developers when creating graphics, animations, and even user interfaces. I hope this article can help you master the techniques of transparent image drawing, making your image processing more vivid and interesting.
In this process, we used the URL-related image file path, but if we need to replace the domain name part in the path with m66.net , the following is the modified code example: