how to set width dynamically for column in barformat in table chart

how to set width dynamically for column in barformat in table chart

HarishGHarishG Posts: 2Questions: 1Answers: 0

</style>

<

script type="text/javascript">
var no_of_stud=0;
var quiz_id ='${quiz.id}';
google.load("visualization", "1.1", {packages:["table","corechart"]});
google.setOnLoadCallback(drawTable);
google.setOnLoadCallback(drawChart);
function drawTable() {

          var jsonData = $.ajax({
                url: "https://tracker.siminsights.com/pyrest/api/quizstudents?quizid="+quiz_id+"",
                type: 'GET',  
                dataType: "json",
                success: function(result){                      
                     var data = new google.visualization.DataTable();
                      data.addColumn('string', 'Student Name');
                    data.addColumn('number', 'Progress');
                    data.addColumn('number', 'Score');
                  var student_name=new Array();
                var progress=new Array();
              //var progress1 = result[0].value.progress;
              var fulscore=0;
              $.each(result.userScore,function(key,val){
                student_name.push(key);
                var score=(val/result.totalQues)*100;
                progress.push(score);
                 data.addRows([[key,{v: result.totalQues, f:val+'/'+result.totalQues},+score.toFixed(0)],]); 
                /* data.addRows([[student_name , progress1,score],]); */
              });
                var table = new google.visualization.Table(document.getElementById('table_div'));

                var formatter = new google.visualization.BarFormat({width: 300, colorPositive:"green"});
                formatter.format(data, 1);
                formatter = new google.visualization.BarFormat({width: 300,colorPositive:"green"});                 
                formatter.format(data, 2);                  
                table.draw(data, {showRowNumber: true, width: '100%', height: 'auto',allowHtml: true,cssClassNames: {headerRow:'columnTitle', /*  tableCell: 'customChartStyle' */ }});

            //teacher dashboard code                 
           //teacher dashboard 
          //Create New Option.
        for(var i=0;i<student_name.length;i++){
            var newOption = $('<option>');
            newOption.attr('value',student_name[i]).text("Student " +(i+1));
            // Append that to the DropDownList.
            $('#selectUser').append(newOption);
        } 
        $('#selectUser').click(function(){
            var studId=$( "#selectUser option:selected" ).text();
            var studVal=$( "#selectUser option:selected" ).val();
            document.getElementById("student_id").innerHTML = studId ;
            document.getElementById("student_name").innerHTML = studVal ;
        }) 

             }
          });
  }

Answers

  • HarishGHarishG Posts: 2Questions: 1Answers: 0

    I want to set barformat value as per required progress and score.

This discussion has been closed.