2012-08-16 3 views
4

그래픽 차트의 출처를 다양한 하이 차트 차트의 크레딧으로 표시하려고합니다. 그러나이 소스의 문자열은 때때로 길어서 한 줄에 들어 가지 않습니다. 나는 수작업으로 크레디트의 y 값과 차트의 spacingBottom을 설정할 수 있지만, 다른 소스/크레딧 (일부는 한 줄에 들어가고 일부는 그렇지 않을 수도 있음)이 50 개가 넘는 그래픽을 가지고 있기 때문에 모든 가능성을 자동으로 포함하는 기본 옵션을 설정 하시겠습니까? 여분의 텍스트가 차단되는 것을 보여줍니다 여기하이 차트 : 여러 라인의 크레딧

간단한 바이올린 : http://jsfiddle.net/kFskZ/

답변

1

그게 당신이 원하는 게 무엇인지 모르겠어요.

Highcharts.setOptions을 사용하십시오.

var options = { 
    credits: { 
     text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam suscipit nulla a elit porta vitae condimentum eros vehicula. Nam rhoncus mattis turpis quis rhoncus. Fusce pulvinar faucibus odio, at ultricies diam dignissim et. Donec at nibh est, quis posuere purus.', 
    style: { 
     width: 300 
    }, 
     position: { 
      align: 'left', 
      x: 10 
     } 
    }  
}; 

Highcharts.setOptions(options); 

demo

업데이트 :
는 많은 가능성이 있습니다.
legend 포지션을 변경하고 전설을 높일 수 있습니다 width. demo

+0

없음에 설명서를 참조하십시오, 내가 원하는 예제에서 "로렘 입숨"텍스트 전체에 표시하는 것입니다. 지금은 한 줄만 표시됩니다. "Lorem ipsum dolor amet, consectetur adipiscing elit. Etiam". 크레딧 텍스트의 길이에 따라 그래프 영역의 크기가 커져서 전체 크레딧 문자열을 표시하도록 솔루션을 유연하게하고 싶습니다. –

+0

이것은 SVG 내에서 자동 텍스트 감싸는 방법이 없기 때문에 SVG에서 문제가되는 것처럼 보입니다. 원하는 줄을 수동으로 계산 한 다음 각 줄마다 'text'요소 내에 여러 'tspan'요소를 추가해야합니다. HighCharts 팀에 문제를 제출하여 향후 출시에서이를 해결할 수 있는지 확인합니다. – Kwal

1

크레딧의 'position'옵션을 사용하고 줄 바꿈을 만들기 위해 html 구분 태그를 넣어서이 문제를 해결했습니다. 모든 텍스트가 원하는대로 표시 될 때까지 계속 지위를 유지해야했습니다. http://www.highcharts.com/docs/chart-design-and-style/design-and-style

credits: { 
    text: 'Powered by ACIS<br/>Western Regional Climate Center', 
    href: 'http://wrcc.dri.edu', 
    position: { 
     align: 'right', 
     verticalAlign: 'bottom', 
     x: -20, 
     y: -20 
    } 
},