計算Svg <g>標籤寬度

我是SVG的新手。我有一個svg圖像，我已經應用了一個<g>標記的變換矩陣。現在我想計算<g>標籤的寬度和高度。在頁面加載我可以使用getBBox（）或getBoundingClientRec（）函數計算寬度和高度。但是，當我調整窗口的大小時，我正在更改矩陣值，在更新矩陣值之前，我如何計算<g>標記的寬度和高度。（）和getBoundingClientRec（）基於矩陣值返回寬度和高度。計算Svg <g>標籤寬度

例如：網頁加載：

<g id="xyz" transform="matrix(1,0,0,1,10,10)"></g>

當調整窗口大小我打電話，其計算矩陣值的方法。 注意：矩陣值計算還沒有更新 我需要在調整大小時將圖像居中到瀏覽器窗口。我正在減去窗口寬度和圖像寬度除以2，我將這個值應用於matrix.e i。「x」值。示例：新矩陣值爲[1.2,0,0,1.2，x，10]

對於居中映射，我需要知道使用計算矩陣值的寬度和高度<g>即[1.2,0,0， 1.2，x，10]

來源

2016-02-24 user2083041

爲什麼不應用矩陣，然後得到您需要的信息？ –

我已經更新了我的問題，請你檢查一下。 – user2083041

添加一個viewBox到SVG，你不需要做所有那些搞亂。 –

將轉化組與另一個<g>包裝在一起，並致電getBBox()。

但是，爲什麼不描述你試圖實現的原始問題？由於您是SVG新手，因此您有可能以錯誤的方式處理您的問題。也許我們可以建議一個比嘗試自己操縱矩陣更好的解決方案。

來源

2016-02-24 13:09:09

Paul感謝您的建議。總之我會解釋我的問題。我需要在調整大小窗口上放置svg圖像並居中。我正在使用svg-pan-zoom.js。我正在定製它。在調整大小時，我需要計算矩陣值以使其居中並適合窗口。爲了居中我需要知道svg 寬度 – user2083041

那麼，你可能想要修改svg-pan-zoom代碼以使其正常工作。首先，我會建議您將支持添加到此錯誤報告中，以便更快地修復：https：//github.com/ariutta/svg-pan-zoom/issues/185。 –

計算Svg <g>標籤寬度

回答

相關問題