旋轉瓶的簡單公式

我正在爲該公司開發一個小型的葡萄酒彩票web應用程序。當它歸結爲10個數字時，它會將它們放在一個圓圈內並旋轉一個酒瓶;然而，我還沒有能夠使旋轉瓶子的動畫逼真。旋轉瓶的簡單公式

該應用程序將選擇一個數字，因此，一個角度指向它。之後，它開始旋轉大約10圈，然後結束指向號碼。我應該模擬摩擦還是使用某種曲線來做到這一點？

只是爲了澄清：我正在尋找一個公式或類似的東西來設置瓶子的速度。

對此提出建議？

來源

2011-05-02 Oscar Broman

由於您使用的是-webkit-transform，爲什麼不將-webkit-transition屬性設置爲ease-out？

樣品小提琴：http://jsfiddle.net/dosboy/KGhAJ/

來源

2011-05-02 09:08:15 ggutenberg

嘿，這就是我最終做的。而不是使用易於出我使用了我自己的曲線[凱撒]（http://matthewlein.com/ceaser/）： '立方貝塞爾（0.185，1.000，0.420，1.000）;' – 2011-05-02 11:54:35

從來沒有見過凱撒前。尼斯鏈接。謝謝。 – ggutenberg 2011-05-02 17:57:55

爲什麼你需要通過這種方法動畫呢？

我知道很多在線賭博網站都這樣做，並且本質上（假設瓶子始終在同一個點開始），您可以創建一個包含10個動畫的Flash文件，並通過參數提供最終結果（混淆它，如果你不想讓人看到它）。

用戶可以獲得漂亮的Flash動畫，您的隨機數生成器仍然有效，並且無需生成縮減實現時間的複雜動畫（假設您可以找人爲您製作Flash動畫）。

乾杯，特里

來源

2011-05-02 08:20:15

問題並不在於讓它旋轉，而是讓它真實地旋轉。 – 2011-05-02 08:48:52

絕對 - 一個flash動畫可以做到這一點 - 我不能透露你的網址，但不會透露我爲哪個賭博網站工作，但我們廣泛地在各種遊戲中使用這種技術。如果您從中取出javascript和phsyics，那麼它將成爲一個動畫任務，而flash在創建令人信服的動畫方面非常出色。 – 2011-05-02 08:51:05

檢查出Raphael JS庫，特別是this example。

來源

2011-05-02 08:38:44 ggutenberg

我已經將旋轉部分覆蓋了（我只是使用-webkit轉換），我正在尋找的是一種讓它看起來就像現實生活中的旋轉瓶子的方式。 – 2011-05-02 08:43:59

對不起，我誤解了。 – ggutenberg 2011-05-02 09:06:29

這裏有這樣一個很好的例子：http://www.bookatable.com/win/

用途RaphealJS如上所述。

來源

2011-09-12 11:55:00

旋轉瓶的簡單公式

回答

相關問題