2016-09-01 11 views
1

円グラフを正常に生成できました。しかし、私が選択したイベントリスナーを円グラフに追加しようとしていたとき、それはその関数をまったくトリガーしていません。Google Chart:円グラフにselectイベントハンドラを追加するにはどうすればよいですか?

function handlePieChartResponse(response) 
    { 
     if (response.isError()) { 
      alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); 
      return; 
     } 
     var dataTable = response.getDataTable(); 
     if (dataTable.getNumberOfRows() <= 0) { 
      document.getElementById('dummyTableRow').innerHTML = '<span>No data found</span>'; 
      return; 
     } 

     var chartOptions = DEFAULT_PIE_CHART_OPTIONS; 
     //var chartOverallPmmLevelCalculated = new google.visualization.ChartWrapper({ 
      // 'chartType': 'PieChart', 
      // 'containerId': 'chartOverallPmmLevelCalculatedHtml', 
      // options: chartOptions 
     //}); 

     var chartRecentPmmLevelCalculated = new google.visualization.PieChart(document.getElementById('chartOverallPmmLevelCalculatedHtml')); 
     chartRecentPmmLevelCalculated.draw(dataTable, chartOptions); 

     google.visualization.events.addListener(chartRecentPmmLevelCalculated, 'ready', function() { drawPieChart(); }); 
     google.visualization.events.addListener(chartRecentPmmLevelCalculated, 'select', function() { selectHandler(); }); 

     function drawPieChart() { 
      var responseDataTable = response.getDataTable(); 
      var chartDataTable = new google.visualization.DataTable(); 
      chartDataTable.addColumn('string', 'LEVEL'); 
      chartDataTable.addColumn('number', 'SCORE'); 
      var chartDataTableRow = new Array(); 
      var rowCounter; 
      var levelValue; 
      for (rowCounter = 0; rowCounter < responseDataTable.getNumberOfRows() ; rowCounter++) { 
       var seek = 0 * 1; 
       levelValue = responseDataTable.getValue(rowCounter, 0); 
       chartDataTableRow[seek++] = "LEVEL " + levelValue; 
       chartDataTableRow[seek++] = responseDataTable.getValue(rowCounter, 1); 
       chartDataTable.addRow(chartDataTableRow); 
      } 
      chartDataTable.sort([{ column: 1 }]); 
      chartOverallPmmLevelCalculated.setDataTable(chartDataTable); 
      chartOverallPmmLevelCalculated.draw(); 
     } 
     handlePieChartResponse.drawPieChart = drawPieChart; 
    } 

    function selectHandler() { 
     alert("This alert triggered from pie chart"); 
     var selectedItem = chartRecentPmmLevelCalculated.getSelection(); 
     if (selectedItem) { 
      var levelSelected = chartOverallPmmLevelCalculated.getValue(selectedItem.row, 0); 
      alert(levelSelected); 
     } 
    } 

クリックの前後に2つの画像が添付されました。私は一度パイチャートスライスを選択すると警告メッセージを期待していた。しかし、アラートは存在せず、関数呼び出しはトリガされません。

Before ClickAfter Click on the slice

答えて

1

問題はスコープ

selectHandlerに関係しているので、それは

を見つけることができない外機能のhandlePieChartResponse

あるだけhandlePieChartResponse

内側に移動

次に、sのようなイベントを設定しますお...

...addListener(chartRecentPmmLevelCalculated, 'select', selectHandler); 
+0

ありがとうございます。私はいつもこれらの範囲の問題に遭遇する。間違いから学ぶ。 –

関連する問題