Highcharts 이상한 그룹화 동작

Question

OHLC 데이터를로드하는 데 lazy loading 메서드를 사용하고 있습니다. 서버 측에서는 Python + MySQL을 사용하고 5 분, 1 시간, 1 일, 1 개월의 OHLC 데이터 및 시간 간격으로 4 개의 테이블을 가지고 있습니다. 사실 그것은 잘 작동하지만 불행히도 Highcharts는 이상한 방법으로 촛대를 표시합니다. 특히 초기 로딩시와 줌 사이를 전환 할 때. 초기로드 6h에 차트 초기화

에

1. 그룹화, 24h & 3d가 비활성화되고 촛대 넓은 떨어져 : 다음은 몇 가지 예입니다.

그런 다음에야 또한 처음 올바른지 다음 1w 차트 디스플레이와 같은 시간, 줌 버튼 6h을 클릭 한 후 24h & 3d는 이제 사용할 수 있습니다.

2. 그룹화

나는 범위 선택기 내에서 다음 All을 클릭하면 rangeSelector 버튼

사이 클릭 나는 다음과 같은 화면을 얻을 (이것은 잘못된 것입니다) :

1m을 클릭 한 다음 All을 다시 클릭하면 다음과 같은 올바른 디스플레이가 표시됩니다.

아무도 무슨 일이 일어나고 있는지 아십니까? 미리 많은 감사드립니다! 여기

<script> 
$(function() { 

    function afterSetExtremes(e) { 

     var chart = Highcharts.charts[0];  

     $.getJSON('http://ipaddress/data3?start=' + Math.round(e.min/1000) + 
       '&end=' + Math.round(e.max/1000), function (data) { 

      chart.series[0].setData(data); 
      chart.hideLoading(); 
     }); 
    } 

    //Initially load the biggest data range 
    $.getJSON('http://ipaddress/data3?start=1481897400&end=1486910100', function (data) { 

     // Add a null value for the end date 
     //data = [].concat(data, [[Date.UTC(2011, 9, 14, 19, 59), null, null, null, null]]); 

     // create the chart 
     Highcharts.stockChart('container', { 
      chart: { 
       type: 'candlestick', 
       zoomType: 'x' 
      }, 

      navigator: { 
       adaptToUpdatedData: false, 
       series: { 
        data: data 
       } 
      }, 

      scrollbar: { 
       liveRedraw: false 
      }, 

      rangeSelector: { 
       buttons: [{ 
        type: 'hour', 
        count: 6, 
        text: '6h', 
        dataGrouping: { 
         forced: false, 
         units: [['minute', [15]]] 
        } 
       }, { 
        type: 'hour', 
        count: 24, 
        text: '24h', 
        dataGrouping: { 
         forced: false, 
         units: [['minute', [30]]] 
        } 
       }, { 
        type: 'day', 
        count: 3, 
        text: '3d', 
        dataGrouping: { 
         forced: false, 
         units: [['hour', [2]]] 
        } 
       }, { 
        type: 'day', 
        count: 7, 
        text: '1w', 
        dataGrouping: { 
         forced: false, 
         units: [['hour', [4]]] 
        } 
       }, { 
        type: 'day', 
        count: 30, 
        text: '1m', 
        dataGrouping: { 
         forced: false, 
         units: [['day', [1]]] 
        } 
       }, { 
        type: 'all', 
        text: 'All' 
       }], 
       inputEnabled: false, 
       selected: 3 // Init loading button 
      }, 

      xAxis: { 
       events: { 
        afterSetExtremes: afterSetExtremes 
       }, 
       //minRange: 3600 * 1000 // one hour 
      }, 

      yAxis: { 
       floor: 0 
      }, 

      series: [{ 
       data: data, 
       dataGrouping: { 
        enabled: true 
       } 
      }] 
     }); 
    }); 
}); 

Answer 1

솔루션입니다 :

1

는 다음과 같은 라인을 사용, 초기화 단계에서 그룹화 문제를 해결하려면 차트 초기화 없음 그룹 : 여기에 코드입니다

Highcharts.stockChart('container', { 
    //.... your code ... 
}, function(chart){ 
    chart.rangeSelector.clickButton(1); 
    }); 

여기서 문제는 차트 옵션의 선택된 버튼이 SetExtremes 이벤트를 트리거하지 않았다는 것입니다. r xAxis.

rangeSelector: { 
    buttons: [{ 
     dataGrouping: { 
      forced: false } 
      }] }