2013-03-21 5 views
1

기본 플롯 그래프에서 라벨 작업을 수행하지 못했지만 기본 사항을 제거했지만 여전히 작동하지 않습니다.flot axisLabel not working

<div id="graph" style="width:600px;height:300px;"></div> 

<script type="text/javascript"> 
$(function() { 
    var d1 = [[0, 13], [1, 13], [2, 13], [3, 0], [4, 17], [5, 17], [6, 13]]; 

    $.plot($("#graph"), [ 
     { 
      data: d1, 
      bars: { 
       show: true 
      }, 
      xaxis: { 
       axisLabel: 'Hops' 
      }, 
      yaxis: { 
       axisLabel: 'Traceroute' 
      } 
     } 
    ]); 

}); 
</script> 

다음은 현재 그래프입니다. 보시다시피 Chrome 디버그 창에 오류가 없습니다. 나는 서식 설정도 포함되어 다음과 같은 간단한 축 레이블이했지만 여전히 작동하지 않을 것입니다 :

  axisLabelUseCanvas: true, 
      axisLabelFontSizePixels: 12, 
      axisLabelFontFamily: 'Verdana, Arial, Helvetica, Tahoma, sans-serif', 
      axisLabelPadding: 5 

enter image description here

+0

; 어떤 버전을 사용하고 있습니까? – DNS

+0

@DNS 죄송합니다. https://github.com/xuanluo/flot-axislabels를 사용 중입니다. – jwbensley

+0

이미 문제가 해결되었지만 어떤 경우에는 https : // github을 시도 할 수 있습니다. .com/markrcote/flot-axislabels. 이것은 Mark Cote의 버전입니다. Xuanluo 's를 기반으로하지만, 그는 그것을 정리하고 더 개선했다. – DNS

답변

1

나는, 더 복잡하여 나는이 문제를 해결 한 방법 아무 생각이 없지만, 있다. 버그일까요?

는 이제이 코드와 함께 작동 : 거기에 몇 가지 축 레이블 플러그인이 있습니다

<div id="graph" style="width:600px;height:300px;"></div> 

<script type="text/javascript"> 
$(function() { 
    var d1 = [[0, 13]]; 
    var d2 = [[1, 13]]; 
    var d3 = [[2, 13]]; 
    var d4 = [[3, 30]]; 
    var d5 = [[4, 17]]; 
    var d6 = [[5, 17]]; 
    var d7 = [[6, 13]]; 

    var data1 = [ 
     { 
      data: d1, 
      bars: { 
       show: true, 
       fillColor: "#CAFFD8" 
      }, 
      color: "#CAFFD8" 
     }, 
     { 
      data: d2, 
      bars: { 
       show: true, 
       fillColor: "#CAFFD8" 
      }, 
      color: "#CAFFD8" 
     }, 
     { 
      data: d3, 
      bars: { 
       show: true, 
       fillColor: "#CAFFD8" 
      }, 
      color: "#CAFFD8" 
     }, 
     { 
      data: d4, 
      bars: { 
       show: true, 
       fillColor: "#FF7575" 
      }, 
      color: "#FF7575" 
     }, 
     { 
      data: d5, 
      bars: { 
       show: true, 
       fillColor: "#FFFF75" 
      }, 
      color: "#FFFF75" 
     }, 
     { 
      data: d6, 
      bars: { 
       show: true, 
       fillColor: "#FFFF75" 
      }, 
      color: "#FFFF75" 
     }, 
     { 
      data: d7, 
      bars: { 
       show: true, 
       fillColor: "#CAFFD8" 
      }, 
      color: "#CAFFD8" 
     }, 
    ]; 

    $.plot($("#graph"), data1, { 
      xaxis: { 
       axisLabel: 'Hops', 
       axisLabelUseCanvas: true, 
       axisLabelFontSizePixels: 12, 
       axisLabelFontFamily: 'Verdana, Arial, Helvetica, Tahoma, sans-serif', 
       axisLabelPadding: 5 
      }, 
      yaxis: { 
       min: 0, 
       max: 30, 
       axisLabel: 'Traceroute', 
       axisLabelUseCanvas: true, 
       axisLabelFontSizePixels: 12, 
       axisLabelFontFamily: 'Verdana, Arial, Helvetica, Tahoma, sans-serif', 
       axisLabelPadding: 5 
      } 
     }); 

}); 
</script> 

enter image description here

+2

원래는 그래프 옵션을 데이터 객체 안에 넣었 기 때문입니다. 두 번째 버전에서는'$ .plot ([data], {options})'호출에 대한 첫 번째 인수에는 데이터 시리즈가 있고 두 번째 그래프에는 그래프 옵션이 있습니다. – Ryley

+0

@Ryley 내가 무슨 월리 였어. 감사! :) – jwbensley