2016-08-04 3 views
0

차트에 데이터 테이블을 추가하려고합니다. 동적으로 생성 된 하이 차트에 데이터 테이블을 추가하는 방법

나는 여기에 표시된 구현하려고 : http://jsfiddle.net/highcharts/z9zXM/

을하지만 나를 위해 작동 didnt한다.

내가 하이 차트를 인스턴스화하는 방법 때문에 의심 스럽습니다.

위의 예에서 차트는 Highcharts 개체를 인스턴스화하여 생성됩니다.

내 코드 :이 같은

// data from an ajax call 
$.each(data, function(indicator, questions) { 

      indicator_type = ""; 

      $.each(questions, function(question, value) { 

       dataChartType = "column"; 

       series = []; 

       categories = []; 

       category_totals = {}; 

       if(value.programs == null) { 
        return true; 
       } 

       $.each(value.programs, function(program, body) { 

        total = 0; 

        values = []; 

        $.each(body, function(j, k) { 

         if (categories.indexOf(j) == -1) { 

          categories.push(j); 

          category_totals[j] = 0; 

         } 

         if(k != 0) { 
          values.push(k); 
         } else { 
          values.push(null); 
         } 


         category_totals[j] += parseInt(k, 10); 

         total += k; 


        }); 

        series.push({ 
         data: values, 
         total: total, 
         name: program //question 
        }); 

       }); // eo each program 

       var chartDiv = document.createElement('div'); 

       chartDiv.className = "chart"; 

       $('.charts_wrap').append(chartDiv); 

       $(chartDiv).highcharts({ 
        events: { 
         load: Highcharts.drawTable 
        }, 
        chart: { 
         type: dataChartType 
        }, 
        xAxis: { 
         categories: categories 
        }, 
        legend: { 
         layout: 'vertical', 
         backgroundColor: '#FFFFFF', 
         align: 'right', 
         verticalAlign: 'top', 
         y: 60, 
         x: -60 
        }, 
        tooltip: { 
         formatter: function() { 
          return '<strong>' + this.series.name + '</strong><br/>' + this.x + ': ' + this.y; 
         } 
        }, 
        plotOptions: { 
         line: { 
          connectNulls: true 
         }, 
         column: { 
          stacking: 'normal', 
          dataLabels: { 
           enabled: false, 
           color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white', 
           style: { 
            textShadow: '0 0 3px w' 
           } 
          } 
         } 
        }, 
        series: series, 
        title:{ text: indicator }, 
        subtitle:{ text: question } 
       }); 


      }); // EO each question 

     }); // eo each indicator 

답변

1

인스턴스 highcharts :

$("#container").highcharts({ 
    chart: { 
     type: 'column', 
     events: { 
      load: Highcharts.drawTable 
     }, 
    }, 
    ... 
:

$("#container").highcharts({ ... 

이벤트 옵션은 차트 옵션을 내부에 포함되어야

관련 문제