如何动态生成带有 alpha 渐变的图像?
我正在寻找一种方法来动态创建具有羽化边缘的椭圆(并且能够控制羽化程度)。理想情况下,这可以通过 Javascript 来实现,因为预期用途是在可以离线使用的应用程序中,但为了简单起见,我对 PHP 解决方案感到满意。
我确实尝试过使用 GD 的解决方案,但是我发现它在处理 alpha 时非常有限。主要问题是使用填充椭圆和分层会抵消透明效果,并且仅使用逐渐变小的椭圆绘制边框会导致椭圆无法完美对齐的问题(见下图)。
有没有一种解决方案可以消除这些问题,而又不会变得太复杂?我知道我可以逐像素创建图像,但这似乎是一个非常复杂的方法,而这应该是一个相对简单的任务。
I'm looking for a way to dynamically create an ellipse with a feathered edge (and be able to control the degree of the feathering). Ideally, this would be achieved through Javascript, as the intended use is in an app which may be made to be available offline, but for simplicity, I'd be happy with a PHP solution in the meantime.
I did attempt a solution using GD, however I found it quite limited when dealing with alpha. The main issues were that using a filled ellipse and layering would cancel out the transparency effect, and that just drawing the border with progressively smaller ellipses caused problems where the ellipses did not perfectly line up (see image below).
Is there a solution I can use that eliminates these issues, without getting too complex? I'm aware I could create an image pixel by pixel, but that seems like a very complex method for what should be a relatively easy task.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
下面是一个使用标签的示例,看起来它可能会让您走上正确的道路:
http://nixtu.blogspot.com/2010/07/html5-canvas-gradients-radial-gradient.html
这是一个小提琴,显示了我认为您可能正在寻找的内容:
< a href="http://jsfiddle.net/hgZt7/2/" rel="nofollow">http://jsfiddle.net/hgZt7/2/
Here's an example using the tag that looks like it might start you on the right path:
http://nixtu.blogspot.com/2010/07/html5-canvas-gradients-radial-gradient.html
And here's a fiddle that shows what I THINK you might be looking for:
http://jsfiddle.net/hgZt7/2/
ImageMagick 是完成任务的最简单方法。完整的函数列表是: https://www.php.net/manual/ en/book.imagick.php
用于创建 Alpha 通道: https://www.php.net/manual/en/function.imagick-getimagealphachannel.php
ImageMagick is the easiest way to complite your task. Full list of functions is: https://www.php.net/manual/en/book.imagick.php
For creating alpha channel: https://www.php.net/manual/en/function.imagick-getimagealphachannel.php