Thanks to visit codestin.com
Credit goes to github.com

Skip to content

fix zooming on interactive facial overlays example #1161

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
62 changes: 34 additions & 28 deletions _posts/python/style/images/2015-06-30-images.html
Original file line number Diff line number Diff line change
Expand Up @@ -346,7 +346,7 @@ <h4 id="Zoom-on-Static-Images">Zoom on Static Images<a class="anchor-link" href=
<span class="n">yaxis</span> <span class="o">=</span> <span class="n">go</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">YAxis</span><span class="p">(</span>
<span class="n">visible</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="nb">range</span> <span class="o">=</span> <span class="p">[</span><span class="mi">0</span><span class="p">,</span> <span class="n">img_height</span><span class="o">*</span><span class="n">scale_factor</span><span class="p">],</span>
<span class="c1"># the scaleanchor attribute ensures that the aspect ratio stays constant</span>
<span class="c1"># the scaleanchor attribute ensures that the aspect ratio stays constant</span>
<span class="n">scaleanchor</span> <span class="o">=</span> <span class="s1">&#39;x&#39;</span><span class="p">),</span>
<span class="n">width</span> <span class="o">=</span> <span class="n">img_width</span><span class="o">*</span><span class="n">scale_factor</span><span class="p">,</span>
<span class="n">height</span> <span class="o">=</span> <span class="n">img_height</span><span class="o">*</span><span class="n">scale_factor</span><span class="p">,</span>
Expand Down Expand Up @@ -387,7 +387,7 @@ <h4 id="Zoom-on-Static-Images">Zoom on Static Images<a class="anchor-link" href=


<div class="output_html rendered_html output_subarea output_execute_result">
<iframe id="igraph" scrolling="no" style="border:none;" seamless="seamless" src="https://plot.ly/~michaelbabyn/184.embed" height="450.0px" width="800.0px"></iframe>
<iframe id="igraph" scrolling="no" style="border:none;" seamless="seamless" src="https://plot.ly/~PythonPlotBot/2841.embed" height="450.0px" width="800.0px"></iframe>
</div>

</div>
Expand Down Expand Up @@ -427,6 +427,7 @@ <h4 id="Interactive-Facial-Recognition-Overlays">Interactive Facial Recognition
<span class="kn">import</span> <span class="nn">numpy</span> <span class="k">as</span> <span class="nn">np</span>
<span class="kn">import</span> <span class="nn">dlib</span>


<span class="c1">#load dlib&#39;s pretrained face detector</span>
<span class="n">cnn_human_detector</span> <span class="o">=</span> <span class="n">dlib</span><span class="o">.</span><span class="n">cnn_face_detection_model_v1</span><span class="p">(</span><span class="s1">&#39;mmod_human_face_detector.dat&#39;</span><span class="p">)</span>

Expand All @@ -442,31 +443,36 @@ <h4 id="Interactive-Facial-Recognition-Overlays">Interactive Facial Recognition
<span class="n">dog_dets</span> <span class="o">=</span> <span class="n">cnn_dog_detector</span><span class="p">(</span><span class="n">img</span><span class="p">,</span> <span class="mi">1</span><span class="p">)</span>

<span class="n">layout</span><span class="o">=</span> <span class="n">go</span><span class="o">.</span><span class="n">Layout</span><span class="p">(</span>
<span class="n">xaxis</span> <span class="o">=</span> <span class="n">go</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">XAxis</span><span class="p">(</span><span class="n">showticklabels</span> <span class="o">=</span> <span class="kc">False</span><span class="p">,</span>
<span class="n">showgrid</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="n">zeroline</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="nb">range</span> <span class="o">=</span> <span class="p">[</span><span class="mi">0</span><span class="p">,</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">1</span><span class="p">]]</span>
<span class="p">),</span>
<span class="n">yaxis</span> <span class="o">=</span> <span class="n">go</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">YAxis</span><span class="p">(</span><span class="n">showticklabels</span> <span class="o">=</span> <span class="kc">False</span><span class="p">,</span>
<span class="n">showgrid</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="n">zeroline</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="nb">range</span> <span class="o">=</span> <span class="p">[</span><span class="mi">0</span><span class="p">,</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</span><span class="p">]]</span>
<span class="p">),</span>
<span class="n">autosize</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="n">height</span><span class="o">=</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span>
<span class="n">width</span><span class="o">=</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span>
<span class="n">images</span><span class="o">=</span> <span class="p">[</span><span class="nb">dict</span><span class="p">(</span>
<span class="n">source</span><span class="o">=</span> <span class="s2">&quot;https://raw.githubusercontent.com/michaelbabyn/plot_data/master/beethoven.jpg&quot;</span><span class="p">,</span>
<span class="n">xref</span><span class="o">=</span> <span class="s2">&quot;paper&quot;</span><span class="p">,</span>
<span class="n">yref</span><span class="o">=</span> <span class="s2">&quot;paper&quot;</span><span class="p">,</span>
<span class="n">x</span><span class="o">=</span> <span class="mi">0</span><span class="p">,</span>
<span class="n">y</span><span class="o">=</span> <span class="mi">1</span><span class="p">,</span>
<span class="n">sizex</span><span class="o">=</span> <span class="mi">1</span><span class="p">,</span>
<span class="n">sizey</span><span class="o">=</span> <span class="mi">1</span><span class="p">,</span>
<span class="n">sizing</span><span class="o">=</span> <span class="s2">&quot;stretch&quot;</span><span class="p">,</span>
<span class="n">opacity</span><span class="o">=</span> <span class="mi">1</span><span class="p">,</span>
<span class="n">layer</span><span class="o">=</span> <span class="s2">&quot;below&quot;</span><span class="p">)]</span>
<span class="p">)</span>
<span class="n">xaxis</span> <span class="o">=</span> <span class="n">go</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">XAxis</span><span class="p">(</span>
<span class="n">showticklabels</span> <span class="o">=</span> <span class="kc">False</span><span class="p">,</span>
<span class="n">showgrid</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="n">zeroline</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="nb">range</span> <span class="o">=</span> <span class="p">[</span><span class="mi">0</span><span class="p">,</span> <span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">1</span><span class="p">]]</span>
<span class="p">),</span>
<span class="n">yaxis</span> <span class="o">=</span> <span class="n">go</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">YAxis</span><span class="p">(</span>
<span class="n">showticklabels</span> <span class="o">=</span> <span class="kc">False</span><span class="p">,</span>
<span class="n">showgrid</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="n">zeroline</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="nb">range</span> <span class="o">=</span> <span class="p">[</span><span class="mi">0</span><span class="p">,</span> <span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</span><span class="p">]],</span>
<span class="n">scaleanchor</span> <span class="o">=</span> <span class="s1">&#39;x&#39;</span>
<span class="p">),</span>
<span class="n">autosize</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
<span class="n">height</span><span class="o">=</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span>
<span class="n">width</span><span class="o">=</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span>
<span class="n">margin</span> <span class="o">=</span> <span class="p">{</span><span class="s1">&#39;l&#39;</span><span class="p">:</span> <span class="mi">0</span><span class="p">,</span> <span class="s1">&#39;r&#39;</span><span class="p">:</span> <span class="mi">0</span><span class="p">,</span> <span class="s1">&#39;t&#39;</span><span class="p">:</span> <span class="mi">0</span><span class="p">,</span> <span class="s1">&#39;b&#39;</span><span class="p">:</span> <span class="mi">0</span><span class="p">},</span>
<span class="n">images</span><span class="o">=</span> <span class="p">[</span><span class="nb">dict</span><span class="p">(</span>
<span class="n">source</span><span class="o">=</span> <span class="s2">&quot;https://raw.githubusercontent.com/michaelbabyn/plot_data/master/beethoven.jpg&quot;</span><span class="p">,</span>
<span class="n">x</span><span class="o">=</span><span class="mi">0</span><span class="p">,</span>
<span class="n">sizex</span><span class="o">=</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span>
<span class="n">y</span><span class="o">=</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span>
<span class="n">sizey</span><span class="o">=</span><span class="n">img</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span>
<span class="n">xref</span><span class="o">=</span><span class="s2">&quot;x&quot;</span><span class="p">,</span>
<span class="n">yref</span><span class="o">=</span><span class="s2">&quot;y&quot;</span><span class="p">,</span>
<span class="n">opacity</span><span class="o">=</span><span class="mf">1.0</span><span class="p">,</span>
<span class="n">layer</span><span class="o">=</span><span class="s2">&quot;below&quot;</span><span class="p">,</span>
<span class="n">sizing</span><span class="o">=</span><span class="s2">&quot;stretch&quot;</span>
<span class="p">)]</span>
<span class="p">)</span>

