sankey diagrams 01

Szemléltess látványos áramlásokkal – avagy Sankey-diagramot egyszerűen!

Megmutatom Neked, hogy hogyan tudsz Sankey-diagramt készíteni, mellyel az eddigieknél sokkal szemléletesebben fogod tudni ábrázolni, amit szeretnél!
megosztás
küldés

A folyamat-ábrákból Dunát lehet rekeszteni, van viszont egy típus, ami kitűnik mind közül, ez pedig nem más, mint a Sankey diagram.

Mire jó a Sankey diagram?

Nem is kell hogy nagyon túlgondoljuk: ha bármilyen anyag/információ, vagy bármiféle tárgy vagy közeg áramlását úgy akarjuk ábrázolni úgy, hogy az egymásból történő következések, és az egymáshoz viszonyított arányok és eloszlások egyértelműek legyenek, akkor érdemes az említett diagramhoz nyúlnunk.

Sankey - Energia áramlásának ábrázolása
Sankey – Energia áramlásának ábrázolása

Legyen szó akár a belső égésű motorban lezajló Energiaáramlásról, a Tesla akkumlátorok gyártási költségeiről, az embercsoportok kontinensek közötti áramlásáról, a kőolaj napjainkra gyakorolt hatásáról, az ausztrál gazdaság vasfelhasználásáról, vagy az emberek mobilapplikációs használati szokásának modellezéséről, vagy a bankszámláinkon áramló pénzösszegekről, kb MINDENRE lehet Sankey diagramot gyártani, ezért mutatnék is 1-2 példát.

Minta Sankey-digagramok

Sankey - Mobilappot használók interakciói
Sankey – Mobilappot használók interakciói
Sankey - Az ausztrál gazdaság 2012 és 2013 közötti fémfelhasználása
Sankey – Az ausztrál gazdaság 2012 és 2013 közötti fémfelhasználása
Sankey - A kőolaj életünkben betöltött szerepe
Sankey – A kőolaj életünkben betöltött szerepe

Hogyan lehet nekem ilyenem?

A Sankey diagramokkal nagyon szemléletesen lehet dolgokat ábrázolni, problémákra rámutatni, így ha az fordult meg a fejedben, hogy jó lenne, ha Te is tudnál ilyet készíteni, akkor nem vagy egyedül.

A közelmúltban találtam egy nagyon jól használható, egyszerű megoldás, melyhez nincs szükség semmiféle fizetős szoftverre, és bonyolult dolgok elsajátítására sem: Egy Google Sheetsben (a Google böngészőben futó táblázatkezelője) létrehozott makró segítéségével, egy egyszerű táblázatba történő adatfelvitellel 2 klikkel lehet Sankey-diagramot készíteni – ehhez mindösszesen csak egy Google fiókra lesz szükséged.

A módszer részletes bemutatója

  1. Nyisd meg a Google Drive fiókodat
  2. Hozz létre egy új táblázatot
  3. Eszközök menü / Szkirptszerkesztő

4. Két fájl létrehozására lesz szükség (code.gs és index.html), mutatom is, hogy hogyan kell kinéznie a végeredménynek, a képek alatt pedig rendelkezésre bocsájtom a kódot, melyet be kell tudnod másolni.

Sankey Google Sheetsben - code.gs
Sankey Google Sheetsben – code.gs

Az első bemásolandó szkript (code.gs)

function onOpen() {
    SpreadsheetApp.getUi()
        .createAddonMenu()
        .addItem('[envisioner.hu]', 'openDialog')
        .addToUi();
}

function getSpreadsheetData() {
    var sheet = SpreadsheetApp.getActive().getSheets()[0];
    var data = sheet.getDataRange().getValues();
    return data;
}

function openDialog() {
    var html = HtmlService.createHtmlOutputFromFile('index')
        .setHeight(300)
        .setWidth(1000);
    SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
        .showModalDialog(html, '[envisioner.hu]');
}
Sankey Google Sheetsben - index.html
Sankey Google Sheetsben – index.html

A második bemásolandó szkript (index.html)

<!DOCTYPE html>
<html>
   <head>
      <base target="_top">
      <script src="https://www.google.com/jsapi"></script>
   </head>
   <body>
      <div id="main"></div>
      <script type="text/javascript">
         google.load('visualization', '1', {
           packages: ['corechart', 'sankey']
         });      google.setOnLoadCallback(initialize);
           
           function initialize() {
            google.script.run.withSuccessHandler(drawChart).getSpreadsheetData();
           }
           
           function drawChart(rows) {
             console.log(rows);
             var data = google.visualization.arrayToDataTable(rows);
             var chart = new google.visualization.Sankey(document.getElementById('main'));
             chart.draw(data, {width: 900, sankey: {iterations: 64}});
           }
      </script>
   </body>
