內容簡介
使用 Google Camera 或任何 photo sphere 應用程式創建球形照片，並使用 Simple Photo Sphere 將其插入到您的網站中。
Simple Photo Sphere 可以在觸控屏幕上使用。
示範
短代碼範例
最小
[sps_img img_id=”1″ caption=”臥室”]
所有選項
[sps_img img_id=”1″ caption=”客廳” width=”800″ height=”600″ height_vh=”80″ padding=”10″ autoplay=”0″ two_fingers=”1″ longitude=”0″ latitude=”0″ zoom=”60″ imgstyle=”border: 2px solid darkblue;” two_fingers_titel=”使用兩根手指來導航” autorotate_title=”自動旋轉” zoom_title=”縮放” zoom_out_title=”縮小” zoom_in_title=”放大” normal_size_title=”切換到小尺寸” full_size_title=”切換到全尺寸” marker1=”10,0,0,150,50″]
必填
img_id：從媒體庫中選擇圖像 ID（如果未指定，將顯示演示圖像）
顯示選項
（非必填，使用預設設定可以正確顯示）
width：圖像最大寬度（像素）（預設：600）
height：圖像最大高度（像素）（預設：450）
height_vh：瀏覽器視窗的圖像高度百分比（預設：80）
padding：與其他元素的距離（像素）（預設：10）
caption：照片球的描述（預設：Photo Sphere）
longitude：起始經度，介於 0 和 2π 之間
latitude：起始緯度，介於 -π/2 和 π/2 之間
zoom：初始縮放比例，介於 30 和 90 之間（預設：60）
imgstyle：高級使用者的額外 CSS 選項
autoplay：啟用或停用自動旋轉，0 為關閉，1 為開啟（預設：0）
two_fingers：需要使用兩根手指旋轉全景圖。這允許在包含查看器的頁面中使用標準的觸摸滾動導航。如果啟用，當偵測到只有一個觸碰時，會顯示請求用兩根手指的覆蓋層。0 為關閉，1 為開啟（預設：0）
語言選項
（非必填，預設情況下顯示英文語言）
two_fingers_titel：使用兩根手指來導航
autorotate_title：自動旋轉
zoom_title：縮放
zoom_out_title：縮小
zoom_in_title：放大
normal_size_title：切換到小尺寸
full_size_title：切換到全尺寸
您可以在設定頁面上設置標題（這將是所有短代碼的預設值）。
標記
使用圖像作為標記。
marker1=”10,0,0,150,50″ marker2=”11,0,0,150,50″ …
其中五個值為「img_id、longitude、latitude、width、height」。
最多可以使用 20 個標記。
CSS 範例
簡單邊框 = border: 2px solid lightslategrey;
帶填充的簡單邊框 = padding: 4px;border: 4px solid darkslateblue;
雙邊框 = padding: 4px; border: 4px solid darkblue; background-color: darkslateblue;
外掛標籤
開發者團隊
原文外掛簡介
Create spherical photos with Google Camera or any photo sphere applications and insert it your site with Simple Photo Sphere.
Simple Photo Sphere it is works with touch screens too.
Demo
Shortcode example
Minimal
[sps_img img_id=”1″ caption=”Bedroom”]
All options
[sps_img img_id=”1″ caption=”Living room” width=”800″ height=”600″ height_vh=”80″ padding=”10″ autoplay=”0″ two_fingers=”1″ longitude=”0″ latitude=”0″ zoom=”60″ imgstyle=”border: 2px solid darkblue;” two_fingers_titel=”Use two fingers to navigate” autorotate_title=”Automatic rotation” zoom_title=”Zoom” zoom_out_title=”Zoom Out” zoom_in_title=”Zoom In” normal_size_title=”Switch to small Size” full_size_title=”Switch to full size” marker1=”10,0,0,150,50″]
Required
img_id: select your img id from media library (If not specified, a demo image is displayed.)
Display optional
(Not necessary, is displayed correctly with the default settings)
width: image max width in pixel (default: 600)
height: image max height in pixel (default: 450)
height_vh: image height of the viewport in percent (default: 80)
padding: distance from other elements in pixel (default: 10)
caption: description of the photo sphere (default: Photo Sphere)
longitude: initial longitude, between 0 and 2π
latitude: initial latitude, between -π/2 and π/2
zoom: initial zoom, between 30 and 90 (default: 60)
imgstyle: extra CSS options for advanced user
autoplay: enable or disable auto rotate, 0 is off and 1 is on (default: 0)
two_fingers: Requires two fingers to rotate the panorama. This allows standard touch-scroll navigation in the page containing the viewer. If enabled, an overlay asking the user to use two fingers is displayed when only one touch is detected. 0 is off and 1 is on (default: 0)
Language options
(Not necessary, is displayed in English language with the default settings)
two_fingers_titel: Use two fingers to navigate
autorotate_title: Automatic rotation
zoom_title: Zoom
zoom_out_title: Zoom Out
zoom_in_title: Zoom In
normal_size_title: Normal Size
full_size_title: Full Size
You can set the titles on settings page. (This will be the default for all shortcode.)
Markers
Use an image as marker.
marker1=”10,0,0,150,50″ marker2=”11,0,0,150,50″ …
Where the five value is “img_id,longitude,latitude,width,height”.
Up to 20 markers can be used.
CSS examples
Simple border = border: 2px solid lightslategrey;
Simple border with padding = padding: 4px;border: 4px solid darkslateblue;
Double border = padding: 4px; border: 4px solid darkblue; background-color: darkslateblue;
