긴 라벨 렌더링 문제가있는 플롯 원형 차트

긴 라벨을 사용하여 플롯 파이 채팅을 플롯하고 추악한 상황에서 원형 챠트 또는 원형 차트 바로 아래에 라벨을 표시하는 것이 가능하다고 생각했습니다. 사용하고있는 자바 스크립트긴 라벨 렌더링 문제가있는 플롯 원형 차트

function onSuccess(series) { 
      var tickLabels = []; 
      var pieData= []; 
      for (var i =0;i<series.length;i++){ 
       tickLabels.push([i,series[i][0]]); 
       var obj = {}; 
       obj['label']=series[i][0]; 
       obj['data']=series[i][1]; 
       pieData.push(obj); 
       series[i][0] = i; 
      } 
      var data = [series]; 
     var pieArea = $("#pieChart"); 

     pieArea.css("height", "400px"); 
     pieArea.css("width", "600px"); 


      $.plot($("#barChart"), data, { 
     series: { 
     bars: { 
      show:true, 
      barWidth: 0.5, 
      align: "center" 
     }, 
      points: { 
       show: true 
      } 
     }, 
     grid: { 
      hoverable: true, 
      clickable: true 
     }, 
     xaxis: { 
      labelWidth:12, 
      labelAngle: 45, 
      ticks: tickLabels 
     } 
     });

the ugly pie chart

사람이 당신은 전설의 position 및 margin 특성의 조합으로이 작업을 수행 할 수있는이

출처

2013-08-27 Smith

CSS를 사용하여 범례를 다른 컨테이너에 넣고 원하는 곳에 배치 할 수 있습니다. 당신은 전설이 DOM에 다른 곳에서 표시 할 경우

이

, 당신은 전설 테이블을 넣어 jQuery를 객체/표현으로 "용기"를 지정할 수 있습니다 API 문서에서
legend: { 
    container: '#graphLegend'  
} 
으로. "위치"및 "여백"등의 옵션은 무시되고 이 무시됩니다. Flot은 컨테이너의 내용을 덮어 씁니다.

나는이 대안을 보여 Mark's fiddle 업데이트되었습니다.

출처

2013-08-28 00:29:17

실제로 코드를 사용했지만 고맙습니다. 그러나 먼저 마크가 응답되고 코드도 좋습니다. – Smith

에 대한 해결책을 알고 있나요 차트입니다 :

예를 들어, 이렇게하면 northwest 구석 오른쪽으로 400 픽셀 이동합니다.

legend: { 
    position: 'nw', 
    margin: [400,0]  
}

바이올렛 here 참조.

출처

2013-08-27 14:27:06 Mark

어떻게 barchart 예제에서 레이블을 회전합니까, 나는 성공없이 labelAngle을 시도했습니다. – Smith

긴 라벨 렌더링 문제가있는 플롯 원형 차트

답변

관련 문제