Question

我有两个文本列，如下所示：

现在我需要制作一个如下所示的气泡图：

知道如何使用excel 2016实现这一目标吗？

Answer 1

有一种方法可以使用Javascript来完成此操作。这个语言有很多强大的数据库可用于数据可视化和数据处理。还有一种方法可以使用名为funfun的Excel加载项在Excel中使用它。

我为你编写了一份工作代码：

https://www.funfun.io/1/#/edit/5a7c4d5db8b2864030f9de15

我使用带有嵌入电子表格的在线编辑器来构建此图表。我使用Json文件（设置下面的短/完整文件）将电子表格中的数据转换为我的javascript代码：

{
    "data": "=A1:B18"
}

然后我将它存储在 script.js 中的局部变量中，以便我可以在我将创建的图表中正确使用它们：

var Approaches = []; // list of Approaches
var Contribution = []; // list of contribution
var tmpC = [];

/*
 * Parse your spreadsheet to count how much approaches and contribution there are
 */
for (var x = 1; x < $internal.data.length; x++) {
     if (Approaches.indexOf($internal.data[x][0]) <= -1)
       Approaches.push($internal.data[x][0]);
     if (tmpC.indexOf($internal.data[x][1]) <= -1)
       tmpC.push($internal.data[x][1]);
}

/*
 * sort the array so that other is at the end
 * (remove if you want you don't care about the order, replace 'tmpC' by 'Contribution' above)
 */

for (var t = tmpC.length - 1; t >= 0; t--) 
  Contribution.push(tmpC[t]);

var techniquesIndex = new Array(Contribution.length); // how much of one contribution is made per approach
var total = 0; // total of contribution

var totalPerApproaches = new Array(Approaches.length); //total of contributions for one Approach
for (var z = 0; z < totalPerApproaches.length; z++) {
    totalPerApproaches[z] = 0;
}


var data = []; // data for the chart

  /*
   * Parse your every approach
   */
for (var x = 0; x < Approaches.length; x++) {
    for (var z = 0; z < techniquesIndex.length; z++) {
      techniquesIndex[z] = 0;
    }

  /*
   * Parse your spreadsheet to count the number of contribution in this approach
   */
  for (var y = 0; y < $internal.data.length; y++) {
    if (Approaches.indexOf($internal.data[y][0]) == x) {
      total += 1;
      techniquesIndex[Contribution.indexOf($internal.data[y][1])] += 1;
    }
  }

  for (var c = 0; c < Contribution.length; c++) {
    /*
     * calculate the total of contribution on this approach
    */
    totalPerApproaches[x] += techniquesIndex[c];

    /*
     * removes the values equals to zero off the chart
     * (remove this condition if you want to show the zeros)
    */
    if (techniquesIndex[c] == 0)
      continue;

  /*
   * adds a bubble to the charts with the number of Contribution per Approach
   */
    data.push(
        {
            x: x, // -> index of array Approach[x]
            y: c, // -> index of array Contribution[c]
            z: techniquesIndex[c], // number of contribution[c] in Approach[x]
            name: techniquesIndex[c] // ..
        });
  }
}

$Internal.data是可以通过Json文件访问电子表格中的数据。数组data（最后）将用于创建图表的所有气泡。

我以正确的格式存储数据后，使用名为Highcharts的数据可视化库在 index.html 中创建图表，它为初学者提供了大量示例和良好的文档。您可以选择为图表添加许多选项，最后将数据传递给图表：

series: [{
        data: data // use the data from script.js
    }]

构建图表后，您可以通过粘贴Funfun excel add-in中的网址在Excel中打开它。以下是我的示例：

您可以根据需要添加尽可能多的行，以确保Json文件中的数据范围符合您的需要。

然后您可以以多种格式保存图表：

希望这有帮助！

披露：我是funfun的开发者

创建文本列的气泡图

1 个答案: