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.
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
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
- Nyisd meg a Google Drive fiókodat
- Hozz létre egy új táblázatot
- 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.
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]');
}
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:
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).
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!):
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:
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!