2013-06-18 2 views
2

아래에 플롯 그래프가 있습니다. 라벨이 응축 된 것을 볼 수 있습니다. 모든 레이블이 표시되도록 틱 사이의 너비를 지정하고 싶습니다. 마크 업은 다음과 같습니다 :진드기를 플롯 차트에 놓을 수있는 방법은 무엇입니까?

<!-- Graph HTML --> 
<div id="graph-wrapper"> 
    <div class="graph-info"> 
    <a href="#" id="bars"><span></span></a><a href="#" id="lines" class="active"><span></span> 
    </a> 
    </div> 
    <div class="graph-container"> 
    <div id="graph-lines" style="width: 95%; height: 80%;"> 
    </div> 
    <div id="graph-bars" style="width: 95%; height: 80%;"> 
    </div> 
    </div> 
    <div id="series-check" class="graph-info bottom"> 
    </div> 
</div> 
<!-- end Graph HTML --> 

JS :

var ticks = []; 
    for (var i = 0; i < graphData[0].data.length; i++) { 
     ticks.push(graphData[0].data[i][0]); 
    } 
$.plot($('#graph-lines'), graphData, { 
     series: { 
      points: { 
       show: true, 
       radius: 5 
      }, 
      lines: { 
       show: true 
      }, 
      shadowSize: 0 
     }, 
     grid: { 
      color: '#646464', 
      borderColor: '#fff', 
      borderWidth: 20, 
      hoverable: true 
     }, 
     xaxis: { 
      //tickColor: 'transparent', 
      //tickDecimals: 2, 
      mode: "time", 
      ticks: ticks, 
      timeformat: options["timformat"], // "%h:%M 
      min: new Date(options["GraphMinXValue"]), // min milliseconds from data 
      max: new Date(options["GraphMaxXValue"]) //max milliseconds from data 
     }, 
     yaxis: { 
      min: 0, 
      show: true 
     }, 
     pan: { 

      interactive: true 
     }, 
     zoom: { 

      interactive: false 
     } 
    }); 

Flot graph

정말 윈도우가 다시 크기 조정하지만와 그래프를 다시 크기를 허용 그래프에 비율을 필요

나는 눈금 간격을 자동적으로 그래프를 더 크게 밀어 내고 싶다. 오버플로 : 포함 div에 숨겨져 있고 팬을 사용하여 숨겨진 오버플로를 볼 수 있습니다. 이 문제를 해결할 수있는 방법이 있습니까?

답변

1

문제가 단순히 사라지도록 minTickSize를 선택하는 것이 좋습니다. 그러나 특정 틱 크기, 즉 매시간마다 틱을 사용해야하는 경우 틱을 좌우로 정렬하거나 캔버스 크기를 늘리는 두 가지 해결 방법이 있습니다.

Mark Cote의 flot-tickrotor처럼 Flot은 기본적으로 스 태거 링/앵귤러 진드기를 지원하지 않습니다. 하지만 아직 Flot 0.8-final에서는 작동하지 않습니다.

플롯 크기를 늘리면 Flot은 틱 수에 따라 자동으로 자리 표시자를 늘릴 수 없습니다. 너 스스로 그것을 늘려야 할 것이다. 플롯을 패닝하기 위해 오버플로 : 숨겨진 div를 사용하는 경우 아마도 실제로 사용하려고하는 것과 같은 소리가 navigate plugin입니다.

+0

감사합니다. 나는 현재이 플러그인을 사용하여 컨테이너에 백분율을 적용해야합니다. 그래도이 데이터를 응축하지 않는 그래프가 필요하므로이 div의 백분율 너비를 늘려 일부 논리를 적용하여 300 %라고 말하면서 오버플로를 숨길 수 있지만 라인 사이에 공간을 늘려야 할 수도 있습니다. – CR41G14

관련 문제