Google可视化百分比问题

时间:2020-11-07 07:31:51

标签: javascript charts google-visualization

我无法在jsfiddle中重新创建它,所以这就是我所能提供的。我希望有人仍是我的新手,让我与我联系,而编写此代码的人则从covid那里去世了。 https://imgur.com/a/4ewvXsC

google.charts.load('current', {packages: ['corechart', 'bar']});
google.charts.setOnLoadCallback();

function load_monthwise_data(pos, title)
{
    var temp_title = title + ' '+pos+'';
    $.ajax({
        url:"fetch.php",
        method:"POST",
        data:{pos:pos},
        dataType:"JSON",
        success:function(data)
        {
            drawMonthwiseChart(data, temp_title);
        }
    });
function drawMonthwiseChart(chart_data, chart_main_title)
{
    var jsonData = chart_data;
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Nama Calon');
    data.addColumn('number', 'Jumlah Undian');
    $.each(jsonData, function(i, jsonData){
        var name = jsonData.name;
        var total = parseFloat($.trim(jsonData.total));
        data.addRows([[name, total]]);
    });
    var options = {
        title:chart_main_title,
        hAxis: {
            title: "Nama Calon"
        },
        vAxis: { 
            title: 'Jumlah Undian', 
            format: '#%'
        }
    };

    var chart = new google.visualization.ColumnChart(document.getElementById('chart_area'));
    chart.draw(data, options);
}

百分比值超过100%,并且百分比与总价值相关

1 个答案:

答案 0 :(得分:0)

提供一些帮助有些困难,但是,我会尝试的。在下面,您将找到描述使用Google虚拟化api的链接以及一些用例。

这是我的推测,但看起来条形图值正在动态设置条形大小或长度。因此,如果您有大量数据,则条形图的大小将分别更大。

function drawMonthwiseChart(chart_data, chart_main_title){
  var j = 0;
  var jsonData = chart_data;
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Nama Calon');
  data.addColumn('number', 'Jumlah Undian');
  $.each(jsonData, function(i, jsonData){
    var name = jsonData.name;
    // looks like the issue's coming from here (the total value)
    //var total = parseFloat($.trim(jsonData.total));
    //data.addRows([[name, total]]);
   // Use this, if the total is less than or equal to 100 append data
     var total = parseFloat($.trim(jsonData.total));
     j += 1; // looks like it's counting the number of instead of percentages
     if(j <= 100){
       data.addRows([[name, total]]);
     }
  });
  var options = {
    title:chart_main_title,
      hAxis: {
        title: "Nama Calon"
      },
      vAxis: { 
        title: 'Jumlah Undian', 
        format: '#%'
      }
  };

  var chart = new 
  google.visualization.ColumnChart(document.getElementById('chart_area'));
  chart.draw(data, options);
}

更新看起来像是循环,记录(数据)的数量设置了图表的大小。

资源: