Commit c1490399 authored by Safaa Alnabulsi's avatar Safaa Alnabulsi
Browse files

Add eq7 to the docs

parent 599bdd2d
......@@ -11,6 +11,12 @@
<script type="text/javascript" async
src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML"></script>
<!--<link rel="stylesheet" href="styles/main.37ab405b.css">-->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.0.3/styles/default.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.0.3/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<body>
<!--[if lt IE 7]>
<p class="browsehappy">You are using an
......@@ -30,7 +36,10 @@
<a class="navbar-link" href="#problem">Other Smoothing Methods</a>
</li>
<li class="navbar-item">
<a class="navbar-link" href="#ILS">This Paper</a>
<a class="navbar-link" href="#ILS">This Paper (ILS)</a>
</li>
<li class="navbar-item">
<a class="navbar-link" href="#results-ILS">Results of ILS</a>
</li>
<li class="navbar-item">
<a class="navbar-link" href="#code">Code</a>
......@@ -58,10 +67,12 @@
Smoothing is a technique in Image processing which is used to reduce noise in Images or to produce a
less pixelated image.
It's an essetinal key which enhances images used in several domains and applications. There are several
methods and algorithms in the literature which performs smoothing on images e.g. weighted average based
methods and algorithms in the literature which perform smoothing on images e.g. weighted average based
methods, pyramid based methods, deep learning based methods ..etc
<br>
There is a tradeoff between the smoothing quality and the processing speed: the high smoothing quality
usually requires a high computational cost which leads to the low processing speed.
<br>
In this paper, we will see a new global optimization based method, named iterative least squares (ILS),
for efficient edge-preserving image smoothing with much lower computational cost.
</p>
......@@ -71,23 +82,34 @@
<div class="docs-section" id="problem">
<h3 class="section-heading">Weighted Average Based Smoothing Methods</h3>
<p class="section-description">
Before digging into this paper's enhancements, let's take a look on the results of other smoothing methods
which are used in Opencv
You will see from the following results the poor quality of smoothing methods performed by weighted average
based methods.
based methods. <a href="#ref-1">[2]</a>
</p>
<div class="row">
<div class="column category" style="text-align: center;">
<h5 class="docs-header">Original Image</h5>
<img class="u-half-width" src="images/original-flower.png">
<p>
</p>
</div>
</div>
<div class="row">
<div class="column category" style="text-align: center;">
<h5 class="docs-header">Results of weighted average based methods</h5>
<img class="u-max-full-width" src="images/all-methods.png">
<img class="u-max-full-width" src="images/opencv-filters.png">
<p>
</p>
</div>
</div>
<h5> How much noise is reduced? </h5>
<p class="section-description">
After taking a look into the reduced noise results performed by each of the filters above, one will notice
that most of the important features of the image are subtracted.
......@@ -101,40 +123,34 @@
<div class="one-third column category" style="text-align: center;">
<h5 class="docs-header">Averaging - 2D Convolution</h5>
<img class="u-max-full-width" src="images/averaging.png">
<p>An empty image.</p>
</div>
<div class="one-third column category" style="text-align: center;">
<h5 class="docs-header">Averaging - Blur</h5>
<img class="u-max-full-width" src="images/blur.png">
<p>An second empty image.</p>
</div>
<div class="one-third column category" style="text-align: center;">
<h5 class="docs-header">Gaussian Filtering</h5>
<img class="u-max-full-width" src="images/gblur.png">
<p>A super empty image.</p>
</div>
<div class="one-third column category" style="text-align: center;">
<h5 class="docs-header">Median Filtering</h5>
<img class="u-max-full-width" src="images/median.png">
<p>An empty image.</p>
</div>
<div class="one-third column category" style="text-align: center;">
<h5 class="docs-header">Bilateral Filtering</h5>
<img class="u-max-full-width" src="images/bilateral.png">
<p>An second empty image.</p>
</div>
</div>
</br>
<h5> Execution Time </h5>
<div class="row">
<div class="column category" style="text-align: center;">
<h5 class="docs-header">Execution Time</h5>
<table class="u-full-width">
<thead>
<tr>
......@@ -170,13 +186,12 @@
</table>
</div>
</div>
</div>
<div class="docs-section" id="ILS">
<h5>Real-time Image Smoothing via Iterative Least Squares</h5>
<h3 class="section-heading">Real-time Image Smoothing via Iterative Least Squares</h3>
<div class="u-pull-right" style="text-align: center; width:300px; margin-left:20px">
<img class="u-max-full-width" src="images/original-paper.png">
......@@ -190,7 +205,7 @@
This paper propses a new edge-preserving smoothing method which smoothes out small details in images and
preserves the major edges and structures.
Among these approaches, two kinds of methods have been widely developed: weighted average based methods and
global optimization based methods. </p>
global optimization based methods. <a href="#ref-1">[1]</a></p>
<p>
<div class="row">
<div class="one-half column category">
......@@ -209,6 +224,19 @@
</p>
<div class="row">
<h3 class="section-heading" id="results-ILS">Results of ILS</h3>
<p class="section-description">After programming the proposed method in the paper and trying different ways,
it was clear that it works really well in preserving edges compared to all upper smoothing methods.
</br>
You can see below the results of applying Single CPU vs. Parallel CPU using Numpy and Scipy.
The image to the right shows the noise reduced by using ILS.
It is the result of subtraction the smoothed image from the original one.
By simply looking at them, one cannot really find a difference,
however, if you go down to <a href="#exec-time-ils">ILS execution time section</a> you will notice the
difference.
</p>
<div class="column category" style="text-align: center;">
<h5 class="docs-header">ILS Single CPU</h5>
<img class="u-max-full-width" src="images/ils-cpu-single.png">
......@@ -217,7 +245,6 @@
<h5 class="docs-header">ILS Parallel CPU with Numpy</h5>
<img class="u-max-full-width" src="images/ils-numpy.png">
</div>
<div class="column category" style="text-align: center;">
<h5 class="docs-header">ILS Parallel CPU with Scipy</h5>
<img class="u-max-full-width" src="images/ils-scipy.png">
......@@ -225,12 +252,15 @@
</div>
<h5> Execution Time </h5>
<p>It is clear from the results below that the time of parallel execution is ### less than one single CPU.
Regarding the parallel cpu, I also compared the performance of two libraries: numpy and scipy.
Scipy outperformed Numpy with ###.
<h5> ILS Execution Time </h5>
<p>It is clear from the results below that the time of parallel execution is faster than one single CPU.
I used two differenlt libraries in parallel cpu: numpy and scipy.
</br>
The methods in parallel CPU were faster than the one single cpu.
They decreased the execution time %31 when using numpy and %34 when using scipy.
Scipy outperformed Numpy with around 3%.
</p>
<div class="row">
<div class="row" id="exec-time-ils">
<div class="column category" style="text-align: center;">
<table class="u-full-width">
<thead>
......@@ -264,11 +294,27 @@
<div class="docs-section" id="code">
<h3 class="section-heading">Code</h3>
<p class="section-description">At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd
gubergren, no sea takimata ita sanctus est Lorem ipsum dolor sit amet.</p>
<pre>
<p class="section-description">
To prgoram the proposed method in the paper, I used Python along with the following libraries:
<ul>
<li>matplotlib: to plot the results of smoothed images</li>
<li>pillow: a library used in image processing.</li>
<li>timeit: to measure the execution time of each method and compare it with each other</li>
<li>cv2: OpenCV library; I used it to compare ILS to other smoothing methods in the literature</li>
<li>pyfftw: a pythonic wrapper around FFTW. I used it in multithreaded mode with FFT/IFFT.</li>
<li>scipy: I used it to try out the multi-threaded FFT/IFFT.</li>
<li>numpy: I used it to try out the single-cpu FFT/IFFT. I also used it to handle the arrays and matrices
operations of an image.
</li>
</ul>
<pre>
<h3 class="docs-header">Fast Fourier transform</h3>
In the following block of code, you will see a function for fft and ifft.
The functions take a parameter called "interface";
which allows to calculate fft and ifft in three different ways.
<code class="python">
<code>
def _fft(img, interface='single'):
if interface == 'single':
out = np.fft.fft2(img,axes=(0,1))
......@@ -287,7 +333,13 @@ def _ifft(img, interface='single'):
out = pyfftw.interfaces.scipy_fftpack.ifft2(img,axes=(0,1)).real
return out
</code>
<code>
<h3 class="docs-header">PSF and OTF </h3>
- Point spread function (PSF) is impulse response describes the response of an imaging system
to a point source or point object.
- Optical transfer function (OTF) is defined as the Fourier transform of the point spread function.
<code class="python">
def psf2otf_Dx(outSize, interface):
psf = np.zeros(outSize)
psf = psf.astype('float32')
......@@ -305,7 +357,14 @@ def psf2otf_Dy(outSize, interface):
return otf
</code>
<code>
<h3 class="docs-header">ILS Norm</h3>
In the code block, you will see the implementation of the ILS method propsed in this paper.
It could be mainly split into three sections:
- pre-compute:
- calculate intermediate variables \mu update, in x-axis and y-axis direction
- update the smoothed image U
<code class="python">
def ILS_Norm(F,c,lam, interface='single'):
N, M, D = F.shape # (768, 1024, 3)
......@@ -369,7 +428,9 @@ def ILS_Norm(F,c,lam, interface='single'):
</code>
<code>
The previous method is applied with the following intial values:
<code class="python">
# Constants
lam = 1
k = 5
......@@ -379,8 +440,9 @@ gamma = 0.5 * p - 1
c = p * eps**gamma
F = read_image('flower.png')
</code>
Finally, the method is called for single-cpu as following:
<code>
<code class="python">
start = timer()
smoothed1 = ILS_Norm(F,c,lam,interface='single')
print("ILS_Norm CPU Single:", timer()-start)
......@@ -388,29 +450,24 @@ print("ILS_Norm CPU Single:", timer()-start)
show_image(F, smoothed1,t='Smoothed Image Single CPU')
</code>
<code>
And it is called for parallel-cpu (numpy) as following:
<code class="python">
start = timer()
smoothed2 = ILS_Norm(F,c,lam, interface='parallel_numpy')
print("ILS_Norm CPU Parallel Numpy:", timer()-start)
show_image(F, smoothed2,t='Smoothed Image Parallel Numpy')
</code>
And it is called for parallel-cpu (scipy) as following:
<code>
<code class="python">
start = timer()
smoothed3 = ILS_Norm(F,c,lam,interface='parallel_scipy')
print("ILS_Norm CPU Parallel Scipy:", timer()-start)
show_image(F, smoothed3,t='Smoothed Image Parallel Scipy')
</code>
</pre>
<p>
Inline code snippets <code>are also possible</code> as this beautiful <code>super code i++; 0x34</code>
shows.
</p>
</div>
<div class="docs-section" id="math">
......@@ -420,6 +477,9 @@ show_image(F, smoothed3,t='Smoothed Image Parallel Scipy')
<img class="u-max-full-width" src="images/objective-function.png">
<h4 class="docs-header">ILS problem</h4>
<p>The first equation; eq-7 which calculates the intermediate variables</p>
<img class="u-max-full-width" src="images/eq7.png">
<p>The second equation, eq-9 which calculates the ILS problem</p>
<img class="u-max-full-width" src="images/ILS-problem.png">
</div>
......@@ -427,14 +487,14 @@ show_image(F, smoothed3,t='Smoothed Image Parallel Scipy')
<div class="docs-section" id="references">
<h3 class="section-heading">References</h3>
<ul class="popover-list">
<li class="popover-item" id="1">
<li class="popover-item" id="ref-1">
<!--A link to this may look like: <a href="#1">[1]</a>-->
[1] Wei Liu and Pingping Zhang and Xiaolin Huang and Jie Yang and Chunhua Shen and Ian Reid, Real-time
Image Smoothing via Iterative Least Squares, <i> presented at SIGGRAPH 2020,
2020</i>.
</li>
<li class="popover-item" id="2">
<li class="popover-item" id="ref-2">
[2] <a
href="https://opencv24-python-tutorials.readthedocs.io/en/stable/py_tutorials/py_imgproc/py_filtering/py_filtering.html">Smoothing
Images in OpenCV</a>
......@@ -443,3 +503,5 @@ show_image(F, smoothed3,t='Smoothed Image Parallel Scipy')
</div>
</div>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment