如何将字符串中的连续重复值分组并相应地对其进行可视化？

Question

最近，我为团队创建了一个可视化文件，该可视化文件显示了我们网站上前100个最典型的客户旅程：

我在d3上使用了Kerry Rodden的sequence sunburst library。数据只是用连字符和观察到该序列的次数的一组部分组成。这是我的一些数据：

|----------------------------------------|--------------|
| Sections                               | Value        |
|----------------------------------------|--------------|
| shopping-shopping-login-shopping-end   | 34           |
|----------------------------------------|--------------|
| shopping-shopping-end                  | 25           |
|----------------------------------------|--------------|
| login-shopping-shopping-shopping-end   | 12           |
|----------------------------------------|--------------| 

我的团队也希望现在也以表格形式获取信息，我不仅考虑将其显示在表格中，还考虑对某些数据使用类似Google Analytic的方法：

在我的示例中，输出应如下所示：

|----------------------------------------|--------------|
| Sections                               | Value        |
|----------------------------------------|--------------|
| shopping x2 > login > shopping > end   | 34           |
|----------------------------------------|--------------|
| shopping x 2 > end                     | 25           |
|----------------------------------------|--------------|
| login > shopping x 3 > end             | 12           |
|----------------------------------------|--------------| 

您将如何解决此任务？

可以肯定的是，我可以操纵数据以将链转换为所需的输出（作为文本字符串），但是也许有一些库不仅可以操纵数据，而且还可以以更吸引人的方式可视化它（如示例中所示）以上）

修改1： 我开始用JavaScript做到这一点。

第一步是将表中的每个字符串转换为数组：

我发现一个function生成了一个嵌套数组，该数组对原始数组中每个元素的重复进行计数。

var str = "shopping-shopping-coupons-end";
var arr = str.split("-");

function compressArray(original) {
 
	var compressed = [];
	// make a copy of the input array
	var copy = original.slice(0);
 
	// first loop goes over every element
	for (var i = 0; i < original.length; i++) {
 
		var myCount = 0;	
		// loop over every element in the copy and see if it's the same
		for (var w = 0; w < copy.length; w++) {
			if (original[i] == copy[w]) {
				// increase amount of times duplicate is found
				myCount++;
				// sets item to undefined
				delete copy[w];
			}
		}
 
		if (myCount > 0) {
			var a = new Object();
			a.value = original[i];
			a.count = myCount;
			compressed.push(a);
		}
	}
 
	return compressed;
};

console.log(compressArray(arr));

这对于连续链中的元素在另一个元素中断连续序列后不再出现的情况（如我的变量arr）很有用。但是，对于shopping-shopping-login-shopping-end，它将不起作用。在这些情况下，我将需要调整功能以重置计数。

不过，如果您能提出其他解决方案，我会很高兴。