10

使用 Google 的 Visualization API,我使用 google.visualization.data.group 根据我的原始数据创建子表。我的原始数据使用 {v:"US", f:"United States"} 的技巧来显示除值之外的其他内容,但是当我使用聚合函数时,格式被消除,只剩下“US”部分。

有什么方法可以保留原始格式,或者有一种简单的方法可以将它重新添加到使用组聚合创建的 DataTables 上?

样本数据:

[2010, {v:"MA", f:"Morocco"}, {v:"002", f:"Africa"}, {v:"002", f:"Northern Africa"}, 21.12724],
[2010, {v:"AW", f:"Aruba"}, {v:"019", f:"Americas  "}, {v:"019", f:"Caribbean"}, 0.98],
[2010, {v:"AF", f:"Afghanistan"}, {v:"142", f:"Asia"}, {v:"142", f:"Southern Asia"}, 0.9861],
[2010, {v:"AO", f:"Angola"}, {v:"002", f:"Africa"}, {v:"002", f:"Middle Africa"}, 5.11774],

聚合功能:

var countryData = google.visualization.data.group(
  rawData, 
  [0, 1], 
  [{'column': 4, 'aggregation': google.visualization.data.sum, 'type': 'number'}]
);

编辑:

进一步考虑,可能不可能用格式分组,因为不能保证每个值的格式都是一致的。考虑到这一点,编写一个将格式添加到我的数据的每一列的函数可能会更好(或唯一可能)。所以问题变成了,“我到底是怎么做到的?”

我真的不想将我的原始数据单独创建为未格式化的值,然后使用其他表格来查找每个值的格式。这将需要额外的 2 个表(一个用于 28 行的区域,一个用于超过 240 行的国家),然后创建两个函数来查看分组表中的每个值(这将具有 30 多年的数据,意味着数千行)添加值。

这似乎是一个非常复杂的解决方案。

有没有办法用修饰函数做到这一点?我可以编写一个函数以将表中的每个值作为 {v: "US", f: "United States"} 格式的对象返回吗?或者有没有一种简单的方法来编写一个列格式化程序,它将在我的原始表中查找适当的值并采用该格式?对于我(谁必须编写它)和用户(谁必须加载它)来说,哪个最不让人头疼?

编辑2:

看起来我应该能够使用以下内容为新表创建格式化程序:

function (dt, row) {
    return {
        v: (dt.getValue(row, 1) / 1000000),
        f: (dt.getValue(row, 1) / 1000000) + 'M'
    }
}

但是问题变成了,因为我不处理数字格式,所以我必须创建某种查找表来获取值,在查找表中查找它,然后返回适当的格式。看起来我可能必须逐行遍历整个表,即数千行。

我无法想象如果没有一些蛮力循环和分配值,就没有一种简单的方法可以做到这一点。

编辑 3:

所以我尝试了一些棘手的事情。我没有将每一行设置为值/格式,而是将值/格式部分创建为字符串,然后在分组后使用 eval() 来评估对象。这很好用。这是数据:

[2010, "{v: 'MA', f: 'Morocco'}", 21.13],
[2010, "{v: 'AW', f: 'Aruba'}", 0.98],
[2010, "{v: 'AF', f: 'Afghanistan'}", 0.99],
[2010, "{v: 'AO', f: 'Angola'}", 5.12],

这是新代码:

  var countryCount = countryData.getColumnRange(0).count;

  for (var i = 0; i <= countryCount; i++) {
    countryData.setValue(i, 1, eval('(' + countryData.getValue(i,1) + ')'));
  };

问题是,当我将其输出到 Google DataTable 时,它​​显示 {v: 'AE', f: 'United Arab Emirates'} 尽管使用 eval 正确检查结果给了我:

>>> eval('(' + countryData.getValue(i,1) + ')')
Object v="AE" f="United Arab Emirates"

那么我在这里做错了什么?

4

2 回答 2

4

好的,我想出了这个(它是多么令人讨厌的复杂)。

我尝试了一种新方法。我重新格式化了我的数据,然后创建了一个函数来根据该字符串中的分隔符返回一个值/格式。所以我的数据现在看起来像这样:

[2010, "'MA'|'Morocco'", 21.13],
[2010, "'AW'|'Aruba'", 0.98],
[2010, "'AF'|'Afghanistan'", 0.99],
[2010, "'AO'|'Angola'", 5.12],

然后我用它来获取第 1 列的分隔符位置:

var countryCount = countryData.getNumberOfRows();

