https://szeching.com/tags/panorama/ Recent content in Panorama on 瓶子裡的小狐狸 Hugo -- gohugo.io zh-Hant © 2026 Y Cheung Sun, 08 Nov 2015 11:47:15 +0000 https://szeching.com/krpano-video-embed-wordpress-plugin/ Sun, 08 Nov 2015 11:47:15 +0000 https://szeching.com/krpano-video-embed-wordpress-plugin/ <p>krpano 做 Panoramic Video 的時候很麻煩（<a href="https://krpano.com/video/" target="_blank" rel="noreferrer">官網說明太簡單</a>），要自己改一堆東西然後上傳，然後再用iframe的方式在wordpress 文章或者頁面中加載，一整個就煩透了。於是用空閒時間順手做了這個插件，稍微簡化了一下流程。</p> <h2 class="relative group">軟體版本： <div id="軟體版本" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e8%bb%9f%e9%ab%94%e7%89%88%e6%9c%ac" aria-label="定位點">#</a> </span> </h2> <ul> <li>Wordpress 版本 4.3.1</li> <li>Krpano 版本 1.18</li> </ul> <h2 class="relative group">插件下載： <div id="插件下載" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e6%8f%92%e4%bb%b6%e4%b8%8b%e8%bc%89" aria-label="定位點">#</a> </span> </h2> <ul> <li><a href="https://github.com/amyuki/krpano-video-plugin" target="_blank" rel="noreferrer">Github</a></li> <li><a href="https://app.box.com/s/q8tcx32bql1yewspivzopqr95rs6z97e" target="_blank" rel="noreferrer">BOX</a></li> </ul> <h2 class="relative group">安裝插件： <div id="安裝插件" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e5%ae%89%e8%a3%9d%e6%8f%92%e4%bb%b6" aria-label="定位點">#</a> </span> </h2> <ol> <li>文件解壓縮至 <code>/wp-content/plugins/</code></li> <li>將你購買的krpano程序中相應的文件替換掉本插件中的文件，包括 <code>/krpano/krpano.js</code> 和 <code>/krpano/krpano.swf</code> ，（本插件中的文件源自未授權demo版，請自行購買授權）。</li> <li>登錄wordpress後台，並激活插件</li> </ol> <h2 class="relative group">使用插件: <div id="使用插件" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e4%bd%bf%e7%94%a8%e6%8f%92%e4%bb%b6" aria-label="定位點">#</a> </span> </h2> <ol> <li>將 Panoramic Video 壓制成 1920x960 和 1024x512 尺寸，推薦WEBM格式或MP4格式</li> <li>製作 Panoramic Video 封面縮略圖兩張，尺寸分別為1920x960 像素 和 1024x512 像素</li> <li>將視頻和圖片通過FTP上傳至 <code>/krpano/video</code> 文件夾中</li> <li>點擊編輯器上的按鈕(如下圖所示）在需要嵌入Panoramic Video的地方插入代碼 <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="01" width="805" height="500" src="https://szeching.com/images/YUKIMINIPC20151108192756_hu_48ce30cbd5a816da.png" srcset="https://szeching.com/images/YUKIMINIPC20151108192756_hu_48ce30cbd5a816da.png 800w, https://szeching.com/images/YUKIMINIPC20151108192756.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151108192756.png"></figure> </li> </ol> <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="02" width="823" height="582" src="https://szeching.com/images/YUKIMINIPC20151108192959_hu_fa01c6b55d67cc2c.png" srcset="https://szeching.com/images/YUKIMINIPC20151108192959_hu_fa01c6b55d67cc2c.png 800w, https://szeching.com/images/YUKIMINIPC20151108192959.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151108192959.png"></figure> <p>務必完整填寫完所有表單（如下圖示） <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="" width="599" height="337" src="https://szeching.com/images/YUKIMINIPC20151108193956.png" srcset="https://szeching.com/images/YUKIMINIPC20151108193956.png 800w, https://szeching.com/images/YUKIMINIPC20151108193956.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151108193956.png"></figure> 5. 如需自定義XML，文件放在 <code>/krpano/xml</code> 中</p> https://szeching.com/how-to-make-cardboard-vr-app-with-unity3d/ Tue, 27 Oct 2015 13:30:51 +0000 https://szeching.com/how-to-make-cardboard-vr-app-with-unity3d/ <h2 class="relative group">本文中所使用的軟體 <div id="本文中所使用的軟體" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e6%9c%ac%e6%96%87%e4%b8%ad%e6%89%80%e4%bd%bf%e7%94%a8%e7%9a%84%e8%bb%9f%e9%ab%94" aria-label="定位點">#</a> </span> </h2> <ul> <li>Unity3D 5.1.2f1 （<a href="https://unity3d.com/cn/get-unity/download/archive" target="_blank" rel="noreferrer">官方下載地址</a>）</li> <li>Unity 版的 Cardboard SDK（<a href="https://github.com/googlevr/gvr-unity-sdk" target="_blank" rel="noreferrer">官方下載地址</a>）</li> <li>Java SE Development Kit 8 （<a href="https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html" target="_blank" rel="noreferrer">官方下載地址</a>）</li> <li>Android SDK （<a href="https://developer.android.com/studio" target="_blank" rel="noreferrer">官方下載地址</a>）</li> <li>PTGui （可選）</li> </ul> <h2 class="relative group">操作步驟 <div id="操作步驟" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e6%93%8d%e4%bd%9c%e6%ad%a5%e9%a9%9f" aria-label="定位點">#</a> </span> </h2> <h3 class="relative group">新建 Unity3D 工程 <div id="新建-unity3d-工程" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e6%96%b0%e5%bb%ba-unity3d-%e5%b7%a5%e7%a8%8b" aria-label="定位點">#</a> </span> </h3> <p>在Unity中新建一個工程： <code>VRtour</code></p> https://szeching.com/how-to-render-bublcam-panorama-on-local-machine/ Sat, 17 Oct 2015 15:35:41 +0000 https://szeching.com/how-to-render-bublcam-panorama-on-local-machine/ <h2 class="relative group">使用的軟件 <div id="使用的軟件" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e4%bd%bf%e7%94%a8%e7%9a%84%e8%bb%9f%e4%bb%b6" aria-label="定位點">#</a> </span> </h2> <ul> <li>Autopano Giga<sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup></li> <li>Photoshop</li> <li>Krapano<sup id="fnref:2"><a href="#fn:2" class="footnote-ref" role="doc-noteref">2</a></sup></li> </ul> <ol> <li> <p>將Bublcam 存儲卡中的圖片用Photoshop打開，並沿著邊框切片並分別保存。 <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="切片" width="1729" height="937" src="https://szeching.com/images/YUKIMINIPC20151017223434_hu_3288efd4ab62a40a.png" srcset="https://szeching.com/images/YUKIMINIPC20151017223434_hu_3288efd4ab62a40a.png 800w, https://szeching.com/images/YUKIMINIPC20151017223434_hu_a0d4551e3b4bc0d4.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151017223434.png"><figcaption>切片</figcaption></figure> <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="保存" width="1034" height="824" src="https://szeching.com/images/YUKIMINIPC20151017223753_hu_6c34e36b034bb772.png" srcset="https://szeching.com/images/YUKIMINIPC20151017223753_hu_6c34e36b034bb772.png 800w, https://szeching.com/images/YUKIMINIPC20151017223753.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151017223753.png"><figcaption>保存</figcaption></figure> </p> https://szeching.com/getting-started-with-ptgui-and-autopanogiga/ Sat, 17 Oct 2015 10:37:55 +0000 https://szeching.com/getting-started-with-ptgui-and-autopanogiga/ <blockquote><p>全景图（panorama）是一种广角图，可以以画作、照片、影片、三维模型的形式存在。</p> </blockquote><blockquote><p>全景，指於球體的空間狀態，視角涵蓋地平線+/-各180°，垂直+/-各90°，就立方體的空間狀態，即為上下前後左右六個面完全包含。尤於水平角度為360°，垂直為180°，能表達這種模式的照片有很多種，又跟球面的投影有關（類似繪製世界地圖的投影，但是是內投影）。 <sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup></p>