{"id":2055,"date":"2026-07-27T02:31:06","date_gmt":"2026-07-27T02:31:06","guid":{"rendered":"https:\/\/www.vpascode.com\/pl\/docs\/uncategorized\/sankey-chart-directional-flow-and-volume-transitions-guide\/"},"modified":"2026-07-27T02:31:06","modified_gmt":"2026-07-27T02:31:06","slug":"sankey-chart-directional-flow-and-volume-transitions-guide","status":"publish","type":"ld_docs","link":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/","title":{"rendered":"Wykres Sankey\u2019ego: kierunkowe przep\u0142ywy i zmiany obj\u0119to\u015bci"},"content":{"rendered":"

Podczas \u015bledzenia ci\u0105g\u0142ych przep\u0142yw\u00f3w, dystrybucji zasob\u00f3w lub wieloetapowych tras u\u017cytkownik\u00f3w, Wykres Sankey\u2019ego<\/strong> jest najwa\u017cniejszym narz\u0119dziem wizualizacji. Rysuj\u0105c proporcjonalne pasma przep\u0142ywu mi\u0119dzy kolejnymi w\u0119z\u0142ami etap\u00f3w, wykresy Sankey\u2019ego ilustruj\u0105 jak ca\u0142kowite ilo\u015bci dziel\u0105 si\u0119, \u0142\u0105cz\u0105 si\u0119 i przechodz\u0105 przez z\u0142o\u017cone systemy<\/em>\u2014na przyk\u0142ad funele konwersji u\u017cytkownik\u00f3w na stronie internetowej, sieci dystrybucji energii lub alokacje bud\u017cet\u00f3w organizacji.<\/p>\n

Zasada dzia\u0142ania wykres\u00f3w Sankey\u2019ego<\/h2>\n

W Apache ECharts wykresy Sankey\u2019ego u\u017cywaj\u0105 type: 'sankey'<\/code>. Podobnie jak wykresy grafowe, wykres Sankey\u2019ego jest definiowany przez list\u0119 r\u00f3\u017cnych w\u0119z\u0142\u00f3w<\/code> (lub data<\/code>) oraz skierowanych links<\/code> (lub kraw\u0119dzi<\/code>). Ka\u017cde po\u0142\u0105czenie zawiera nazw\u0119 w\u0119z\u0142a \u017ar\u00f3d\u0142a<\/code>w\u0119z\u0142a, nazw\u0119 w\u0119z\u0142a docelowego<\/code>w\u0119z\u0142a i liczb\u0119 warto\u015bci<\/code>kt\u00f3ra okre\u015bla szeroko\u015b\u0107 wizualn\u0105 linii przep\u0142ywu \u0142\u0105cz\u0105cej.<\/p>\n

1. Podstawowa konfiguracja<\/h3>\n

Aby stworzy\u0107 podstawowy wykres Sankey\u2019ego, zadeklaruj swoje elementy w\u0119z\u0142\u00f3w wewn\u0105trz data<\/code> i zdefiniuj obj\u0119to\u015bci skierowanych przep\u0142yw\u00f3w w links<\/code>:<\/p>\n

\n
\nECharts<\/span>
\n
\n<\/path><\/path><\/svg>
\nEdytuj ECharts w VPasCode<\/span>
\n<\/a>\n<\/div>\n
\n
\r\n
\r\n ECharts<\/span>\r\n \r\n <\/path><\/path><\/svg>\r\n Edit ECharts in VPasCode<\/span>\r\n <\/a>\r\n <\/div>\r\n
\r\n 
option = {\r\n    tooltip: {\r\n        trigger: 'item',\r\n        triggerOn: 'mousemove'\r\n    },\r\n    series: [\r\n        {\r\n            type: 'sankey',\r\n            data: [\r\n                { name: 'Ca\u0142kowity przych\u00f3d' },\r\n                { name: 'Sprzeda\u017c produkt\u00f3w' },\r\n                { name: 'Us\u0142ugi' },\r\n                { name: 'Marketing' },\r\n                { name: 'Badania i rozw\u00f3j' },\r\n                { name: 'Zysk' }\r\n            ],\r\n            links: [\r\n                { source: 'Ca\u0142kowity przych\u00f3d', target: 'Sprzeda\u017c produkt\u00f3w', value: 70 },\r\n                { source: 'Ca\u0142kowity przych\u00f3d', target: 'Us\u0142ugi', value: 30 },\r\n                { source: 'Sprzeda\u017c produkt\u00f3w', target: 'Marketing', value: 30 },\r\n                { source: 'Sprzeda\u017c produkt\u00f3w', target: 'Badania i rozw\u00f3j', value: 25 },\r\n                { source: 'Sprzeda\u017c produkt\u00f3w', target: 'Zysk', value: 15 },\r\n                { source: 'Us\u0142ugi', target: 'Zysk', value: 30 }\r\n            ],\r\n            emphasis: {\r\n                focus: 'adjacency'\r\n            },\r\n            lineStyle: {\r\n                color: 'gradient',\r\n                curveness: 0.5\r\n            }\r\n        }\r\n    ]\r\n};<\/code><\/pre>                <\/div>\r\n                
\r\n                    \r\n                        <\/path><\/path><\/svg>\r\n                        Edit ECharts in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n
\n
\n<\/path><\/path><\/svg>
\nEdytuj ECharts w VPasCode<\/span>
\n<\/a>\n<\/div>\n<\/div>\n
\"\"<\/p>\n
\u00a0<\/p>\n
Zaawansowane techniki strukturalne<\/h2>\n
Wykresy Sankey mo\u017cna dostosowa\u0107 do pionowego kierunku przep\u0142ywu, wielopoziomowych kolor\u00f3w w\u0119z\u0142\u00f3w oraz dynamicznego pod\u015bwietlania po\u0142\u0105cze\u0144 w celu \u015bledzenia indywidualnych \u015bcie\u017cek przez skomplikowane sieci.<\/p>\n
1. Kierunek przep\u0142ywu pionowy<\/h3>\n
Ustaw orient: 'vertical'<\/code>aby przekszta\u0142ci\u0107 poziome przep\u0142ywy etap\u00f3w w widok wodospadu od g\u00f3ry do do\u0142u:<\/p>\n
\n
\nECharts<\/span>
\n
\n<\/path><\/path><\/svg>
\nEdytuj ECharts w VPasCode<\/span>
\n<\/a>\n<\/div>\n
\n            
\r\n                                
\r\n                    ECharts<\/span>\r\n                    \r\n                        <\/path><\/path><\/svg>\r\n                        Edit ECharts in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                
\r\n                    
option = {\r\n    tooltip: {\r\n        trigger: 'item',\r\n        triggerOn: 'mousemove'\r\n    },\r\n    series: [\r\n        {\r\n            type: 'sankey',\r\n            orient: 'vertical',\r\n            nodeWidth: 20,\r\n            nodeGap: 16,\r\n            data: [\r\n                { name: 'Odwiedziny strony' },\r\n                { name: 'Strona produktu' },\r\n                { name: 'Bezpo\u015brednie opuszczenie' },\r\n                { name: 'Koszyk' },\r\n                { name: 'Kasa' }\r\n            ],\r\n            links: [\r\n                { source: 'Odwiedziny strony', target: 'Strona produktu', value: 1000 },\r\n                { source: 'Odwiedziny strony', target: 'Bezpo\u015brednie opuszczenie', value: 400 },\r\n                { source: 'Strona produktu', target: 'Koszyk', value: 600 },\r\n                { source: 'Koszyk', target: 'Kasa', value: 450 }\r\n            ],\r\n            lineStyle: {\r\n                color: 'source',\r\n                curveness: 0.5\r\n            }\r\n        }\r\n    ]\r\n};<\/code><\/pre>                <\/div>\r\n                
\r\n                    \r\n                        <\/path><\/path><\/svg>\r\n                        Edit ECharts in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n
\n
\n<\/path><\/path><\/svg>
\nEdytuj ECharts w VPasCode<\/span>
\n<\/a>\n<\/div>\n<\/div>\n
\"\"<\/p>\n
\u00a0<\/p>\n
Dok\u0142adna dostosowanie uk\u0142adu i stylizacji po\u0142\u0105cze\u0144<\/h2>\n
Dostosowanie odst\u0119p\u00f3w w\u0119z\u0142\u00f3w, krzywizny linii oraz zachowania pod\u015bwietlania przy najechaniu zapewnia przejrzysto\u015b\u0107 i czytelno\u015b\u0107 skomplikowanych przep\u0142yw\u00f3w wieloetapowych.<\/p>\n
1. Kontrola odst\u0119p\u00f3w mi\u0119dzy w\u0119z\u0142ami i gradientowe przep\u0142ywy \u017ar\u00f3d\u0142o-cel<\/h3>\n
Dostosowanie nodeGap<\/code> oraz ustawienie lineStyle.color: 'gradient'<\/code>tworzy p\u0142ynne przej\u015bcia kolor\u00f3w mi\u0119dzy etapami:<\/p>\n
\n
\nECharts<\/span>
\n
\n<\/path><\/path><\/svg>
\nEdytuj ECharts w VPasCode<\/span>
\n<\/a>\n<\/div>\n
\n            
\r\n                                
\r\n                    ECharts<\/span>\r\n                    \r\n                        <\/path><\/path><\/svg>\r\n                        Edit ECharts in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                
\r\n                    
option = {\r\n    series: [\r\n        {\r\n            type: 'sankey',\r\n            left: '5%',\r\n            right: '15%',\r\n            nodeWidth: 24,\r\n            nodeGap: 18,\r\n            draggable: true,\r\n            label: {\r\n                position: 'right',\r\n                color: '#333',\r\n                fontSize: 12\r\n            },\r\n            data: [\r\n                { name: '\u0179r\u00f3d\u0142o A', itemStyle: { color: '#5470c6' } },\r\n                { name: '\u0179r\u00f3d\u0142o B', itemStyle: { color: '#91cc75' } },\r\n                { name: 'Etap 1', itemStyle: { color: '#fac858' } },\r\n                { name: 'Etap 2', itemStyle: { color: '#ee6666' } },\r\n                { name: 'Ostateczny wynik', itemStyle: { color: '#73c0de' } }\r\n            ],\r\n            links: [\r\n                { source: '\u0179r\u00f3d\u0142o A', target: 'Etap 1', value: 50 },\r\n                { source: '\u0179r\u00f3d\u0142o B', target: 'Etap 1', value: 30 },\r\n                { source: 'Etap 1', target: 'Etap 2', value: 60 },\r\n                { source: 'Etap 1', target: 'Ostateczny wynik', value: 20 },\r\n                { source: 'Etap 2', target: 'Ostateczny wynik', value: 60 }\r\n            ],\r\n            lineStyle: {\r\n                color: 'gradient',\r\n                curveness: 0.6,\r\n                opacity: 0.4\r\n            }\r\n        }\r\n    ]\r\n};<\/code><\/pre>                <\/div>\r\n                
\r\n                    \r\n                        <\/path><\/path><\/svg>\r\n                        Edit ECharts in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n
\n
\n<\/path><\/path><\/svg>
\nEdytuj ECharts w VPasCode<\/span>
\n<\/a>\n<\/div>\n<\/div>\n
\"\"<\/p>\n
\u00a0<\/p>\n
Strategiczne najlepsze praktyki<\/h2>\n
    \n
  • Zachowaj zasad\u0119 zachowania przep\u0142ywu:<\/strong> Upewnij si\u0119, \u017ce suma warto\u015bci wp\u0142ywaj\u0105cych do w\u0119z\u0142a r\u00f3wna si\u0119 lub logicznie odpowiada warto\u015bciom wychodz\u0105cym, aby unikn\u0105\u0107 myl\u0105cych wizualnych przerw.<\/li>\n
  • W\u0142\u0105cz podkre\u015blenie.fokus: 's\u0105siedztwo'<\/code>:<\/strong>Przy obs\u0142udze przep\u0142yw\u00f3w wielostopniowych skupianie si\u0119 na s\u0105siednich po\u0142\u0105czeniach przy najechaniu pozwala u\u017cytkownikom wyodr\u0119bni\u0107 konkretne \u015bcie\u017cki bez zak\u0142\u00f3ce\u0144 wizualnych.<\/li>\n
  • U\u017cyj po\u0142\u0105cze\u0144 gradientowych:<\/strong> Ustawienie lineStyle.color: 'gradient'<\/code> p\u0142ynnie \u0142\u0105czy kolor w\u0119z\u0142a \u017ar\u00f3d\u0142owego z kolorem w\u0119z\u0142a docelowego, czyni\u0105c przej\u015bcia wielostopniowe wizualnie intuicyjnymi.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"
    Podczas \u015bledzenia ci\u0105g\u0142ych przep\u0142yw\u00f3w, dystrybucji zasob\u00f3w lub wieloetapowych tras u\u017cytkownik\u00f3w, Wykres Sankey\u2019ego jest najwa\u017cniejszym narz\u0119dziem wizualizacji. Rysuj\u0105c proporcjonalne pasma przep\u0142ywu mi\u0119dzy kolejnymi w\u0119z\u0142ami etap\u00f3w, wykresy Sankey\u2019ego ilustruj\u0105 jak ca\u0142kowite ilo\u015bci dziel\u0105 si\u0119, \u0142\u0105cz\u0105 si\u0119 i przechodz\u0105 przez z\u0142o\u017cone systemy\u2014na przyk\u0142ad…<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":20,"template":"","meta":{"inline_featured_image":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}}},"ld_collection":[14],"class_list":["post-2055","ld_docs","type-ld_docs","status-publish","hentry","ld_collection-vpascode-docs"],"yoast_head":"\nECharts Sankey Chart Guide | VPasCode Text to Diagram Tool<\/title>\n<meta name=\"description\" content=\"Visualize energy, financial, or data volume flows using ECharts Sankey charts in VPasCode, a diagram-as-code tool.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"ECharts Sankey Chart Guide | VPasCode Text to Diagram Tool\" \/>\n<meta property=\"og:description\" content=\"Visualize energy, financial, or data volume flows using ECharts Sankey charts in VPasCode, a diagram-as-code tool.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/\" \/>\n<meta property=\"og:site_name\" content=\"VPasCode\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a66c3f3b1539.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Szacowany czas czytania\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minuty\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/\",\"name\":\"ECharts Sankey Chart Guide | VPasCode Text to Diagram Tool\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/img_6a66c3f3b1539.png\",\"datePublished\":\"2026-07-27T02:31:06+00:00\",\"description\":\"Visualize energy, financial, or data volume flows using ECharts Sankey charts in VPasCode, a diagram-as-code tool.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/#breadcrumb\"},\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/img_6a66c3f3b1539.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/img_6a66c3f3b1539.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/vpascode-docs\\\/sankey-chart-directional-flow-and-volume-transitions-guide\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Lean Docs\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/docs\\\/%ld_collection%\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Wykres Sankey\u2019ego: kierunkowe przep\u0142ywy i zmiany obj\u0119to\u015bci\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/#website\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/\",\"name\":\"VPasCode\",\"description\":\"by Visual Paradigm\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pl-PL\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/#organization\",\"name\":\"VPasCode\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/wp-content\\\/uploads\\\/sites\\\/9\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/wp-content\\\/uploads\\\/sites\\\/9\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"width\":128,\"height\":138,\"caption\":\"VPasCode\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/pl\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"ECharts Sankey Chart Guide | VPasCode Text to Diagram Tool","description":"Visualize energy, financial, or data volume flows using ECharts Sankey charts in VPasCode, a diagram-as-code tool.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/","og_locale":"pl_PL","og_type":"article","og_title":"ECharts Sankey Chart Guide | VPasCode Text to Diagram Tool","og_description":"Visualize energy, financial, or data volume flows using ECharts Sankey charts in VPasCode, a diagram-as-code tool.","og_url":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/","og_site_name":"VPasCode","og_image":[{"url":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a66c3f3b1539.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Szacowany czas czytania":"2 minuty"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/","url":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/","name":"ECharts Sankey Chart Guide | VPasCode Text to Diagram Tool","isPartOf":{"@id":"https:\/\/www.vpascode.com\/pl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/#primaryimage"},"image":{"@id":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/#primaryimage"},"thumbnailUrl":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a66c3f3b1539.png","datePublished":"2026-07-27T02:31:06+00:00","description":"Visualize energy, financial, or data volume flows using ECharts Sankey charts in VPasCode, a diagram-as-code tool.","breadcrumb":{"@id":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/"]}]},{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/#primaryimage","url":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a66c3f3b1539.png","contentUrl":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a66c3f3b1539.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.vpascode.com\/pl\/docs\/vpascode-docs\/sankey-chart-directional-flow-and-volume-transitions-guide\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vpascode.com\/pl\/"},{"@type":"ListItem","position":2,"name":"Lean Docs","item":"https:\/\/www.vpascode.com\/pl\/docs\/%ld_collection%\/"},{"@type":"ListItem","position":3,"name":"Wykres Sankey\u2019ego: kierunkowe przep\u0142ywy i zmiany obj\u0119to\u015bci"}]},{"@type":"WebSite","@id":"https:\/\/www.vpascode.com\/pl\/#website","url":"https:\/\/www.vpascode.com\/pl\/","name":"VPasCode","description":"by Visual Paradigm","publisher":{"@id":"https:\/\/www.vpascode.com\/pl\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vpascode.com\/pl\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pl-PL"},{"@type":"Organization","@id":"https:\/\/www.vpascode.com\/pl\/#organization","name":"VPasCode","url":"https:\/\/www.vpascode.com\/pl\/","logo":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/www.vpascode.com\/pl\/#\/schema\/logo\/image\/","url":"https:\/\/www.vpascode.com\/pl\/wp-content\/uploads\/sites\/9\/2026\/06\/cropped-vp-online-logo-v1.png","contentUrl":"https:\/\/www.vpascode.com\/pl\/wp-content\/uploads\/sites\/9\/2026\/06\/cropped-vp-online-logo-v1.png","width":128,"height":138,"caption":"VPasCode"},"image":{"@id":"https:\/\/www.vpascode.com\/pl\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.vpascode.com\/pl\/wp-json\/wp\/v2\/ld_docs\/2055","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vpascode.com\/pl\/wp-json\/wp\/v2\/ld_docs"}],"about":[{"href":"https:\/\/www.vpascode.com\/pl\/wp-json\/wp\/v2\/types\/ld_docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/pl\/wp-json\/wp\/v2\/users\/3"}],"wp:attachment":[{"href":"https:\/\/www.vpascode.com\/pl\/wp-json\/wp\/v2\/media?parent=2055"}],"wp:term":[{"taxonomy":"ld_collection","embeddable":true,"href":"https:\/\/www.vpascode.com\/pl\/wp-json\/wp\/v2\/ld_collection?post=2055"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}