2014-11-06 2 views
1

javascript를 통해 다시 색칠해야하는 HTML 5 문서에서 여러 .svg 그래픽을 사용하고 있습니다. 또한 로딩 시간은 가능한 한 짧아야합니다. 이렇게하는 가장 좋은 방법은 <use>입니다. 이 (해야) 자바 스크립트 코드에 의해 다음 쉽게 조작 할 수있는 DOM에 svg를 통합해야합니다. 그것은 나를 위해 비록 내가 별도의 파일 (다른 곳에서 HTML 파일에서) svg로드하려는 작동하지 않습니다.인라인 svg (사용)을 올바르게 사용하는 방법

내 코드는 다음과 같습니다

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
<use xlink:href="/resources/svgs/test.svg"/></svg> 

나는 대부분의 예 ...test.svg#someID를 사용하는 것으로 나타났습니다하지만 난 SVG에서 일부 심볼의 ID를 사용하는 경우에도 작동하지 않습니다. 페이지의 다른 곳에 인라인 (복사 및 붙여 넣기) svg를 정의한 다음 해당 svg의 ID를 href로 보면 작동합니다. 내 오류는 어디에 있습니까? svg를 사용하는 더 좋은 방법이 있습니까?

+0

내가 svg를 가져 오려는 곳에서 다른 svg 파일은 주위에 가 있다는 것을 잊어 버렸다. 이 문제를 해결하는 방법이 있습니까? 아마도 다른 방법이 있을까요? – CodeO

답변

0

좋아,이게 정확히 작동합니다. <defs><symbols>xlinks:href과 함께 사용하십시오. 내가 볼 수있는 단점은 이러한 svg가 그림자 돔으로 주입된다는 것입니다. 따라서 jQuery로 변경할 수는 없습니다.

관련 문제