2014-11-28 4 views
2

내 프로젝트에서 하이 차트를 사용하고 있으며 x 축에서 날짜가 두 번 표시됩니다. 어떻게 제거하고 x 축에서 하나의 날짜 만 가져올 수 있습니까? 여기 하이 차트 x 축 레이블에 이중 날짜가 표시됩니다

는 지금 enter image description here

내가 이중 날짜 표시를 제거 할 수 있습니다 방법과 같은 방법의 스냅 샷입니다.

편집 : 차트

에 대한 옵션을 추가 이들은 당신이 내에서 여러 날짜 또는 여러 틱이 때 일반적으로 발생

chart: { 
      renderTo: divId, 
      type: 'column' 
     }, 
     title: { 
      text: chartTitle 
     }, 
     tooltip: { 
      shared: true 
     }, 
     plotOptions: { 
      column: { 
       stacking: 'normal', 
       dataLabels: { 
        enabled: true, 
        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white', 
        style: { 
         textShadow: '0 0 3px black, 0 0 3px black' 
        } 
       } 
      } 
     }, 
     xAxis: { 
      type: 'datetime', 

      labels: { 
       format: '{value:%Y-%m-%d}', 

       rotation: 45, 
       align: 'left' 
      }, 

      title: { 
       text: 'Date' 
      } 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: '' 
      }, 
      max: 1440, 
      stackLabels: { 
       enabled: false 

      } 
     }, 
     legend: { 
        backgroundColor: 'rgba(211,223,181,0.6)', 
        layout: 'vertical', 
        align: 'left', verticalAlign: 'top', 
        floating: true, 
        borderWidth: 0, x: 70 
     } 
+1

코드를 입력하면 매우 유용 할 것입니다. –

+1

일반적으로 'tickInterval'값이 축 레이블에 지정된 날짜 형식보다 작기 때문에 발생합니다. – chridam

+0

내가 사용하는 옵션을 포함하도록 질문을 업데이트했습니다. – progrAmmar

답변

2

을 사용하고있는 옵션은 같은 날/주/월 등을 반환하고 포맷터는 일/주/월 만 반환하도록 설정됩니다.

xAxis: { 
     type: 'datetime', 
     tickInterval: 3600*1000, 
     dateTimeLabelFormats: { 
      second: '%Y-%m-%d<br/>%H:%M:%S', 
      minute: '%Y-%m-%d<br/>%H:%M', 
      hour: '%Y-%m-%d<br/>%H:%M', 
      day: '%Y-%m-%d', 
      week: '%Y-%m-%d', 
      month: '%Y-%m', 
      year: '%Y' 
     }, 
     labels: { 
      /*formatter: function() { 
       console.log(this);      
      },*/ 
      rotation: 45, 
      align: 'left'     
     }, 
     title: { 
      text: 'Date' 
     } 
    } 
0 점을 값으로 지정하십시오.

x 축에서 하루를 반환하도록 차트에 알리고 tickInterval을 매시간 사용하는 경우 해당 날의 모든 틱에는 동일한 레이블이 지정됩니다.

+1

감사합니다. tickInterval : 7200 * 10000 트릭을 수행했습니다. – progrAmmar

관련 문제