<span class="n">humans</span><span class="o">=</span><span class="p">[</span>
<span class="n">go</span><span class="o">.</span><span class="n">Scatter</span><span class="p">(</span>
Expand Down Expand Up @@ -512,7 +518,7 @@ <h4 id="Interactive-Facial-Recognition-Overlays">Interactive Facial Recognition


<div class="output_html rendered_html output_subarea output_execute_result">
<iframe id="igraph" scrolling="no" style="border:none;" seamless="seamless" src="https://plot.ly/~michaelbabyn/152.embed" height="388px" width="561px"></iframe>
<iframe id="igraph" scrolling="no" style="border:none;" seamless="seamless" src="https://plot.ly/~PythonPlotBot/2843.embed" height="388px" width="561px"></iframe>
</div>

</div>
Expand Down
62 changes: 34 additions & 28 deletions _posts/python/style/images/images.ipynb
Original file line number Diff line number Diff line change
Expand Up @@ -288,7 +288,7 @@
{
"data": {
"text/html": [
"<iframe id=\"igraph\" scrolling=\"no\" style=\"border:none;\" seamless=\"seamless\" src=\"https://plot.ly/~michaelbabyn/184.embed\" height=\"450.0px\" width=\"800.0px\"></iframe>"
"<iframe id=\"igraph\" scrolling=\"no\" style=\"border:none;\" seamless=\"seamless\" src=\"https://plot.ly/~PythonPlotBot/2841.embed\" height=\"450.0px\" width=\"800.0px\"></iframe>"
],
"text/plain": [
"<plotly.tools.PlotlyDisplay object>"
Expand All @@ -314,7 +314,7 @@
" yaxis = go.layout.YAxis(\n",
" visible=False,\n",
" range = [0, img_height*scale_factor],\n",
"# the scaleanchor attribute ensures that the aspect ratio stays constant\n",
" # the scaleanchor attribute ensures that the aspect ratio stays constant\n",
" scaleanchor = 'x'),\n",
" width = img_width*scale_factor,\n",
" height = img_height*scale_factor,\n",
Expand Down Expand Up @@ -368,7 +368,7 @@
{
"data": {
"text/html": [
"<iframe id=\"igraph\" scrolling=\"no\" style=\"border:none;\" seamless=\"seamless\" src=\"https://plot.ly/~michaelbabyn/152.embed\" height=\"388px\" width=\"561px\"></iframe>"
"<iframe id=\"igraph\" scrolling=\"no\" style=\"border:none;\" seamless=\"seamless\" src=\"https://plot.ly/~PythonPlotBot/2843.embed\" height=\"388px\" width=\"561px\"></iframe>"
],
"text/plain": [
"<plotly.tools.PlotlyDisplay object>"
Expand All @@ -386,6 +386,7 @@
"import numpy as np\n",
"import dlib\n",
"\n",
"\n",
"#load dlib's pretrained face detector\n",
"cnn_human_detector = dlib.cnn_face_detection_model_v1('mmod_human_face_detector.dat')\n",
"\n",
Expand All @@ -401,31 +402,36 @@
"dog_dets = cnn_dog_detector(img, 1)\n",
"\n",
"layout= go.Layout(\n",
" xaxis = go.layout.XAxis(showticklabels = False,\n",
" showgrid=False,\n",
" zeroline=False,\n",
" range = [0,img.shape[1]]\n",
" ),\n",
" yaxis = go.layout.YAxis(showticklabels = False,\n",
" showgrid=False,\n",
" zeroline=False,\n",
" range = [0,img.shape[0]]\n",
" ),\n",
" autosize=False,\n",
" height=img.shape[0], \n",
" width=img.shape[1],\n",
" images= [dict(\n",
" source= \"https://raw.githubusercontent.com/michaelbabyn/plot_data/master/beethoven.jpg\",\n",
" xref= \"paper\",\n",
" yref= \"paper\",\n",
" x= 0,\n",
" y= 1,\n",
" sizex= 1,\n",
" sizey= 1,\n",
" sizing= \"stretch\",\n",
" opacity= 1,\n",
" layer= \"below\")]\n",
" )\n",
" xaxis = go.layout.XAxis(\n",
" showticklabels = False,\n",
" showgrid=False,\n",
" zeroline=False,\n",
" range = [0, img.shape[1]]\n",
" ),\n",
" yaxis = go.layout.YAxis(\n",
" showticklabels = False,\n",
" showgrid=False,\n",
" zeroline=False,\n",
" range = [0, img.shape[0]],\n",
" scaleanchor = 'x'\n",
" ),\n",
" autosize=False,\n",
" height=img.shape[0], \n",
" width=img.shape[1],\n",
" margin = {'l': 0, 'r': 0, 't': 0, 'b': 0},\n",
" images= [dict(\n",
" source= \"https://raw.githubusercontent.com/michaelbabyn/plot_data/master/beethoven.jpg\",\n",
" x=0,\n",
" sizex=img.shape[1],\n",
" y=img.shape[0],\n",
" sizey=img.shape[0],\n",
" xref=\"x\",\n",
" yref=\"y\",\n",
" opacity=1.0,\n",
" layer=\"below\",\n",
" sizing=\"stretch\"\n",
" )]\n",
")\n",
"\n",
"humans=[\n",
" go.Scatter(\n",
Expand Down