在網上研究了一下，svg元素的縮放有兩種方法。
（參考viewbox的使用方法如下：
viewbox的作用是，把原svg中從(0,0)到(400,400)區域的內容，放到當前width=」100」和height=」100」的svg區域內。
viewbox方法的優點是實現簡單。
缺點：1、只能等比例綻放，示例中如果width=」100」，height=」200」，實際顯示的效果如圖，不是把svg拉伸為100*200，而是把svg放在y方向居中。
2、如果使用js動態改變svg元素的viewbox屬性，不能達到預期的效果。
（參考transform=」scale(sx,sy)」，sx和sy分別代表x方向和y方向拉伸或縮小的比例因子。如果大於1，則表示拉伸；如果小於1則表示縮小；若省略sy，則表示sy=sx，作等比例縮放。
transform的優點是可以做任意的縮放、平移、旋轉，且可以用js動態更改屬性。
缺點：不能在svg根元素中使用此屬性，一般是給svg的所有直接子g元素新增此屬性，才能達到縮放svg的效果。
簡單實現svg的拖拽和縮放
此方法限制太多，可能 svg使用d3繪製，並且抽象出svg中所有元素的乙個參照點和縮放比例 svg元素不會太多，否則會造成卡頓。最近有個專案需要我幫一下前端，主要是使用d3繪製svg放在頁面，其中有乙個功能就是對繪製的svg進行拖動和縮放，有點像地圖。這裡我已經寫好了乙個方法來繪製svg funct...
SVG元素設計
svgmaker是一款用來對html5網頁，移動應用程式，動畫設計和常規圖形等使用情況設計svg內容的mac軟體。svgmaker能夠vg多段路徑編輯，並將元素可以通過拖放操作在結構中匯入和重新排序，提高大家進行svg設計的工作效率，需要的朋友不要錯過哦。svg是一種標記語言，用於描述二維圖形應用程...
翻譯svg教程 svg 中的g元素
svg 中的元素用來組織svg元素。如果一組svg元素被g元素包裹了，你可以通過對g元素進行變換 transform 被g元素包裹的元素也將被變換，就好這些被svg包裹的元素是乙個元素一樣，和效果如下 這個 示例立馬，g元素包裹了3個元素 兩條線乙個文字框 下面我們看看對g元素進行變換 效果如下 可...