我正在嘗試使用變換旋轉顯示風向的箭頭：rotate()。
我從 api-fetch 獲取以度為單位的值，測量風向的標準方法是測量風的來源，我的箭頭需要指向相反的方向才能正確顯示風流。
style={{transform: `rotate(${weatherData.parameters.wd.values}deg)`}}
我所嘗試的是將“ 180”添加到我的值中，但是當值變得大于 360 度時，這不起作用。
有任何想法嗎？
uj5u.com熱心網友回復：
首先，歡迎堆疊溢位。現在我能想到的最好的事情是在 css 中使用“翻轉/鏡像”轉換功能，這很簡單，就是一個反向比例。
transform: scale(-1, -1)
這段代碼應該水平和垂直翻轉該磁區內的任何東西，例如，如果你有一個指向 90° 的箭頭，它只會水平翻轉它，它不會做任何事情，垂直地指向 -90°。所以你的代碼應該是這樣的：
style={{transform: `rotate(${weatherData.parameters.wd.values}deg) scale(-1, -1)`}}
您肯定需要在 css 中進行一些修復，因為從最終結果的角度來看，縮放函式可能會阻止某些事情，但是如果您有一個對稱的箭頭，一切都應該沒問題。如果你需要一些幫助，就問吧！
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/370032.html
標籤：javascript css 反应 旋转变换
上一篇：排除回圈中的數字