SVG가 Raphael과 이상하게 렌더링 되었습니까?

SVG를 조작하기 위해 Raphael을 사용하는 온라인 디자이너가 있습니다. 우리는 이것을 위해 사용할 큰 클립 아트 라이브러리를 준비하고 있지만 아주 이상한 문제가 있습니다.SVG가 Raphael과 이상하게 렌더링 되었습니까?

SVG 중 일부는 브라우저에서 문제가되는 문제가 발생하지만 일단 Raphael로 가져 오면 완전히 인식 할 수 없게됩니다.

여기 효과 나타내는 이미지이다 : enter image description here

와 여기 (a .AI 파일 삽화가 보에 의해 생성)에 SVG의 코드이다 :

<?xml version="1.0" encoding="utf-8"?> 
<!-- Generator: Adobe Illustrator 14.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 43363) --> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> 
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" 
    width="100px" height="83.641px" viewBox="0 0 100 83.641" enable-background="new 0 0 100 83.641" xml:space="preserve"> 
<polygon points="58.263,0.056 100,41.85 58.263,83.641 30.662,83.641 62.438,51.866 0,51.866 0,31.611 62.213,31.611 30.605,0 
    58.263,0.056 "/> 
</svg>

출처

2012-04-11 Walker

가 나타난다 경로로 파일을 가져 오는 프로세스에 결함이 있거나 변환에 적용되지 않은 사항이있을 수 있습니다. 예를 들어,이 코드는 잘 작동 :

var paper = Raphael("paper"); 
paper.path(
    "M58.263,0.056 L100,41.85 L58.263,83.641 L30.662,83.641 " + 
    "L62.438,51.866 L0,51.866 L0,31.611 L62.213,31.611 30.605,0" 
).attr({ 'fill': 'black' });

이 http://jsfiddle.net/sgMH6/

가 어떻게 라파엘에이 파일을 "풀"않습니다를 참조하십시오? 그 과정/코드는 무엇입니까?

: 추가 정보; import plugin is https://github.com/wout/raphael-svg-import/blob/master/raphael-svg-import.js

사용중인 플러그인에 잘못된 다각형 구현 루틴이있을 수 있습니다. 이것은 직감이지만 0 숫자가 올바르게 처리되지 않는 것처럼 보입니다. SVG 그래픽에 제로 좌표가 포함되어 있습니다. 기능 Raphael.fn.polygon에서

이 같이가는 부분이있다 :

 var d = parseFloat(c[j]); 
    if (d) 
     poly.push(d);

이에, 대신 당신을 위해 작동 할 수 있음을 변경하는 경우 :

var d = parseFloat(c[j]); 
    if (!d) d = 0; 
    poly.push(d);

이것은 매우 기본적인 수정이며 다른 것들을 망칠 수도 있습니다. 여하튼 수정 된 플러그인 수정을 사용하는 작업 예제를 살펴보십시오 (http://jsfiddle.net/pkzGJ/). 이것이 실제로 버그 인 경우 플러그인 작성자에게 제출해야합니다.

출처

2012-04-11 21:07:03 pp19dd

답변 해 주셔서 감사합니다. pp19dd - Raphael에 대한 기본 책임이있는 개발자가 질문에 정확히 답변 할 때까지 기다리고 있습니다! 3-4 시간 후에 답변을 얻을 수 있습니다! – Walker

우리는 예술을 그리기 위해 Raphael SVG Import 플러그인을 사용하고 있습니다. https://github.com/wout/raphael-svg-import – Walker

잠재적 해결책을 추가했습니다. 감사합니다, 디노 – pp19dd

SVG가 Raphael과 이상하게 렌더링 되었습니까?

답변

관련 문제