2010-03-20 9 views
0

dom에 svg 요소의 문자열을 추가하려고합니다. 이건 제 설정입니다.dom에 SVG 문자열을 추가합니다.

var oFragment = ''; 
for (var i = 0; i < 10; i++) { 
oFragment += '<g><path id="note-'+i+'" d="M 6,3 84,6 c 0,0 -6,76 14,91 L 58,97 19,89 c 0,0 -24,-5 -13,-86 z" style="fill:#ffc835;" /></g> '; 
} 

다음은 내가 시도한 것입니다.

var oSVG = document.getElementById("svg-wall").getSVGDocument(); 
var oNotes = oSVG.getElementById('notes'); 
oNotes.appendChild(parseXML(oFragment, document)); 

그래서 내 질문은 "parseXML이 정의되어 있지 않은"에는 다음과 같은 오류를 제공 내가 무슨 일을하고있는 중이 야하고, DOM에 SVG 문자열을 추가 할이 심지어 가장 좋은 방법은 무엇입니까?

답변

0

무료 기능이 있다고 생각하지 않습니다. parseXML (일부 기능이 누락 되었습니까?)

어쨌든 DOM을 다루고 있기 때문에 DOM에 요소를 직접 삽입하지 않으시겠습니까?

for (var i = 0; i < 10; ++ i) { 
    var path = document.createElement("path"); 
    path.setAttribute("id", "note-" + i); 
    ... 
    var g = document.createElement("g"); 
    g.appendChild(path); 
    oNotes.appendChild(g); 
} 
+0

thx! 나는 그것을 그렇게 할 것이다. jQuery에서 innerHTML 또는 html()과 같은보다 짧은 짧은 솔루션을 기대했다. 루트 요소가 에 삽입되어 있습니다. – Baijs

+0

@Wieringen : 아니요, 당신은 10 개의 ''을 생성하고 있지 않습니다. – kennytm

+0

내가 알고 있지만, g는 ID 노트 – Baijs

1

parseXMLSVG Tiny 1.2의 일부이지만, SVGGlobal 인터페이스 방법은 현재 AFAIK에서 모든 웹 브라우저에서 지원되지 않습니다. 그러나 다른 기술을 사용하여 구현할 수 있습니다. 이 blogpost의 하단 인, SVG at the movies take 2을 보면 간단한 wrapper script that implements parseXML (오페라, 파이어 폭스 및 웹킷에서 잘 작동 함)을 발견 할 수 있습니다. 사용되는이 스크립트의 예를 보려면 해당 블로그 게시물의 데모 소스를 살펴보십시오.

관련 문제