가변 스트로크 너비 NVD3 lineChart

Question

NVD3의 lineChart 모델을 확장하여 차트의 각 라인 경로에 가변 스트로크 너비를 허용하는 것이 쉬운 방법이 있는지 알아 내려고합니다.

특히, 나는 서로 다른 분야 (NVD3의 lineChart가 완벽하게 작동 함)에서 취업의 전년 대비 성장을 보여줄 필요가있는 단순한 선 차트를 다루고 있으며, 상대적인 소매업은 어려움을 겪고 있지만 여전히 인구의 상당 부분을 차지하고있는 반면, 이러한 부문들 (즉, 농업은 수백명의 사람들을 고용하면서 성장할 것입니다. 소매업은 어려움을 겪고 있지만 인구의 많은 부분을 여전히 고용하고 있습니다) - 이것은 선형 척도가 아니지만, 상대적 체중 각 섹터의 시간 간격은 시간에 따라 다르지만 두꺼운 선은가는 선보다 많은 직원이있는 부문을 나타낼 수 있습니다.

분명히 나는 ​​모든 라인의 스트로크 폭을 전체 timespan에 걸쳐 각 섹터의 평균 가중치를 사용하여 매우 쉽게 변경할 수 있지만, SVG에서 단일 너비의 다양한 너비를 지정하는 방법은 없다. path 요소 : lineChart 위에 구축되지만 각 라인을 이산 폴리곤 (삼각형?)으로 매년 분할하는 NVD3 모델을 만드는 것이 합리적일까요?

Answer 1

자신에 대한 답변을 찾고 있습니다. 쉬운 방법은 없지만 한 가지 방법은 stroke-dasharray 속성을 사용하는 것입니다. http://owl3d.com/svg/vsw/articles/vsw_article.html

기본적으로 스트로크 너비 범위를 다루는 일련의 복제 된 경로를 만들 수 있습니다. 대시 배열로 변환하면 대시 사이의 간격을 사용하여 각 점에서 볼 수있는 경로를 제어 할 수 있습니다.

원하는 모양과 너비에 따라 첫 번째 오프셋과 다른 오프셋을 가진 두 번째 경로 요소를 추가하여 퍼지 할 수도 있습니다.

Answer 2

아마도 닫힌 경로를 생성하고 pattern 채우기 또는 일반 채우기를 해당 경로에 적용하십시오. 닫힌 패스는 다양한 폭의 라인을 모방하기 위해 효과적으로 삼각형 모양입니다.