2017-08-04 34 views
1

下面是我的函數使用繪製google.visualization.data.group()google.visualization.data.sum量規圖表。設置變量導致谷歌可視化數據彙總

的工作示例見琴: https://jsfiddle.net/xmcqyuqc/7/

function drawChart() { 

    var urlString = '../Logs/clnLogsSelectingEvents?grade=All&SC=1&CauseSC=3&CutOffDate=01/01/2017'; 

    $.ajax({ 
     type: 'GET', 
     dataType: 'json', 
     contentType: "application/json", 
     //url: urlString,  //I have commented out but this is my original source. 
     success: function (result) { 

      //Create DataTable 
      var data = new google.visualization.DataTable(); 

      //Add Columns 
      data.addColumn('string', 'CW'); 
      data.addColumn('string', 'Business Division'); 
      data.addColumn('string', 'Product'); 
      data.addColumn('number', 'Cost'); 
      data.addColumn('number', 'Quantity'); 
      data.addColumn('number', 'Age (d)'); 
      data.addColumn('string', 'Actual State'); 

      //Add Rows 
      var dataArray = []; 
      //replaced with manual sample data  
      for (i = 0; i < 5; i++) { 
       dataArray.push([  
       'CW' + i, 
       'GS', 
       'line' + i, 
       10, 
       99, 
       99, 
       'state' + i 
       ]);   
      } 
      data.addRows(dataArray); 

      //Create Data View 
      var view = new google.visualization.DataView(data); 
      view.setColumns([1, 3]); 

      //Create Data Aggregation 
      var groupView = google.visualization.data.group(view, [{ 
       column: 0, 
       type: 'string' 
      }], [{ 
       column: 1, 
       aggregation: google.visualization.data.sum, 
       type: 'number' 
      }]); 

      //Options 
      var options = { 
       max: '150'  ///I want to set this based on the result of the aggregation 
      }; 

      //Instantiate and draw chart, passing in options. 
      var chart = new google.visualization.Gauge(document.getElementById('chart_div')); 
      chart.draw(groupView, options); 

    } //END success: function (result) { 
    });  //END $.ajax({ 
}   //END function drawChart() 

我已硬編碼150

var options = { 
    max: '150' 
}; 

我想最大設定的聚集3倍的計算值最大和。

實施例:google.visualization.data.sum返回50 * 3 = 150最大值

我不知道這樣做的最佳方式,並且不能獲得一個變量設置爲所述聚合計算的google.visualization.data.sum值。

將不勝感激從大師們一些幫助!謝謝!

回答

1

google.visualization.data.group返回普通的DataTable class

使用chart methodgetValue獲得分組表值

getValue(rowIndex, colIndex)

在崗組表返回一行,
因此使用下面的方法知道內情的價值...

groupView.getValue(0, 1) 

看到下面的工作片段...

google.charts.load('current', { 
 
    callback: drawChart, 
 
    packages: ['gauge'] 
 
}); 
 

 
function drawChart() { 
 
    //Create DataTable 
 
    var data = new google.visualization.DataTable(); 
 

 
    //Add Columns 
 
    data.addColumn('string', 'CW'); 
 
    data.addColumn('string', 'Business Division'); 
 
    data.addColumn('string', 'Product'); 
 
    data.addColumn('number', 'Cost'); 
 
    data.addColumn('number', 'Quantity'); 
 
    data.addColumn('number', 'Age (d)'); 
 
    data.addColumn('string', 'Actual State'); 
 

 
    //Add Rows 
 
    var dataArray = []; 
 
    //replaced with manual sample data 
 
    for (i = 0; i < 5; i++) { 
 
    dataArray.push([ 
 
     'CW' + i, 
 
     'GS', 
 
     'line' + i, 
 
     10, 
 
     99, 
 
     99, 
 
     'state' + i 
 
    ]); 
 
    } 
 
    data.addRows(dataArray); 
 

 
    //Create Data View 
 
    var view = new google.visualization.DataView(data); 
 
    view.setColumns([1, 3]); 
 

 
    //Create Data Aggregation 
 
    var groupView = google.visualization.data.group(view, [{ 
 
     column: 0, 
 
     type: 'string' 
 
    }], [{ 
 
     column: 1, 
 
     aggregation: google.visualization.data.sum, 
 
     type: 'number' 
 
    }]); 
 

 
    //Options 
 
    var options = { 
 
     max: groupView.getValue(0, 1) 
 
    }; 
 

 
    //Instantiate and draw chart, passing in options. 
 
    var chart = new google.visualization.Gauge(document.getElementById('chart_div')); 
 
    chart.draw(groupView, options); 
 
}
<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>

+0

再次......我感謝你......完美的工作! – cmill