Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Browser become unresponsive when sankey chart is generated with specific data #6555

Closed
lisachristina1234 opened this issue Aug 30, 2017 · 10 comments
Closed

Browser become unresponsive when sankey chart is generated with specific data #6555

lisachristina1234 opened this issue Aug 30, 2017 · 10 comments
Labels
enhancement

Comments

@lisachristina1234
Copy link

lisachristina1234 commented Aug 30, 2017 •
edited by pissang
Loading

Summary : Sankey chart is not generating for following option data.

Version & Environment

  • ECharts version : 3
  • Browser version: Version 59.0.3071.115 (Official Build) (64-bit)
  • OS Version: Ubuntu 16.04

Expected behaviour :
Sankey chart should be generated with the given data.
I am not able to find what is special in this data which is why sankey chart is not generating.
Its not too much data and even not creating more than 100 links or nodes.
I hope echarts team would soon figure out why chart is not generating.
Thanks in advance.

ECharts option

option = {
"series" : [
{
  "type": "sankey",
  "right": 130,
  "layout": "none",
  "data": [
    {
      "name": "Key Mess _2",
      "displayName": "Key Mess _2",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(24,129,126,255)",
          "borderColor": "rgba(24,129,126,255)"
        }
      },
      "value": 81.0
    },
    {
      "name": "Field _2",
      "displayName": "Field _2",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(239,198,53,255)",
          "borderColor": "rgba(239,198,53,255)"
        }
      },
      "value": 21.0
    },
    {
      "name": "11/03/2014",
      "displayName": "11/03/2014",
      "dimName": "Date",
      "measureName": "SUM(ID)",
      "value": 66.0
    },
    {
      "name": "Fielld _1",
      "displayName": "Fielld _1",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(226,141,43,255)",
          "borderColor": "rgba(226,141,43,255)"
        }
      },
      "value": 38.0
    },
    {
      "name": "Key Mess _1",
      "displayName": "Key Mess _1",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(179,148,48,255)",
          "borderColor": "rgba(179,148,48,255)"
        }
      },
      "value": 59.0
    },
    {
      "name": "10/03/2014",
      "displayName": "10/03/2014",
      "dimName": "Date",
      "measureName": "SUM(ID)",
      "value": 69.0
    },
    {
      "name": "Legal",
      "displayName": "Legal",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(81,160,158,255)",
          "borderColor": "rgba(81,160,158,255)"
        }
      },
      "value": 26.0
    },
    {
      "name": "13/03/2014",
      "displayName": "13/03/2014",
      "dimName": "Date",
      "measureName": "SUM(ID)",
      "value": 110.0
    },
    {
      "name": "Contact",
      "displayName": "Contact",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(81,160,158,255)",
          "borderColor": "rgba(81,160,158,255)"
        }
      },
      "value": 4.0
    },
    {
      "name": "Services _2",
      "displayName": "Services _2",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(63,127,166,255)",
          "borderColor": "rgba(63,127,166,255)"
        }
      },
      "value": 5.0
    },
    {
      "name": "08/03/2014",
      "displayName": "08/03/2014",
      "dimName": "Date",
      "measureName": "SUM(ID)",
      "value": 7.0
    },
    {
      "name": "JobBoard",
      "displayName": "JobBoard",
      "dimName": "Step 1",
      "measureName": "SUM(ID)",
      "value": 66.0
    },
    {
      "name": "Solutions",
      "displayName": "Solutions",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(226,117,96,255)",
          "borderColor": "rgba(226,117,96,255)"
        }
      },
      "value": 3.0
    },
    {
      "name": "07/03/2014",
      "displayName": "07/03/2014",
      "dimName": "Date",
      "measureName": "SUM(ID)",
      "value": 21.0
    },
    {
      "name": "Blog Search _1",
      "displayName": "Blog Search _1",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(234,171,97,255)",
          "borderColor": "rgba(234,171,97,255)"
        }
      },
      "value": 27.0
    },
    {
      "name": "Accueil",
      "displayName": "Accueil",
      "dimName": "Step 1",
      "measureName": "SUM(ID)",
      "value": 241.0
    },
    {
      "name": "12/03/2014",
      "displayName": "12/03/2014",
      "dimName": "Date",
      "measureName": "SUM(ID)",
      "value": 154.0
    },
    {
      "name": "Blog",
      "displayName": "Blog",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(163,54,34,255)",
          "borderColor": "rgba(163,54,34,255)"
        }
      },
      "value": 29.0
    },
    {
      "name": "Link",
      "displayName": "Link",
      "dimName": "Link",
      "measureName": "SUM(ID)",
      "value": 435.0
    },
    {
      "name": "News _1",
      "displayName": "News _1",
      "dimName": "Step 2",
      "measureName": "SUM(ID)",
      "itemStyle": {
        "normal": {
          "color": "rgba(82,170,221,255)",
          "borderColor": "rgba(82,170,221,255)"
        }
      },
      "value": 6.0
    },
    {
      "name": "09/03/2014",
      "displayName": "09/03/2014",
      "dimName": "Date",
      "measureName": "SUM(ID)",
      "value": 8.0
    },
    {
      "name": "Company _1",
      "displayName": "Company _1",
      "dimName": "Step 1",
      "measureName": "SUM(ID)",
      "value": 47.0
    }
  ],
  "links": [
    {
      "source": "Accueil",
      "target": "Key Mess _2",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Key Mess _2",
      "value": 12.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Key Mess _2",
      "target": "JobBoard",
      "sourceDisplayName": "Key Mess _2",
      "targetDisplayName": "JobBoard",
      "value": 29.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "10/03/2014",
      "target": "Link",
      "sourceDisplayName": "10/03/2014",
      "targetDisplayName": "Link",
      "value": 69.0,
      "sourceName": "Date",
      "targetName": "Link",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Link",
      "target": "JobBoard",
      "sourceDisplayName": "Link",
      "targetDisplayName": "JobBoard",
      "value": 66.0,
      "sourceName": "Link",
      "targetName": "Step 1",
      "measureName": "SUM(ID)"
    },
    {
      "source": "11/03/2014",
      "target": "Link",
      "sourceDisplayName": "11/03/2014",
      "targetDisplayName": "Link",
      "value": 66.0,
      "sourceName": "Date",
      "targetName": "Link",
      "measureName": "SUM(ID)"
    },
    {
      "source": "09/03/2014",
      "target": "Link",
      "sourceDisplayName": "09/03/2014",
      "targetDisplayName": "Link",
      "value": 8.0,
      "sourceName": "Date",
      "targetName": "Link",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "News _1",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "News _1",
      "value": 6.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Blog Search _1",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Blog Search _1",
      "value": 27.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Company _1",
      "target": "Blog",
      "sourceDisplayName": "Company _1",
      "targetDisplayName": "Blog",
      "value": 14.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "13/03/2014",
      "target": "Link",
      "sourceDisplayName": "13/03/2014",
      "targetDisplayName": "Link",
      "value": 110.0,
      "sourceName": "Date",
      "targetName": "Link",
      "measureName": "SUM(ID)"
    },
    {
      "source": "07/03/2014",
      "target": "Link",
      "sourceDisplayName": "07/03/2014",
      "targetDisplayName": "Link",
      "value": 21.0,
      "sourceName": "Date",
      "targetName": "Link",
      "measureName": "SUM(ID)"
    },
    {
      "source": "12/03/2014",
      "target": "Link",
      "sourceDisplayName": "12/03/2014",
      "targetDisplayName": "Link",
      "value": 154.0,
      "sourceName": "Date",
      "targetName": "Link",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Link",
      "target": "Accueil",
      "sourceDisplayName": "Link",
      "targetDisplayName": "Accueil",
      "value": 241.0,
      "sourceName": "Link",
      "targetName": "Step 1",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Services _2",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Services _2",
      "value": 5.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Contact",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Contact",
      "value": 4.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "JobBoard",
      "target": "Accueil",
      "sourceDisplayName": "JobBoard",
      "targetDisplayName": "Accueil",
      "value": 66.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Key Mess _1",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Key Mess _1",
      "value": 7.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "08/03/2014",
      "target": "Link",
      "sourceDisplayName": "08/03/2014",
      "targetDisplayName": "Link",
      "value": 7.0,
      "sourceName": "Date",
      "targetName": "Link",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Company _1",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Company _1",
      "value": 20.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Key Mess _2",
      "target": "Key Mess _1",
      "sourceDisplayName": "Key Mess _2",
      "targetDisplayName": "Key Mess _1",
      "value": 52.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Link",
      "target": "Company _1",
      "sourceDisplayName": "Link",
      "targetDisplayName": "Company _1",
      "value": 47.0,
      "sourceName": "Link",
      "targetName": "Step 1",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Blog",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Blog",
      "value": 15.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Field _2",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Field _2",
      "value": 21.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Fielld _1",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Fielld _1",
      "value": 38.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Solutions",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Solutions",
      "value": 3.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Company _1",
      "target": "Key Mess _2",
      "sourceDisplayName": "Company _1",
      "targetDisplayName": "Key Mess _2",
      "value": 33.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Link",
      "target": "Key Mess _2",
      "sourceDisplayName": "Link",
      "targetDisplayName": "Key Mess _2",
      "value": 81.0,
      "sourceName": "Link",
      "targetName": "Step 1",
      "measureName": "SUM(ID)"
    },
    {
      "source": "Accueil",
      "target": "Legal",
      "sourceDisplayName": "Accueil",
      "targetDisplayName": "Legal",
      "value": 26.0,
      "sourceName": "Step 1",
      "targetName": "Step 2",
      "measureName": "SUM(ID)"
    }
  ],
  "lineStyle": {
    "normal": {
      "color": "source",
      "curveness": 0.5
    }
  },
  "itemStyle": {
    "normal": {
      "color": "#1f77b4",
      "borderColor": "#1f77b4"
    }
  }
}
]
}
@jarben
Copy link
Contributor

