TEST SONDAGE

by jeang

HTML

<script src="http://www.google.com/jsapi?.js"></script>
<div id="info"></div><br>
      <div><button id="question01" style="float:left;">Question 01</button></div>
      <div><button id="question02" style="float:left;">Question 02</button></div>
      <div><button id="etc">etc ...(non actif)</button></div><br>
      <div id="titreGraph"></div><br>
    <div id="dashboard1">
      <div id="control1"> </div><br>
        <div id="wrapper1" style="width: 100%; height: 400px;"></div>
    </div>
    <div id="dashboard2">
      <div id="control2"> </div><br>
        <div id="wrapper2" style="width: 100%; height: 400px;"></div>
    </div>

JavaScript

google.load("jquery", "1.4.2");
google.load('visualization', '1.0', {'packages':['controls']});
google.setOnLoadCallback(drawDashboard);

function drawDashboard() {
  var query = new google.visualization.Query(
      'https://docs.google.com/spreadsheets/d/1apfEk2rTcNPyhpyoQFpuWdsFRsIYphOYau64jlBUFDI/gviz/tq?sheet=TEST&range=A2:S9#');
  query.send(handleQueryResponse);
};

function handleQueryResponse(response) {
  if (response.isError()) {
    alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
    return;
  }

try {

    var data = response.getDataTable();
    var titre0 = data.getColumnLabel(0);
    var titre1 = data.getColumnLabel(1);
    var titre2 = data.getColumnLabel(2);

// Controls
  var filtre01 = new google.visualization.ControlWrapper({
    'controlType': 'NumberRangeFilter',
    'containerId': 'control1',
    'options': {
      'filterColumnLabel': titre1,
    }
  });

  var filtre02= new google.visualization.ControlWrapper({
    'controlType': 'NumberRangeFilter',
    'containerId': 'control2',
    'options': {
      'filterColumnLabel': titre2,
    }
  });

// Charts
  var wrapper1 = new google.visualization.ChartWrapper({ 
    chartType: 'ComboChart',
    dataTable: response.getDataTable(),
    options: {
    // 'title': titre0,
    'seriesType': 'bars',
    'series': {0: {type: 'line', color: '#0000ff', lineWidth: "7", curveType:"function"}}, 
    'chartArea': {left:50,top:50,width:'65%',height:'65%'},
    'animation':{
        duration: 500,
        easing: 'out'
      }},    
  containerId: 'wrapper1'
  });
  wrapper1.draw();

  var wrapper2 = new google.visualization.ChartWrapper({ 
    chartType: 'ComboChart',
    dataTable: response.getDataTable(),
    options: {
    //'title': titre0,
    'seriesType': 'bars',
    'series': {1: {type: 'line', color: '#0000ff', lineWidth: "7", curveType:"function"}}, 
    'chartArea': {left:50,top:50,width:'65%',height:'65%'},
    'animation':{
        duration: 500,
   ...