SVG Snap으로 그룹을 선택하십시오. ID :

Question

ID로 SVG Snap 요소를 얻으려고합니다.

var s = Snap("#svgout"), //creates the canvas 

가 그럼 난 그룹 납고 : 우선은 캔버스를 만들

  var rect = s.rect(posx, posy, 40, 40, 6).attr({ 
       fill: "none", 
       stroke: "#F44336", 
       strokeWidth: 3, 
      }); 

      var group = s.group(rect).attr({ 
       cursor: "move", 
      }); 

을하고 다음 내가 지금

var currGroupId = group.id; 

SVG 스냅

에 의해 디폴트로 그룹의 ID를 가져, 나중에 내 코드를 참조하여 ID로 얻으려고하면 ID 번호가

s.select(currGroupId); 

null이 나타납니다. ID로 요소를 올바르게 선택하려면 어떻게해야합니까?

Answer 1

select는 container.queryAll에서와 같이 cssSelector를 사용합니다.

그래서 Snap이 id를 svg 속성으로 설정한다고 생각하지 않습니다. 내가 틀렸다면 나를 바로 잡습니다. 즉, select를 사용하려면 수동으로 설정해야 할 수 있습니다.

또한 s.select (id)가 작동하지 않는다고 생각합니다. s.select ('#'. id)가되어야 할 것이라고 생각하지만 잘못된 것일 수 있습니다. 바이올린을 치면 시험하기가 더 쉬울 것입니다.

Answer 2

SnapSVG는 그룹의 ID 속성을 자동으로 설정하지 않습니다. 대신 객체 자체에 필드를 추가합니다. 이 한계를 극복하는 한 가지 방법은 다음을 수행하는 것입니다.

var s = Snap("#svgout"); 

var rect = s.rect(posx, posy, 40, 40, 6).attr({ 
    fill: "none", 
    stroke: "#F44336", 
    strokeWidth: 3, 
}); 

var group = s.group(rect).attr({ 
    cursor: "move", 
}); 

명시 적으로 ID를 설정하십시오.

group.attr({ 
    id: group.id 
}); 

var currGroupId = group.id; 

는 CSS 선택기를 사용합니다. 따라서 ID의 시작 부분에 '#'을 추가해야합니다.

s.select("#" + currGroupId); 

참고 :이 방법은 문제가 해결되지 않으면 SnapSVG의 V0.4.1

를 사용하여 나에 의해 테스트되었습니다 당신이 jQuery를 사용하고 있습니다. 시도 :

$("#"+currGroupId);