Algorithm to blend gradient filled corners in image

I need to put an alpha blended gradient border around an image. My problem is in blending the corners so they are smooth where the horizontal and vertical gradients meet. I believe there is a standard algorithm that solves this problem. I think I even encountered it in school many years ago. But I have been unsuccessful in finding any reference to one in several web searches.

(I have implemented a radial fill pattern in the corner, but the transition is still not smooth enough.)

My questions:

  1. If there is a standard algorithm for this problem, what is the name of it, and even better, how is it implemented?

  2. Forgoing any standard algorithm, what's the best way to determine the desired pixel value to produce a smooth gradient in the corners? (Make a smooth transition from the vertical gradient to the horizontal gradient.)

EDIT: So imagine I have an image I will insert on top of a larger image. The larger image is solid black and the smaller image is solid white. Before I insert it, I want to blend the smaller image into the larger one by setting the alpha value on the smaller image to create a transparent "border" around it so it "fades" into the larger image. Done correctly, I should have a smooth gradient from black to white, and I do everywhere except the corners and the inside edge.

At the edge of the gradient border near the center of the image, the value would be 255 (not transparent). As the border approaches the outside edge, the alpha value approaches 0. In the corners of the image where the vert & horiz borders meet, you end up with what amounts to a diagonal line. I want to eliminate that line and have a smooth transition.

What I need is an algorithm that determines the alpha value (0 - 255) for each pixel that overlaps in the corner of an image as the horizontal and vertical edges meet.

Answers


Presumably you're multiplying the two gradients where they overlap, right?

Dunno about a standard algorithm. But if you use a signoid shaped gradient instead of a linear one, that should eliminate the visible edge where the two overlap.

A simple sigmoid function is smoothstep(t) = t*t*(3 - 2*t) where 0 <= t <= 1


Need Your Help

How to enable special keys (ctrl-c, ctrl-v, tab, delete) Windows.Form.WebBrowser Control

c# .net webbrowser-control

I have a Window.Form that has a WebBrowser control on it. How do you enable the control to process special keys like the Tab key for navigating between controls?

How to structure database calls in a page?

php mysql database-design web-applications

Ok so i am new to making complex database structure into the page. I have a basic people table with a few categories. Students, teachers, parents and mods. There are again tables one for parents,