0
A
回答
0
一種方法是迭代相對點並標準化獨特視圖的寬度和高度像素。
var originalPointsString = '0,0 0,1 1,1 1,0 0,0'; //points to a square
var newPointsStr = '';
forEach(originalPointsString.split(' '), function(point){
var x = point.split(',')[0], // gets the x coord from each point
y = point.split(',')[1]; // gets the y coord from each point
var hPx = Math.floor((window.innerWidth/100) * x), // gets how many pixels per percent in a given view's width
vPx = Math.floor((window.innerHeight/100) * y); // gets how many pixels per percent in a given view's height
newPointsStr += hPx +','+vPx+' '; // build new point coords based on the normalized view percents
})
// Given example 1000px x 500px view
// newPointsStr === '0,0 0,5 10,5 10,0 0,0'
這會對負載做出響應,但您必須使用其他磁貼來監視窗口大小。
+0
我使用一個函數,該函數從coords屬性的對象中獲取originalPointsString,並且每個多邊形都經過該函數。 – irth
相關問題
- 1. 鉻:與SVG多邊形動畫錯誤?
- 2. 點公式爲多邊形
- 3. Svg多邊形舍入
- 4. 如何使用svg多邊形自定義屬性(data- *)來設置這些相同的多邊形的樣式?
- 5. 響應式svg clipPath與背景圖像
- 6. Google Maps API多邊形與Trulia.com多邊形對比
- 7. 多邊形邊上的點
- 8. 點在多邊形
- 9. 如何檢查點是否與多邊形相交
- 10. 將多個matchMedia()與SVG用於響應式viewBox調整大小
- 11. 逗號VS在SVG多邊形空間
- 12. SVG到谷歌地圖多邊形
- 13. SVG - 多邊形懸停不工作correclty
- 14. 帶空洞的SVG多邊形
- 15. 多邊形SVG不同筆畫
- 16. 隨機放置svg多邊形
- 17. 查找最近的多邊形SVG的
- 18. 將SVG多邊形點轉換爲路徑?
- 19. 帶點座標百分比的SVG多邊形
- 20. 請任何人都可以解釋一下SVG多邊形點?
- 21. 轉換後獲取更新的多邊形點(SVG)
- 22. 如何獲得svg多邊形的中心點?
- 23. R:對多邊形
- 24. 由頂點數組多邊形獲取多邊形的邊
- 25. 向SVG多邊形上的特定邊添加描邊
- 26. SVG多邊形填充與圖像不工作
- 27. 圖像周圍的兩個六邊形邊框(響應式)
- 28. 用於多個多邊形的點多邊形算法
- 29. 多邊形多邊形相交的特殊情況
- 30. 合併相交的多邊形一個多邊形
高度變化時會發生什麼?它剪輯?如果是這樣,您需要通過捕獲調整大小事件並確定在哪裏繪製什麼來自己做出響應。 –
高度應該保持不變(即100px),如果這就是你的意思?那麼在SVG中難以做到的事情就是 – Tommy
。 –