2012-05-11 3 views
1

highcharts 오브젝트의 범례 옵션에서 많은 조합을 시도했지만 설계자가 작성한 정확한 디자인을 성공적으로 실현하지 못했습니다. 내가 필요로 무엇highcharts 옵션 만 사용하는 Highcharts 범례 사용자 정의 CSS 스타일/형식

는 ... 정확히 다음과 같습니다 전설을 할 수 Wanted legend layout

입니다하지만 사용할 수있는 전설 옵션 달성에 가장 가까운 결과는 다음과 ... The closest legend layout I could achieve

했다 나는 highchart 개체 정의 내에서 사용

속성은 있었다 :

legend: { 
    enabled: graphProperties.legend.enabled, 
    backgroundColor: ... 
    borderRadius: ... 
    verticalAlign: ... 
    align: ... 
    borderWidth: ... 
    x: ... 
    y: ... } 

가 사전에 어떤 도움을 주셔서 감사합니다.

+1

가능하면? – wergeld

+0

물론, 지금 일하는 컴퓨터에 도착할 수 없기 때문에 곧 일하러 돌아와서 곧 엉덩이를 시도 할 것입니다. – AlexRebula

답변

6

어쩌면 이것을 시작점으로 사용할 수 있습니다. 당신은 jsFiddle에 샘플 데이터 세트와 코드를 던질 수

http://jsfiddle.net/DqAqu/4/

$(function() { 
    var chart = new Highcharts.Chart({ 

     chart: { 
      renderTo: 'container', 
      backgroundColor: '#F5F5F5', 
      plotBackgroundColor: '#FFFFFF' 
     }, 

     symbols: [ 'square', 'square' ], 

     legend: { 
      backgroundColor: '#F5F5F5', 
      layout: 'horizontal', 
      floating: true, 
      align: 'left', 
      verticalAlign: 'top', 
      x: 60, 
      y: 1, 
      shadow: false, 
      border: 0, 
      borderRadius: 0, 
      borderWidth: 0 
     }, 

     xAxis: { 
      categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
     }, 

     series: [{ 
      data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
      color: '#47D147'    
     }, { 
      data: [95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1], 
      color: '#19A3FF'    
     }] 
    }); 
});​ 
+1

고마워,하지만이게 내가 필요한 것에서 아주 멀리 떨어져있어. 나는 플로트를 사용할 수 없다 : 내 차트는 결코 전설에 의해 다루어 져서는 안되기 때문이다. 귀하의 예에서도 범례는 완전히 왼쪽으로 정렬되지 않습니다. 심지어 onShow 및 onRedraw 이벤트를 사용하여 jQuery를 사용하여 범례의 CSS를 조작했지만 성공하지는 못했습니다. 나는 테스트를 시도하고 방화범과 함께 현장에서 범례의 CSS 스타일을 조작했지만 그 방법도 효과가 없었다. 전혀 효과가 없다! 달성 할 수있는 최선의 방법은 범례 폭을 설정하는 것이지만 차트 컨테이너와 동일한 크기의 너비를 가져올 수 없습니다. 나는 onShow 이벤트도했지만 성공하지 못했습니다. – AlexRebula