</html>

5. Ha ezekkel megvagyunk, klikkeljünk a projekt mentése gombra. A szkriptszerkesztőt bezárva a következőképpen kell feltöltenünk a táblázatunkat adatokkal:

Sankey - Google Sheet
Sankey – Google Sheet

6. Ezt követően a szkriptszerkesztőt újraindítva (Az eszközök menüből) klikkeljünk a futtatás gombra

7. Majd a Google engedélyt kér az adatokhoz történő hozzáféréshez, ezt meg kell adjuk: engedélyek áttekintése, Google fiók kiválasztása, majd „Engedélyezés” – ezekre kell kattintani a felugró ablakban.

8. Ha megvagyunk, bezárhatjuk a szkriptszerkesztőt, és a táblázatunkban a bővítmények menüben megjelenik, egy almenü: „Névtelen Projekt”, benne pedig hogy [envisioner.hu] (Ezt a szkriptet szerkesztve átírhatjuk/átnevezhetjük).

Sankey - Google Sheet
Sankey – Google Sheet

9. Erre kattintva pedig felugrik egy ablak, majd némi várakozás után lőn világosság (van hogy 4-5 másodpercet is kell várnom, ez idő alatt a popup sima fehér, tartalom nélkül!):

Sankey - Google sheet
Sankey – Google sheet

Hajrá!

És akkor innentől kezdve csak a képzeletünk szab határt annak, hogy mit szeretnénk a Sankey segítségével ábrázolni.

A fenti táblázat egyszerűen szerkeszthető: Első és második oszlopba kell beírni, hogy „honnan hova”, a harmadikba pedig, hogy „mennyi”. Ez a három dolog fogja kiadni a dolgokat a diagramon, ahogy a képen is látszik, javaslom minimális tanulmányozásra.

Amikor nekem ez a módszer elkezdett működni, kapásból csináltam vagy 4-5 Sankey diagramot. 🙂

A példa kedvéért itt van egy, a pénzügyi kontrolling tréningünkben bemutatott áramláshoz tartalmazó Sankey:

Sankey - Google Sheets pénzügy
Sankey – Google Sheets pénzügy

Nem görbe, nem kacskaringós, de annál szemléletesebb.

Ha érdekelnek az ilyen és ehhez hasonló tippek trükkök érdekességek okosságok, akkor kövess minket facebookon, iratkozz fel a hírlevelünkre, ha pedig szívesen tanulnál tőlünk nagyobb mennyiségben, hogy eredményesebben éld napjaid, akkor itt találod csatlakozz a Tech-Hubhoz!

megosztás
küldés

Hasonló témában íródott cikkjeink

Legfrissebb bejegyzéseink

kik vagyunk?

Attila
Attila

Nincs megoldatlan probléma, nincs elvesztegetett idő. Nemcsak középvezetőként, hanem magánemberként is kamatoztatom évek óta digitálisan (is) hatékony mentalitásom: Igenis, vessük be a tech-világ adta eszközöket, nap végén pedig élvezzük ki, ha ezek által több az eredmény, kevesebb ráfordítással.

Tomi
Tomi

~25 éve vagyok benne napi szinten a hardverek és szoftverek világában. 8 éve indítottam az első online vállalkozásomat, mára pedig több tucat vállalkozónak segítettem több 10 milliós bizniszt építeni a különböző online szoftverek segítségével. Mérnökként folyamatosan a precíz és hatékony megvalósításra törekszem.

X

Elfelejtetted a jelszavadat?

Csatlakozz hozzánk!

Kevés a Gmail tárhelyed?
Már évek óta fizetsz a nagyobb tárhelyért?

13 perces videóban mutatjuk meg, hogy miként tudod végtelenné tenni a Gmail postafiókod tárhelyét!

Megtelt A Gmail Logo Low

Háromrészes cikksorozat

Érthetően, részletes magyarázatokkal!

Érdekel, hogyan inthetsz búcsút a napi bénázásnak, és
indulhatsz meg a "pénznyomtatás" útján
saját magad digitális transzformációja által?

(Akkor is ha műszaki analfabétának érzed magad)

digitalis vallalkozas

Ha ezt a könyvet elolvasod, 

Kell ennél több?

Miben segít neked ez a fájl?

Áramfogyasztás mérőóra

akár otthonra, akár a vállalkozásodban

Miben segít neked ez a fájl?

QNAP NAS

akár otthon, akár a vállalkozásodban

Miben segít neked ez a fájl?

Bevetelek Es Kiadasok Osszesites2

akár a személyes pénzügyeidben, akár a vállalkozásodban