使用 autoRotate 參數使全景圖 自動旋轉
autoRotate參數的值應該是一個數字,用來指定全景圖每秒旋轉的角度
-
- 如果參數autoRotate是正數，則進行逆時針旋轉
- 如果參數autoRotate是負數，則進行順時針旋轉
使用 autoRotateInactivityDelay 參數使全景圖如果在指定毫秒内沒有和使用者進行互動，就開始自動旋轉
效果：
Auto rotate
<!DOCTYPE HTML>
<html lang="ch">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author"content=“KaiSarH,[email protected]”>
<title>Auto rotate</title>
<link rel="stylesheet" href="pannellum.css"/>
<script type="text/javascript" src="pannellum.js"></script>
<style>
#panorama {
width: 1200px;
height: 800px;
}
</style>
</head>
<body>
<div id="panorama"></div>
<script>
pannellum.viewer('panorama', {
"type": "equirectangular",
"panorama": "test/test6.jpg",
// 點選螢幕後，兩秒沒有互動的話繼續旋轉
"autoRotateInactivityDelay":2000,
// 每秒順時針旋轉兩度
"autoRotate": -2
});
</script>
</body>
</html> -
- 當我們設定了"autoRotate"參數後，螢幕實作了自動旋轉
- 當我們設定了"autoRotateInactivityDelay"參數後，自動旋轉的螢幕會在我們與其進行互動(比如點選)後停止，如果在設定的時間内沒有進行互動的話，則繼續自動旋轉
![龍珠訓練營task04[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)