for (var i = 0; i <= countryCount; i++) {
  var stringToSplit = countryData.getValue(i,1);
  var dividerLocation = stringToSplit.indexOf("|");
  alert("Divider: " + dividerLocation + ", String: " + stringToSplit);
  countryData.setValue(i, 1, splitFormat(dividerLocation, stringToSplit));
};

然后我使用这个函数来分割字符串:

  function splitFormat(dividerLocation, stringToSplit) {
    // alert("entered splitFormat Function");
    var stringValue = "";
    var formatValue = "";
    stringValue = stringToSplit.substring(0, dividerLocation);
    formatValue = stringToSplit.substring(dividerLocation + 1)
    alert("v: " + stringValue + ", f: " + formatValue);
    return {
      v: stringValue,
      f: formatValue
    }
      }

问题是我将数据的第 1 列定义为“字符串”,但萤火虫告诉我从 splitFormat() 函数返回的对象是一个对象(因为我想它是一个数组)。即使我使用 av: 和 f: 组件设置原始数据表,它也不想接受返回的数组对象值,因为 FireBug 给了我以下非常有用的建议:

"Error: Type mismatch. Value [object Object] does not match type string in column index 1 (table.I.js,137)"

问题是虽然您可以使用 {v: , f:} 语法定义 DataTable,但您无法将该语法返回到表中,因为该列的值设置为字符串。相反,我使用 DataTable 的“setFormattedValue”属性来解决问题:

  function drawVisualization() {
    var countryTable = new google.visualization.Table(document.getElementById('table'));

    var countryCount = countryData.getNumberOfRows() - 1;

    for (var i = 0; i <= countryCount; i++) {
      var stringToSplit = countryData.getValue(i,1);
      var dividerLocation = stringToSplit.indexOf("|");
      var stringValue = stringToSplit.substring(0, dividerLocation);
      var stringFormat = stringToSplit.substring(dividerLocation + 1);
      countryData.setValue(i, 1, stringValue);
      countryData.setFormattedValue(i, 1, stringFormat);
    };

这正确地为我提供了两者的适当值,即使它对于大型数据集来说有点密集。如果有人知道更简单的方法来做到这一点,那么我会很高兴听到它。

于 2013-01-07T02:14:20.390 回答
2

我自己也遇到了这个问题。我决定使用修饰符将值更改为使用原始数据表的格式化值以查找格式化值。这不是非常有效,但它可以工作并且计算机速度很快。

首先创建一个查找函数:

function getFormatForValue(dataTable, column, value) {

    // we need to spin through column in the dataTable looking
    // for the matching value and then return the formatted value
    var rowcount = dataTable.getNumberOfRows();
    for (var i=0; i<rowcount; i++) {
        if (dataTable.getValue(i, column) === value) {

            // we found it, this will look much better
            return dataTable.getFormattedValue(i, column);    
        }
    }

    // better than nothing
    return value;
}

然后在修饰符中调用它,改变你原来的群呼:

var countryData = google.visualization.data.group(
    rawData, 
    [
     {
      'column': 0,
      'modifier': function(value) { return getFormatForValue(rawData, 0, value); },
      'type': 'string'
     },
     {
      'column': 1,
      'modifier': function(value) { return getFormatForValue(rawData, 1, value); },
      'type': 'string'
     }
    ], 
    [{'column': 4, 'aggregation': google.visualization.data.sum, 'type': 'number'}]
);

更新:您似乎需要保留值和格式化值。在我显示饼图的情况下,我不在乎保留原始值。我想这对你不起作用,但我会把这个答案留给其他可能像我这样更简单的情况的人。

我在这上面又花了几分钟,这里有一个替代方法,它可以复制格式化的值,同时保留原始的单元格值。

创建一个使用查找函数的复制函数:

function copyFormattedValues(oldDataTable, oldColumn, newDataTable, newColumn) {

    var rowcount = newDataTable.getNumberOfRows();
    for (var i=0; i<rowcount; i++) {
        var value = newDataTable.getValue(i, newColumn);
        var formatted = getFormatForValue(oldDataTable, oldColumn, value);
        newDataTable.setFormattedValue(i, newColumn, formatted);
    }

 }

然后在您的情况下,为您要复制的每一列调用一次。

copyFormattedValues(rawData, 0, countryData, 0);
copyFormattedValues(rawData, 1, countryData, 1);

您的源列和目标列是相同的,但在某些情况下它们可能不同。

当然,理想情况下,所有这些都会自动发生。

于 2015-02-11T16:49:06.820 回答