Google chart sankey-- "Cycle found in rows" error

Question

I'm using Google Chart - Sankey Diagram to show flows within the same group of categories A, B, C, D over time. Photo attached.

I want to remove the month and year e.g. "(Dec 2019)", "(Apr 2020)" from my node labels, so that the labels read only "A", "B", "C", "D", and the month/year is printed below the graph for each level of the Sankey. I am unable to do this because when I remove the month/year from the labels, I get a "Cycle found in rows" error.

How can I make a graph which has the same node labels but don't get this error?
How can I add a legend for each level of the Sankey, i.e. the month/year?

Many thanks.

Code:

<html>
<body>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="sankey_multiple" style="width: 900px; height: 300px;"></div>
<script type="text/javascript">
  google.charts.load('current', {'packages':['sankey']});
  google.charts.setOnLoadCallback(drawChart);
   
   function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'From');
    data.addColumn('string', 'To');
    data.addColumn('number', 'Weight');
    data.addRows([
       [ 'A (Aug 2019)', 'A (Dec 2019)', 83.94 ],
       [ 'A (Aug 2019)', 'C (Dec 2019)', 6.94 ],
       [ 'A (Aug 2019)', 'B (Dec 2019)', 6.11  ],
       [ 'A (Aug 2019)', 'D (Dec 2019)', 3.01 ],
       [ 'C (Aug 2019)', 'A (Dec 2019)', 1.29  ],
       [ 'C (Aug 2019)', 'C (Dec 2019)', 83.30 ],
       [ 'C (Aug 2019)', 'B (Dec 2019)', 9.87  ],
       [ 'C (Aug 2019)', 'D (Dec 2019)',  5.54  ],
       [ 'B (Aug 2019)', 'A (Dec 2019)', 1.23 ],
       [ 'B (Aug 2019)', 'C (Dec 2019)', 13.55 ],
       [ 'B (Aug 2019)', 'B (Dec 2019)', 78.79 ],
       [ 'B (Aug 2019)', 'D (Dec 2019)', 6.42 ],
       [ 'D (Aug 2019)', 'A (Dec 2019)', 0.36 ],
       [ 'D (Aug 2019)', 'C (Dec 2019)', 2.08 ],
       [ 'D (Aug 2019)', 'B (Dec 2019)', 1.90 ],
       [ 'D (Aug 2019)', 'D (Dec 2019)', 95.67 ],
       [ 'A (Dec 2019)', 'A (Apr 2020)', 38.3 ],
       [ 'A (Dec 2019)', 'C (Apr 2020)', 21.19 ],
       [ 'A (Dec 2019)', 'B (Apr 2020)', 9.82 ],
       [ 'A (Dec 2019)', 'D (Apr 2020)', 30.69 ],
       [ 'C (Dec 2019)', 'A (Apr 2020)', 4 ],
       [ 'C (Dec 2019)', 'C (Apr 2020)', 55.9 ],
       [ 'C (Dec 2019)', 'B (Apr 2020)', 6.23 ],
       [ 'C (Dec 2019)', 'D (Apr 2020)', 33.87 ],
       [ 'B (Dec 2019)', 'A (Apr 2020)', 3.53 ],
       [ 'B (Dec 2019)', 'C (Apr 2020)', 18.82 ],
       [ 'B (Dec 2019)', 'B (Apr 2020)', 20.31 ],
       [ 'B (Dec 2019)', 'D (Apr 2020)', 57.34 ],
       [ 'D (Dec 2019)', 'A (Apr 2020)', 0.73 ],
       [ 'D (Dec 2019)', 'C (Apr 2020)', 3 ],
       [ 'D (Dec 2019)', 'B (Apr 2020)', 1.65 ],
       [ 'D (Dec 2019)', 'D (Apr 2020)', 94.61 ],
       [ 'A (Apr 2020)', 'A (Aug 2020)', 37.38 ],
       [ 'A (Apr 2020)', 'C (Aug 2020)', 28.90 ],
       [ 'A (Apr 2020)', 'B (Aug 2020)', 22.01 ],
       [ 'A (Apr 2020)', 'D (Aug 2020)', 11.71 ],
       [ 'C (Apr 2020)', 'A (Aug 2020)', 4.26 ],
       [ 'C (Apr 2020)', 'C (Aug 2020)', 68.97 ],
       [ 'C (Apr 2020)', 'B (Aug 2020)', 14.35 ],
       [ 'C (Apr 2020)', 'D (Aug 2020)', 12.41 ],
       [ 'B (Apr 2020)', 'A (Aug 2020)', 3.78 ],
       [ 'B (Apr 2020)', 'C (Aug 2020)', 27.26 ],
       [ 'B (Apr 2020)', 'B (Aug 2020)', 49.72 ],
       [ 'B (Apr 2020)', 'D (Aug 2020)', 18.74 ],
       [ 'D (Apr 2020)', 'A (Aug 2020)', 0.98 ],
       [ 'D (Apr 2020)', 'C (Aug 2020)', 10.15 ],
       [ 'D (Apr 2020)', 'B (Aug 2020)', 10.87 ],
       [ 'D (Apr 2020)', 'D (Aug 2020)', 78 ]
    ]);
    
    var colors = ['#355C7D', '#355C7D', '#6C5B7B', '#C06C84','#F8B195', 
                   '#6C5B7B','#C06C84', '#F8B195', '#355C7D', '#6C5B7B', 
                   '#C06C84','#F8B195', '#355C7D', '#6C5B7B', '#C06C84',
                   '#F8B195'];

    var options = {
      height: 400,
      sankey: {
        node: {
          colors: colors,
          label: { bold: true}
        },
        link: {
          colors: colors,
          colorMode: 'gradient',
          iterations: 0
        }
      }
    };

    // Instantiate and draw our chart, passing in some options.
    var chart = new google.visualization.Sankey(document.getElementById('sankey_multiple'));
    chart.draw(data, options);
   }
   
</script>
</body>
</html>

the only option for the labels I have found is to use a space, or number of spaces, at the end of the label. [here](https://stackoverflow.com/questions/59250950/google-chart-api-set-values-of-node-labels-in-sankey-diagram/59251146#59251146) is an example. as for the legend, there are no standard options for that as well. [here](https://stackoverflow.com/a/36064828/5090771) is an example of creating a custom legend with one of there _core_ charts... — WhiteHat, Oct 02 '20 at 18:23

score 1 · Answer 1 · answered Mar 15 '21 at 15:09

That's because there are repeated categories on both sides once you removed the month label, i.e. self linking.

e.g. you don't want A to link to A in your case after your month label is removed

Here's a line from the docs

Note: Avoid cycles in your data: if A links to itself, or links to B which links to C which links to A, your chart will not render.

Google chart sankey-- "Cycle found in rows" error

1 Answers1