Google chart api折线图：单位不匹配点

Posted 2023-04-14

【中文标题】Google chart api折线图：单位不匹配点

【英文标题】：Google chart api Line chart: Units don't match points

【发布时间】：2012-07-24 14:27:47

【问题描述】：

我有一个谷歌图表 api 折线图，其中水平轴单位与图表上的对应点不匹配。看图。

我使用了那些确保 h 轴不使用十进制数字的选项：

hAxis:  title: 'some title', format: '#' 

我没有使用其他相关选项，也没有在文档中找到任何似乎可以解决问题的选项..

更新： 生成图表的代码：

var options =  title: '<%# Strings.GameStatisticsView_GameProgressChart %>', hAxis:  title: '<%# Strings.ScoreBoard_RoundNr %>', format: '#' , vAxis:  title: '<%# Strings.Common_Points %>' , backgroundColor:  fill: 'transparent' , elementId: 'GameProgressChart', column1: 'Round Nr' ;
drawLineChart(response.d.Data, options);

...

drawLineChart: function (data, options) 
    var dataTable = new google.visualization.DataTable();
    dataTable.addColumn('number', options.column1);
    for (var j = 0; j < data.key.length; j++) 
        dataTable.addColumn('number', data.key[j]);
    
    dataTable.addRows(data.value.length);
    for (var i = 0; i < data.value.length; i++) 
        dataTable.setValue(i, 0, data.value[i].key);
        for (var k = 0; k < data.key.length; k++) 
            dataTable.setValue(i, k+1, data.value[i].value[k]);
        
    

    var chart = new google.visualization.LineChart(document.getElementById(options.elementId));        
    chart.draw(dataTable, options);   
,

来自 cmets 的解决方案： x 轴上的步骤不能硬编码，但您可以硬编码有多少条网格线，请参阅link。

【问题讨论】：

真的没有人对此一无所知吗？

【参考方案1】：

我怀疑你是否仍然需要这个问题的答案，但如果有人遇到同样的情况..

format: '#' 将值格式强制为 1 位，因此示例中的 3 很可能在 3.3 左右，但由于应用了格式，您只能看到整数部分。

【讨论】：

我实际上仍然有这个问题 - 但从那以后一直没有解决它。但我的数据集只包含 1,2,3,4,5,6,7,8 所以它不有道理..但现在我只是试图删除格式：'#'并且轴上的值更有意义..但我需要为每个数据点或其中一些数据点设置一条线 - 而不是介于两者之间..你知道吗该怎么做？

我可以试试。你能粘贴你用来生成图表的代码吗？

现在我已经添加了生成图表的代码，但是数据来自一个网络服务，所以它不是那么容易显示..如果没有意义，请告诉我..跨度>

嗨 Morten，现在这些值如何更有意义？如果您的 x 轴上只有 1、2、3、4、5、6、7、8，那么无论您使用“#”进行格式化还是根本不进行格式化，我认为都不会产生影响。 x 轴上的步骤不能硬编码，但您可以硬编码要拥有多少条网格线，请参阅link。至于数据，如果没有实际数据很难猜测，但我看到您正在使用 dataTable.setValue(i, 0, data.value[i].key) 为 x 轴分配值，键是值吗？

您是否尝试过绘制数据表而不是图表，看看那里的值是否有意义？