Databases
StackOverflow2013
Postsdbo
POHow to create an edge preserving blur (similar to a bilateral filter) using a limited set of primitive operations
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to create an edge preserving blur (similar to a bilateral filter) using a limited set of primitive operations
    primarykey
    data
    text
    <p>I have been attempting to duplicate a bilateral filter effect (edge preserving, color-range aware) using the limited set of primitives in the existing toolbox of SVG filters. I've tried a number of approaches. My most successful to date is a three part operation that does Sobel edge detection, dilates the Sobel edges, extracts the pixels corresponding to those edges with a compositing operation, gaussian blurs the source image and then composites back the original edge pixels on top of the blurred image. The result preserves edges, but is not color-range aware.</p> <pre><code>&lt;filter id="surfaceBlur" color-interpolation-filters="sRGB"&gt; &lt;!-- convert source image to luminance map--&gt; &lt;feColorMatrix type="luminanceToAlpha" /&gt; &lt;!-- sober edge detection--&gt; &lt;feConvolveMatrix order="3" kernelMatrix="-1 -2 -1 0 0 0 1 2 1 " preserveAlpha="true" /&gt; &lt;feConvolveMatrix order="3" kernelMatrix="-1 0 1 -2 0 2 -1 0 1 " preserveAlpha="true" /&gt; &lt;!-- dilate the edges to produce a wider mask--&gt; &lt;feMorphology operator="dilate" radius="1" result="mask"/&gt; &lt;!-- extract just the detail from the source graphic using the dilated edges --&gt; &lt;feComposite operator="in" in="SourceGraphic" in2="mask" result="detail" /&gt; &lt;!-- blur the source image --&gt; &lt;feGaussianBlur stdDeviation="3" in="SourceGraphic" result="backblur"/&gt; &lt;!-- slap the detail back on top of the blur! --&gt; &lt;feComposite operator="over" in="detail" in2="backblur"/&gt; </code></pre> <p>You can see the original, a gaussianBlur, this filter and in the bottom right, a true bilateral filter:</p> <p><a href="http://codepen.io/mullany/details/Dbyxt" rel="nofollow">http://codepen.io/mullany/details/Dbyxt</a></p> <p>As you can see, it's not an awful result, but it's not very close to a bilateral filter. This method also only works with greyscale images because it uses luminance differences to find edges - so edges between colors of similar luminance are not detected.</p> <p>So the question is whether there is a algorithm variant of an edge preserving color range aware filter (guided edge view, bilateral etc.) - that can be constructed using the limited primitives available in SVG - which for those not familiar with SVG are:</p> <ul> <li>gaussian blur</li> <li>convolution (any kernel size)</li> <li>erode/dilate</li> <li>color matrix</li> <li>all porter duff compositing operations</li> <li>basic blending ops (multiply, screen, lighten, darken)</li> <li>a component transfer primitive that allows color channels to be transformed with a table lookup (as well as floored/ceilinged to specific values)</li> </ul> <p>Only the RGB color space is available. Multiple iterations are fine, and any directed graph of these operations can be constructed.</p> <p>Update:</p> <p>I successfully created a median filter using feBlend lighten and darken as Max and Min operators in a bubble sort (thanks to help from cs.stackexchange.com). However this is inefficient: <a href="http://codepen.io/mullany/pen/dmbvz" rel="nofollow">http://codepen.io/mullany/pen/dmbvz</a>, and lacks the color range awareness of a bilateral filter.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USMichael Mullany
    1. USMichael Mullany
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHow to create an edge preserving blur (similar to a bilateral filter) using a limited set of primitive operations
      1. USMichael Mullany
      1. VTBountyStart
    2. VO
      singulars
      1. POHow to create an edge preserving blur (similar to a bilateral filter) using a limited set of primitive operations
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POHow to create an edge preserving blur (similar to a bilateral filter) using a limited set of primitive operations
      1. This table or related slice is empty.
      1. VTUpMod
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload