使用fabricjs在svg文件中查找組標識號

Question

我有一個svg文件。在文件中有很多組（參見'SVG文件示例'），我不知道文件中有多少個第一級組。 使用fabricjs我如何找出svg文件中的組數目，如結果（請參閱'我正在查找的結果'）？

例SVG文件：

<g id="group1"> 
    <rect id="rect1" x="0" y="0" fill="#00FF00" width="10" height="10"/> 
    <rect id="rect2" x="10" y="10" fill="#FF0000" width="10" height="10"/> 
    <rect id="rect3" x="20" y="20" fill="#0000FF" width="10" height="10"/> 
</g> 

結果我在尋找：

#found 3 group ID's: 
group1 
group2 
group3 

Answer 1

我不知道面料，但我相信如果必要的話你可以使用JavaScript像如下...

var svg = document.getElementById("mainsvg"); 

var groupCount = 0; 
var childNodes = svg.childNodes; 
var childNumber = childNodes.length; 

for(a=0; a<childNumber; a++) { 

    if(childNodes[ a ].localName == 'g') { 
     console.log(childNodes[a].attributes.id.value); 
     groupCount++; 
    } 
} 

console.log(groupCount); 

這裏有一個小提琴.. http://jsfiddle.net/5RyZK/3/（你可能想先檢查它是否有一個id，並將它推到一個數組或其他東西。