Highcharts - 'null'을 사용하지 않고 0 값 숨기기

Question

두 차트를 사용하여 달성하고자하는 것을 보여 드리고 싶습니다.

이 도넛 형 차트 (http://jsfiddle.net/b749uoto/)에는 'Sony Ericsson'과 'Nintendo'의 두 가지 0 값이 있습니다. 코드는 그 값을 아름답게 숨 깁니다. 심지어 레이블도 나타나지 않습니다.

도넛 차트에 0 값을 숨기는 코드가 책임 :

dataLabels: { 
    formatter: function() { 
    // display only if larger than 1 
     return this.y > 1 ? '<b>' + this.point.name + ':</b> ' + this.y + '%' : null; 
    } 
} 

자,이 3 차원 막대 차트 (http://jsfiddle.net/arqL4ch2/1/가) 위의 도넛 차트와 동일한 데이터를 가지고 있지만 양쪽 모두 0 값이 표시되고있다. 저는 항상이 차트에서 'Sony Ericsson'과 'Nintendo'의 가치가 0이 아닌 첫 인상을 받았습니다.

'null'값을 적용하지 않고이 두 회사를 3 차원 가로 막 대형 차트 (데이터 및 레이블)에서 숨기고 싶습니다. 이렇게하면 회사간에 거대한 빈 공간이 만들어지기 때문입니다.

검색 한 몇 가지 제안을 시도했지만 작동하지 않았습니다. 나는 자바 스크립트 마스터가 아니다.

이것이 가능합니까? 감사.

편집 1 : PHP 또는 SQL 관련 답변을받지 않기 위해 차트 데이터를 가져 오기 위해 PHP를 사용하고 있음을 상기 한 단락을 삭제했습니다. 차트 1에서 같은 동작을 차트 2에 적용하기를 원합니다.이 대답은 일부 Javascript-fu에 의존하고 있다고 생각합니다.

편집 2 : 두 차트 모두에 대해 표시되는 코드가 너무 깁니다. 나는 이것을 제거하고 도넛 형 차트에서 '제로 값 숨기기'부분 만 남겼습니다.

Answer 1

범주 당 하나의 값만 얻으려면 PHP 코드에서 값을 확인할 수 있고 값이 0이면 시리즈 데이터 배열에 값을 추가 할 수 없습니다. 데이터를 생성하는 코드를 보지 않고는 더 구체적 일 수 없습니다. SQL 쿼리를 사용하여 값을 가져 오는 경우 0이 아닌 항목 만 반환 할 수 있습니까? 이 psuedocode 식으로 뭔가 :

SELECT vendor, deviceCount 
FROM devices 
WHERE deviceCount > 0 

나는 몇 가지 테스트를했고, 당신은 차트 자체 내에서 작업을 수행 할 수 있습니다 - 그냥 몇 가지 코드를 수정하지 않고. chart.events.load 후크를 사용

events: { 
     load: function() { 
      var theChart = this; 
      var theSeries = this.series; 
      var removeIndex = []; 
      var weight = 0; 
      for (var key in theSeries) { 
       var aSeries = theSeries[key]; 
       if (aSeries.data[0].y == 0) { 
        removeIndex.push(parseInt(key)); 
       } 
      } 
      for (var i in removeIndex) { 
       var iRemove = removeIndex[i] - weight; 
       theChart.series[iRemove].remove(); 
       weight = weight + 1; 
      } 
     } 
    } 

까다로운 부분은 weight 항목입니다. 인덱싱 된 항목을 제거하면 총 인덱스가 축소됩니다.

대부분이 루프입니다. 이 코드는 매우 장황한 코드 세트이며 매우 작게 축소 할 수 있습니다. 이 코드는 차트의 각 시리즈를 순환하며 시리즈 당 하나의 포인트 만 있다고 가정합니다. 그런 다음 해당 단일 점의 값이 0인지 확인합니다. 일치하는 경우 해당 계열의 인덱스를 removeIndex 배열에 추가합니다. 다음 루프는 removeIndex 배열을 통과하고 실제로 시리즈를 제거합니다. 라이브 demo.