1 回答

TA貢獻(xiàn)1811條經(jīng)驗(yàn) 獲得超6個(gè)贊
視頻由多個(gè)圖像幀組成。如果您拍攝您在汽車(chē)周?chē)凶叩囊曨l并播放它,看起來(lái)就像您顯示了一個(gè)物體的 360 度視圖。
以下是您的示例的示例: https: //cdn.spincar.com/swipetospin-viewers/spincarcomdemo/wp0ab2a70jl135405/20190222192724.K4BAQSBW/ec/0-0.jpg
他們有 60 個(gè)幀,從 0-0 到 0-60。我想到的算法是:將視頻切成幀。他們有一個(gè)滑塊來(lái)播放它們。或者實(shí)現(xiàn)一個(gè)拖動(dòng)功能,向左拖動(dòng)減少框,向右拖動(dòng)增加框,記得環(huán)繞
currentFrame = (currentFrame + dragDirection) % totalFrame
const $slider = document.getElementById('frame');
const $img = document.getElementById('img');
$slider.addEventListener('change', (e) => {
$img.src = `https://cdn.spincar.com/swipetospin-viewers/spincarcomdemo/wp0ab2a70jl135405/20190222192724.K4BAQSBW/ec/0-${e.target.value}.jpg`;
});
// Preload your imgs
for (let i = 0; i <= 63; i ++) {
const img = new Image();
img.src = `https://cdn.spincar.com/swipetospin-viewers/spincarcomdemo/wp0ab2a70jl135405/20190222192724.K4BAQSBW/ec/0-${i}.jpg`
}
<img src="https://cdn.spincar.com/swipetospin-viewers/spincarcomdemo/wp0ab2a70jl135405/20190222192724.K4BAQSBW/ec/0-0.jpg" alt="Car" id="img" />
<input type="range" id="frame" name="frame" min="0" max="63" value="0">
- 1 回答
- 0 關(guān)注
- 184 瀏覽
添加回答
舉報(bào)