2009-06-24 5 views
7

내 과제는 2 차원 공간에서 주어진 점 시퀀스에 다른 종류의 곡선을 맞추는 알고리즘을 개발하는 것입니다.SVG로 2D 렌더링 및 확대

내 알고리즘을 테스트 할 수 있도록 결과를 표시하기 위해 SVG를 선택했습니다. 나는 그것에 몇 가지 문제가있다.

내 알고리즘의 입력과 출력이 매우 다를 수 있으므로 생성 된 SVG 파일을 확대하여 볼 수 있어야합니다.

그러나 SVG의 경로는 특정 너비로만 표시 할 수 있습니다. 확대하면 경로 폭이 넓어집니다. 너비가 모든 확대/축소 레벨에서 예를 들어 1 픽셀이되도록하고 싶습니다. 이것에 대한 해결책이 있습니까?

기타 : SVG 표시 점 수 있습니까? 네, 간단합니다. 나는 그것이 할 수 없다는 것을 발견했다.

감사 (포스트 스크립트 및 PDF 등)

답변

8

다른 많은 벡터 형식은 당신이 "헤어 라인"뇌졸중 0의 스트로크 폭을 사용하게됩니다. SVG에서는 그렇지 않습니다. 그러나 생각하면 스트로크 너비 비율을 사용하면 원하는 것을 얻을 수 있습니다. 기본적으로, the w3c SVG specifications for details 볼 수 있지만, 당신은 같은 것을 할 수 있어야한다 :

stroke-width:"1%" 

이해야 스트로크에 관계없이 줌 레벨의 경계 사각형의 상수 1 % 선 폭과의 곡선.

포인트는 SVG가 지원하지 않습니다. 과거에 Postscript를 사용하여이 작업을 수행했을 때 항상 작은 원을 그리는 데 arc with a small redius을 사용했습니다. 원하는 경우 점을 채울 수 있습니다.


@Zoli는 :

vector-effect="non-scaling-stroke" 

그냥이 추가 : 귀하의 코멘트 후, 나는 내가 non-scaling-stroke vector-effect in the SVG specification을 가로 질러 왔을 때 당신은 헤어 라인 스트로크 폭을 사용할 수 있도록 포스트 스크립트 들여다 제안하고 있었다 귀하의 커브와 사양에 따라, 스케일링에 불변해야합니다. 그들의 예는 line을 사용하지만 커브에서도 잘 작동합니다.

+0

% 사용 : 확대/축소는 또한 선을 넓 힙니다. – libeako

+0

벡터 효과 속성을 가져 주셔서 감사합니다. 그러나 원하는대로 작동하지 않습니다. svg 문서 자체의 변형에 대해서만 확대/축소를 방어하지 않습니다. 하지만 SVG의 새로운 기능인 Mozilla Firefox가 지원하지 않을 수도 있기 때문에 작동하지 않습니다. – libeako

+0

필자는 SVG 1.2 기능이라고 생각하지만, 모바일 프로필과 작은 프로필에서도 지원되므로 모든 SVG 1.2 구현이 지원해야합니다. SVG 스펙의 설명은 장치 컨텍스트 (즉, 화면 공간)에서 렌더링되기 때문에 확대/축소에서도 작동해야하는 것처럼 보입니다. 다른 SVG 시청자가 어떻게 작동하는지 보셨습니까? – Naaff

0

Naaff에게 도움을 주셔서 감사합니다. 나는 파이어 폭스와 함께있을 것이라고 생각하며, 생성 된 svg 파일에서 각 알고리즘 실행에 대해 라인 폭을 지정할 것이다. 그것은 나를 위해 충분할 것입니다.

1

> 요소 또는 그와 비슷한 SVG가 현재 있지만 SVG WG에서 추가되었으므로 미래에 포함될 수 있습니다. 공개 svg 메일 링리스트에 점 > 요소에 대한 귀하의 필요와 요구 사항을 자유롭게 말하십시오 : [email protected]

문제를 해결하려면 예를 들어 < 줄 > 개의 요소를 사용하고 길이가 0 인 경우 둥근 선 캡을 사용하여 점을 표시 할 수 있습니다. 그것은 모두 당신이 이것을 위해 필요한 것에 달려 있습니다. r = 0 인 원이 더 적합 할 수 있습니다.

'비 - 스케일링 스트로크'값을 갖는 '벡터 효과'속성은 스트로크가 스케일되지 않아야한다고 말하는 데 사용해야하는 것입니다. '벡터 효과'가 기본적으로 지원되지 않으면 스트로크를 적절하게 조정할 수있는 자바 스크립트 솔루션을 구현하는 것이 어렵지 않습니다.Opera 9.5 이상은 기본적으로 지원합니다.