jarben commented Aug 30, 2017

I'd say there is a bit of a recursion going on in links, not sure whether this could be prevented by echarts? An error thrown to console saying which link causes this would be awesome:)

@lisachristina1234
Copy link
Author

lisachristina1234 commented Sep 1, 2017 •
edited
Loading

Hi @jarben,

Browser become inactive and shows nothing in browser console/log.

@Ovilia
Copy link
Contributor

Ovilia commented Sep 1, 2017

@lisachristina1234 Here's how you can test it:

  1. Delete some data each time and check if it works
  2. If you find the data that may cause the difference, check if there's a circle or anything strange with that data
  3. Draw the relationship of the data if you can't find anything else.

You see, there's much you can do to debug it, rather than providing the whole data and hoping for someone to save your time.
Wish you good luck! :)

@lisachristina1234
Copy link
Author

Hi @Ovilia
Thanks for suggestion.
I have already tried this. I have almost 2500 records among which I have provided json/option for 30 records only for which chart is not generating too. FYI, I have another excel containing around 4000 records but sankey is getting generated properly for that data set.
See this file for which sankey chart is not generating :
SankeyNotGenerated.xlsx
Using above dataset I have formed option by having links in fields like Date --> Link --> Step 1 -->| Step 2 (Note that Date is truncated to Year only).

See following file for which chart is generating even the content of this file is more than SankeyNotGenerated.xlsx :
DMart.xlsx
Using above dataset I have formed option by having links in fields like City --> Country --> Region --> Segment

@Ovilia
Copy link
Contributor

Ovilia commented Sep 5, 2017

@lisachristina1234 Hi, sorry I didn't quite understand what's your conclusion or observation here after these attempts?

@lisachristina1234
Copy link
Author

Hi @Ovilia,
Manually I am able to draw Sankey with 30 records of data, but not able to understand why echarts unable to draw it even if there are no direct cycles exist between nodes.

@deqingli deqingli self-assigned this Mar 7, 2018
@deqingli
Copy link
Member

Hello @lisachristina1234, this problem is caused by the existence of cycles in the original input data. The sankey diagram theoretically only supports Directed Acyclic Graph (DAG), so the former layout algorithm treats input data as the directed acyclic graph as default, when there is a cycle, it fall into an infinite loop. The modified layout algorithm will traverse the node to calculate the layout in topological order. If the cycle is judged, it will report an error and will not be drawn.

@deqingli
Copy link
Member

The revised function will be released with the next version, Welcome to verify, If you have any questions, you can reopen this issue. ~ with the best regard!

@cliffordfajardo
Copy link

cliffordfajardo commented Apr 5, 2023 •
edited
Loading

The revised function will be released with the next version

@deqingli - what is the name of the new setting that supports cycles in the sankey diagram? or am I misterpreting your last comment - thanks!

@cxone-petr-svarc
Copy link

@cliffordfajardo It does not support it, it just returns the error instead of falling into an infinite loop.

@Deohgu Deohgu mentioned this issue Jan 12, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
7 participants
@jarben @Ovilia @pissang @cliffordfajardo @deqingli @lisachristina1234 @cxone-petr-svarc