Skip to content

Instantly share code, notes, and snippets.

@peixian
Forked from mbostock/.block
Last active December 27, 2015 00:42
Show Gist options
  • Save peixian/c4533d687c8be1107fd6 to your computer and use it in GitHub Desktop.
Save peixian/c4533d687c8be1107fd6 to your computer and use it in GitHub Desktop.
Hierarchical Bar Chart
{
"children": [
{
"children": [
{
"children": [
{
"Best Result": "World Championship Series: Argentina Nationals winner",
"name": "Capoch",
"size": 587
}
],
"name": "Argentina"
},
{
"children": [
{
"Best Result": "2012 StarCraft II World Championship Series: Oceania Finals top4",
"name": "Light",
"size": 510
}
],
"name": "Australia"
},
{
"children": [
{
"Best Result": "2012 DreamHack Open: Winter top4",
"name": "monchi",
"size": 840
}
],
"name": "Austria"
},
{
"children": [
{
"Best Result": "IEM Season VI - World Championship top4",
"name": "Feast",
"size": 1196
}
],
"name": "Belgium"
},
{
"children": [
{
"Best Result": "2012 World Championship Series: South America Finals top3",
"name": "Levin",
"size": 624
}
],
"name": "Brazil"
},
{
"children": [
{
"Best Result": "Win DH Summer 2011",
"name": "HuK",
"size": 2023
},
{
"Best Result": "World Cyber Games 2012 top8",
"name": "CombatEX",
"size": 500
},
{
"Best Result": "IEM Season V - American Championships top6",
"name": "SUGGY",
"size": 171
},
{
"Best Result": "2011 MLG Dallas top2",
"name": "KiWiKaKi",
"size": 1983
},
{
"Best Result": "MLG Dallas 2010 top2",
"name": "TT1",
"size": 1256
},
{
"Best Result": "",
"name": "desRow",
"size": 1866
}
],
"name": "Canada"
},
{
"children": [
{
"Best Result": "World Cyber Games 2012 top3",
"name": "MacSed",
"size": 2101
},
{
"Best Result": "IEM Season IX - Shenzhen top4",
"name": "Jim",
"size": 1766
},
{
"Best Result": "World E-sport Championships 2014 top6",
"name": "Top",
"size": 1438
},
{
"Best Result": "",
"name": "Jieshi",
"size": 480
}
],
"name": "China"
},
{
"children": [
{
"Best Result": "2013 WCS Season 1 Europe top8",
"name": "BabyKnight",
"size": 1136
}
],
"name": "Denmark"
},
{
"children": [
{
"Best Result": "2014 WCS Season 1 Europe top8",
"name": "Welmu",
"size": 1835
},
{
"Best Result": "IEM Season VI - Global Challenge Guangzhou top2",
"name": "elfi",
"size": 1908
}
],
"name": "Finland"
},
{
"children": [
{
"Best Result": "2015 WCS Season 3 winner",
"name": "Lilbow",
"size": 1040
},
{
"Best Result": "World Cyber Games 2012 top2",
"name": "Adelscott",
"size": 918
},
{
"Best Result": "Electronic Sports World Cup 2012 top4",
"name": "NeOAnGeL",
"size": 1136
},
{
"Best Result": "LE TOD AND HIS LE MASSEHSHIP COHR! <3",
"name": "ToD",
"size": 1613
}
],
"name": "France"
},
{
"children": [
{
"Best Result": "IEM Season VII - Katowice top4",
"name": "Socke",
"size": 1866
},
{
"Best Result": "IEM Season VI - Global Challenge Guangzhou top4",
"name": "HasuObs",
"size": 1903
},
{
"Best Result": "2015 WCS Season 1 top4",
"name": "ShoWTimE",
"size": 1200
},
{
"Best Result": "2015 WCS Season 3 top8",
"name": "GunGFuBanDa",
"size": 922
},
{
"Best Result": "IEM Season V - European Championships top6",
"name": "GoOdy",
"size": 1978
}
],
"name": "Germany"
},
{
"children": [
{
"Best Result": "IEM Season VIII - Sao Paulo top8",
"name": "ABomB",
"size": 684
}
],
"name": "Ireland"
},
{
"children": [
{
"Best Result": "2012 season 1 GSL top2",
"name": "Genius",
"size": 1320
},
{
"Best Result": "2012 Battle.net World Championship top2",
"name": "Creator",
"size": 1545
},
{
"Best Result": "2013 WCS Season 1 America winner",
"name": "HerO",
"size": 1770
},
{
"Best Result": "2015 StarCraft II StarLeague Season 3 winner",
"name": "herO",
"size": 1518
},
{
"Best Result": "2015 Global StarCraft II League Season 2 winner",
"name": "Rain",
"size": 1907
},
{
"Best Result": "2012 Battle.net World Championship winner",
"name": "PartinG",
"size": 1479
},
{
"Best Result": "2012 GSL Code S: Season 3 winner",
"name": "Seed",
"size": 1478
},
{
"Best Result": "WCS: South South Korea Nationals top2",
"name": "Squirtle",
"size": 1552
},
{
"Best Result": "2013 WCS Season 3 winner",
"name": "Dear",
"size": 1320
},
{
"Best Result": "IEM Season VI - World Championship winner",
"name": "MC",
"size": 1753
},
{
"Best Result": "Anything with $100.000 main prize",
"name": "sOs",
"size": 1518
},
{
"Best Result": "2013 WCS Season 2 Europe winner",
"name": "duckdeok",
"size": 1093
},
{
"Best Result": "IEM Season VIII - Shanghai top2",
"name": "Oz",
"size": 1504
},
{
"Best Result": "IEM Season IX - World Championship top2",
"name": "Trap",
"size": 1306
},
{
"Best Result": "IEM Season VII - Katowice winner",
"name": "First",
"size": 1282
},
{
"Best Result": "North American Star League Season 3 top2",
"name": "Alicia",
"size": 1857
},
{
"Best Result": "2014 WCS Season 2 Europe winner",
"name": "StarDust",
"size": 1984
},
{
"Best Result": "2013 WCS Season 1 America top8",
"name": "CranK",
"size": 1482
},
{
"Best Result": "IEM Season IX - World Championship winner",
"name": "Zest",
"size": 1318
},
{
"Best Result": "2014 Global StarCraft II League Season 2 winner",
"name": "Classic",
"size": 1905
},
{
"Best Result": "2014 WCS Season 2 America winner",
"name": "Pigbaby",
"size": 1320
},
{
"Best Result": "2013 DreamHack Open: Winter top4",
"name": "Patience",
"size": 1227
},
{
"Best Result": "2014 WCS Season 1 America top8",
"name": "Arthur",
"size": 1376
},
{
"Best Result": "2014 DreamHack Open: Moscow top8",
"name": "Daisy",
"size": 1610
},
{
"Best Result": "2015 StarCraft II StarLeague Season 1 top4",
"name": "Stats",
"size": 1319
},
{
"Best Result": "2015 Global StarCraft II League Season 2 top8",
"name": "MyuNgSiK",
"size": 1285
},
{
"Best Result": "2015 Global StarCraft II League Season 1 top12",
"name": "Terminator",
"size": 1457
},
{
"Best Result": "2015 StarCraft II StarLeague Season 1 top8",
"name": "Super",
"size": 1842
},
{
"Best Result": "ASUS ROG Winter 2014 winner",
"name": "San",
"size": 1900
},
{
"Best Result": "2015 StarCraft II StarLeague Season 2 top12",
"name": "Hurricane",
"size": 1527
},
{
"Best Result": "IEM Season V - Global Challenge Cologne winner",
"name": "MorroW",
"size": 2105
},
{
"Best Result": "2011 Global StarCraft II League July: Code A winner",
"name": "Puzzle",
"size": 1076
},
{
"Best Result": "World Cyber Games 2013 top2",
"name": "Sora",
"size": 921
},
{
"Best Result": "LG Cinema 3D Special League top4",
"name": "Sage",
"size": 1342
},
{
"Best Result": "HomeStory Cup IV top3",
"name": "JYP",
"size": 1661
},
{
"Best Result": "IEM Season V - World Championship winner",
"name": "AcE",
"size": 1404
},
{
"Best Result": "IEM Season VI - Global Challenge New York top8",
"name": "Killer",
"size": 1391
},
{
"Best Result": "IEM Season VI - Global Challenge Sao Paulo top4",
"name": "ReaL",
"size": 319
},
{
"Best Result": "IEM Season VII World Championship top4",
"name": "YongHwa",
"size": 1908
},
{
"Best Result": "2011 LG Cinema 3D GSL May: Code S top2",
"name": "InCa",
"size": 1068
},
{
"Best Result": "2010 TG Sambo Intel Starcraft II Open Season 1 top8",
"name": "TricKsteR",
"size": 1627
},
{
"Best Result": "2010 TG Sambo Intel Starcraft II Open Season 1 top8",
"name": "HongUn",
"size": 668
},
{
"Best Result": "2011 Sony Ericsson Global StarCraft II League January top8",
"name": "Choya",
"size": 1321
},
{
"Best Result": "",
"name": "anypro",
"size": 541
},
{
"Best Result": "",
"name": "LegalMind",
"size": 294
},
{
"Best Result": "",
"name": "BanBans",
"size": 327
},
{
"Best Result": "",
"name": "Brown",
"size": 926
},
{
"Best Result": "",
"name": "Flying",
"size": 1053
},
{
"Best Result": "The Protoss Dragon",
"name": "JangBi",
"size": 466
},
{
"Best Result": "",
"name": "Blaze",
"size": 1082
},
{
"Best Result": "",
"name": "Ruin",
"size": 1110
},
{
"Best Result": "",
"name": "ParalyzE",
"size": 1649
},
{
"Best Result": "",
"name": "TAiLS",
"size": 1505
},
{
"Best Result": "",
"name": "Avenge",
"size": 1387
},
{
"Best Result": "",
"name": "Hush",
"size": 1320
},
{
"Best Result": "",
"name": "Trust",
"size": 1065
},
{
"Best Result": "The Protoss Dragon",
"name": "Stork",
"size": 1320
},
{
"Best Result": "",
"name": "HwangSin",
"size": 888
},
{
"Best Result": "",
"name": "Cal",
"size": 690
},
{
"Best Result": "",
"name": "firebathero",
"size": 120
},
{
"Best Result": "",
"name": "Leta",
"size": 697
},
{
"Best Result": "",
"name": "Believe",
"size": 867
},
{
"Best Result": "",
"name": "Motive",
"size": 582
},
{
"Best Result": "",
"name": "eMotion",
"size": 1032
},
{
"Best Result": "",
"name": "Trend",
"size": 777
},
{
"Best Result": "",
"name": "Kop",
"size": 641
},
{
"Best Result": "",
"name": "Zoun",
"size": 1032
},
{
"Best Result": "",
"name": "Billowy",
"size": 1619
},
{
"Best Result": "The Revolutionist",
"name": "Bisu",
"size": 477
},
{
"Best Result": "",
"name": "BeSt",
"size": 432
},
{
"Best Result": "",
"name": "Comet",
"size": 242
},
{
"Best Result": "",
"name": "Mini",
"size": 468
},
{
"Best Result": "",
"name": "ToSsGirL",
"size": 302
},
{
"Best Result": "",
"name": "Aria",
"size": 540
},
{
"Best Result": "",
"name": "BisAnG",
"size": 319
},
{
"Best Result": "",
"name": "free",
"size": 540
},
{
"Best Result": "",
"name": "Pure",
"size": 46
},
{
"Best Result": "",
"name": "Argo",
"size": 651
},
{
"Best Result": "",
"name": "Barbie",
"size": 539
},
{
"Best Result": "",
"name": "Splendid",
"size": 316
},
{
"Best Result": "",
"name": "Remember",
"size": 305
},
{
"Best Result": "",
"name": "cOre",
"size": 509
},
{
"Best Result": "",
"name": "GuineaPig",
"size": 330
},
{
"Best Result": "",
"name": "Swagger",
"size": 1391
},
{
"Best Result": "",
"name": "StuN",
"size": 564
},
{
"Best Result": "",
"name": "Ssoja",
"size": 1921
},
{
"Best Result": "",
"name": "Booster",
"size": 596
},
{
"Best Result": "",
"name": "MisS",
"size": 974
},
{
"Best Result": "",
"name": "AcE",
"size": 1311
},
{
"Best Result": "",
"name": "Hoon",
"size": 125
},
{
"Best Result": "",
"name": "TREME",
"size": 822
}
],
"name": "South Korea"
},
{
"children": [
{
"Best Result": "",
"name": "Krr",
"size": 2092
}
],
"name": "Lithuania"
},
{
"children": [
{
"Best Result": "IEM Season VII - Singapore top2",
"name": "Grubby",
"size": 1374
},
{
"Best Result": "2015 WCS Season 2 top12",
"name": "Harstem",
"size": 1609
}
],
"name": "Netherlands"
},
{
"children": [
{
"Best Result": "Electronic Sports World Cup 2012 winner",
"name": "MaNa",
"size": 2101
}
],
"name": "Poland"
},
{
"children": [
{
"Best Result": "DreamHack Winter 2011 top4",
"name": "NightEnD",
"size": 2010
}
],
"name": "Romania"
},
{
"children": [
{
"Best Result": "World Cyber Games 2011 top4",
"name": "TitaN",
"size": 322
},
{
"Best Result": "2012 DreamHack Open: Summer top4",
"name": "fraer",
"size": 1706
},
{
"Best Result": "IEM Season VI - Global Challenge Kiev top8",
"name": "Pomi",
"size": 443
},
{
"Best Result": "",
"name": "Siw",
"size": 884
}
],
"name": "Russia"
},
{
"children": [
{
"Best Result": "Electronic Sports World Cup 2012 top8",
"name": "PandaTank",
"size": 983
}
],
"name": "South Africa"
},
{
"children": [
{
"Best Result": "2011 MLG Global Invitational winner",
"name": "NaNiwa",
"size": 2094
},
{
"Best Result": "ASUS ROG Summer 2011 top8",
"name": "Seiplo",
"size": 1493
},
{
"Best Result": "2012 MLG Pro Circuit Spring Championship",
"name": "SaSe",
"size": 1115
},
{
"Best Result": "2012 DreamHack Open: Bucharest top4",
"name": "StarNaN",
"size": 1489
}
],
"name": "Sweden"
},
{
"children": [
{
"Best Result": "",
"name": "Nifi",
"size": 410
},
{
"Best Result": "2014 Taiwan Open top3",
"name": "Has",
"size": 979
}
],
"name": "Taiwan"
},
{
"children": [
{
"Best Result": "IGN ProLeague Season 2 winner",
"name": "White-Ra",
"size": 2135
}
],
"name": "Ukraine"
},
{
"children": [
{
"Best Result": "World Cyber Games 2011 top8",
"name": "BlinG",
"size": 1838
}
],
"name": "United Kingdom"
},
{
"children": [
{
"Best Result": "StarCraft II WCS: USA Nationals top3",
"name": "Insur",
"size": 289
},
{
"Best Result": "IEM Season X - gamescom top12",
"name": "State",
"size": 1711
},
{
"Best Result": "2013 WCS Season 2 America top12",
"name": "Minigun",
"size": 1843
},
{
"Best Result": "World E-sport Championships 2014 top4",
"name": "puCK",
"size": 1359
},
{
"Best Result": "IEM Season VI - Global Challenge New York top4",
"name": "Gatored",
"size": 443
},
{
"Best Result": "IGN ProLeague Season 1 top4",
"name": "Axslav",
"size": 1206
},
{
"Best Result": "2011 Pokerstrategy.com TSL3 top8",
"name": "CrunCher",
"size": 535
},
{
"Best Result": "",
"name": "hellokitty",
"size": 1123
},
{
"Best Result": "",
"name": "Neeb",
"size": 1009
},
{
"Best Result": "",
"name": "Arium",
"size": 916
},
{
"Best Result": "",
"name": "Astrea",
"size": 1615
},
{
"Best Result": "",
"name": "Hitman",
"size": 916
}
],
"name": "USA"
}
],
"name": "Protoss"
},
{
"children": [
{
"children": [
{
"Best Result": "",
"name": "Brain",
"size": 478
}
],
"name": "South Korea"
}
],
"name": "Random"
},
{
"children": [
{
"children": [
{
"Best Result": "2015 WCS Season 2 top12",
"name": "iaguz",
"size": 1702
}
],
"name": "Australia"
},
{
"children": [
{
"Best Result": "",
"name": "Kelazhur",
"size": 1032
}
],
"name": "Brazil"
},
{
"children": [
{
"Best Result": "IEM Season V - American Championships top4",
"name": "Drewbie",
"size": 1194
},
{
"Best Result": "IEM Season V - American Championships top8",
"name": "Silver",
"size": 242
},
{
"Best Result": "",
"name": "MaSa",
"size": 1297
}
],
"name": "Canada"
},
{
"children": [
{
"Best Result": "2010 BlizzCon top2",
"name": "Loner",
"size": 1342
},
{
"Best Result": "Blizzcon 2010 top2",
"name": "Loner",
"size": 1255
},
{
"Best Result": "IEM Season X - Shenzhen top8",
"name": "XY",
"size": 1544
},
{
"Best Result": "",
"name": "Shana",
"size": 861
}
],
"name": "China"
},
{
"children": [
{
"Best Result": "2015 WCS Season 1 top4",
"name": "Bunny",
"size": 1715
}
],
"name": "Denmark"
},
{
"children": [
{
"Best Result": "DreamHack Winter 2010 winner",
"name": "Naama",
"size": 1269
}
],
"name": "Finland"
},
{
"children": [
{
"Best Result": "2015 WCS Season 2 top8",
"name": "MarineLorD",
"size": 1499
},
{
"Best Result": "IEM Season V - European Championships top8",
"name": "SarenS",
"size": 1013
}
],
"name": "France"
},
{
"children": [
{
"Best Result": "",
"name": "KrasS",
"size": 1566
},
{
"Best Result": "",
"name": "HeRoMaRinE",
"size": 1517
}
],
"name": "Germany"
},
{
"children": [
{
"Best Result": "Electronic Sports World Cup 2011 top8",
"name": "ClouD",
"size": 887
}
],
"name": "Italy"
},
{
"children": [
{
"Best Result": "2010 BlizzCon top6",
"name": "Maka",
"size": 970
},
{
"Best Result": "MLG Dallas 2011 Top3",
"name": "SeleCT",
"size": 1952
},
{
"Best Result": "MVP, nuff said.",
"name": "Mvp",
"size": 1465
},
{
"Best Result": "2014 Global StarCraft II League Season 3 winner",
"name": "INnoVation",
"size": 1320
},
{
"Best Result": "2015 WCS Season 1 winner",
"name": "Polt",
"size": 1940
},
{
"Best Result": "2015 StarCraft II StarLeague Season 1 winner",
"name": "Maru",
"size": 1905
},
{
"Best Result": "2013 WCS Season 2 winner",
"name": "Bomber",
"size": 1829
},
{
"Best Result": "2014 WCS Global Finals top2",
"name": "MMA",
"size": 1847
},
{
"Best Result": "2013 DreamHack Open: Winter winner",
"name": "TaeJa",
"size": 1888
},
{
"Best Result": "IGN ProLeague Season 4 winner",
"name": "aLive",
"size": 1862
},
{
"Best Result": "2014 DreamHack Open: Winter win",
"name": "ForGG",
"size": 1553
},
{
"Best Result": "2012 Global StarCraft II League Season 5 top4",
"name": "Ryung",
"size": 1905
},
{
"Best Result": "2013 WCS Season 3 America top6",
"name": "Hack",
"size": 1900
},
{
"Best Result": "DEITY",
"name": "Flash",
"size": 1290
},
{
"Best Result": "IEM Season VI - Global Challenge Sao Paulo top2",
"name": "SuperNova",
"size": 1648
},
{
"Best Result": "2013 WCS Season 1 America top16",
"name": "Apocalypse",
"size": 1431
},
{
"Best Result": "MLG Pro Circuit 2012 Ð Summer Championship top4",
"name": "TheStC",
"size": 1460
},
{
"Best Result": "2012 Global StarCraft II League Season 1: Code S top4",
"name": "GuMiho",
"size": 1863
},
{
"Best Result": "2011 Global StarCraft II League November: Code S winner",
"name": "jjakji",
"size": 1770
},
{
"Best Result": "2014 WCS Season 3 America top2",
"name": "Heart",
"size": 1552
},
{
"Best Result": "IEM Season VII - World Championship",
"name": "YoDa",
"size": 1722
},
{
"Best Result": "2014 Red Bull Battle Grounds: Washington top2",
"name": "Cure",
"size": 1263
},
{
"Best Result": "Multiple runner-up in SSL",
"name": "Dream",
"size": 1842
},
{
"Best Result": "IEM Season X - gamescom top4",
"name": "FanTasy",
"size": 1320
},
{
"Best Result": "2015 StarCraft II StarLeague Season 3 top4",
"name": "TY",
"size": 1518
},
{
"Best Result": "IEM Season IX - World Championship top4",
"name": "Bbyong",
"size": 1313
},
{
"Best Result": "2012 MLG Winter Championship winner",
"name": "MarineKing",
"size": 1906
},
{
"Best Result": "North American Star League Season 2 winner",
"name": "PuMa",
"size": 725
},
{
"Best Result": "2011 GSL August: Code S top2",
"name": "TOP",
"size": 1951
},
{
"Best Result": "IEM Season VII - Singapore winner",
"name": "Sting",
"size": 439
},
{
"Best Result": "TeamLiquid StarLeague 4 top4",
"name": "KeeN",
"size": 1842
},
{
"Best Result": "2010 TG Sambo Intel Starcraft II Open Season 1 top2",
"name": "RainBOw",
"size": 700
},
{
"Best Result": "2010 TG Sambo Intel Starcraft II Open Season top4",
"name": "LiveForever",
"size": 186
},
{
"Best Result": "2010 TG Sambo Intel Starcraft II Open Season 1 top4",
"name": "Ensnare",
"size": 348
},
{
"Best Result": "2010 TG Sambo Intel Starcraft II Open Season 1 top8",
"name": "Maka",
"size": 970
},
{
"Best Result": "The Emperor",
"name": "BoxeR",
"size": 1083
},
{
"Best Result": "Bonjwa",
"name": "NaDa",
"size": 616
},
{
"Best Result": "2011 GSL Super Tournament top8",
"name": "TheBest",
"size": 1096
},
{
"Best Result": "",
"name": "Hyperdub",
"size": 338
},
{
"Best Result": "",
"name": "Clide",
"size": 698
},
{
"Best Result": "",
"name": "Lyn",
"size": 267
},
{
"Best Result": "",
"name": "sC",
"size": 1412
},
{
"Best Result": "",
"name": "Virus",
"size": 497
},
{
"Best Result": "",
"name": "Happy",
"size": 638
},
{
"Best Result": "",
"name": "Noblesse",
"size": 1337
},
{
"Best Result": "",
"name": "asd",
"size": 724
},
{
"Best Result": "",
"name": "GanZi",
"size": 1107
},
{
"Best Result": "",
"name": "Last",
"size": 579
},
{
"Best Result": "2015 DreamHack Open: Stockholm top4",
"name": "Reality",
"size": 1320
},
{
"Best Result": "",
"name": "Sorry",
"size": 1584
},
{
"Best Result": "",
"name": "SkyHigh",
"size": 1286
},
{
"Best Result": "",
"name": "Shuttle",
"size": 955
},
{
"Best Result": "",
"name": "Canata",
"size": 60
},
{
"Best Result": "",
"name": "Iris",
"size": 217
},
{
"Best Result": "",
"name": "Organ",
"size": 499
},
{
"Best Result": "",
"name": "Snow",
"size": 751
},
{
"Best Result": "",
"name": "Horang2",
"size": 206
},
{
"Best Result": "",
"name": "Miso",
"size": 1199
},
{
"Best Result": "",
"name": "BarrrackS",
"size": 582
},
{
"Best Result": "",
"name": "Mind",
"size": 667
},
{
"Best Result": "",
"name": "BrAvO",
"size": 1320
},
{
"Best Result": "",
"name": "Guilty",
"size": 1009
},
{
"Best Result": "",
"name": "Journey",
"size": 1001
},
{
"Best Result": "",
"name": "TurN",
"size": 907
},
{
"Best Result": "",
"name": "Sharp",
"size": 143
},
{
"Best Result": "",
"name": "DynaMite",
"size": 773
},
{
"Best Result": "",
"name": "sSak",
"size": 590
},
{
"Best Result": "",
"name": "Hanbin",
"size": 284
},
{
"Best Result": "",
"name": "Light",
"size": 485
},
{
"Best Result": "",
"name": "Sea",
"size": 409
},
{
"Best Result": "",
"name": "Neige",
"size": 410
},
{
"Best Result": "",
"name": "TANGTANG",
"size": 276
},
{
"Best Result": "",
"name": "Forte",
"size": 1390
},
{
"Best Result": "",
"name": "eins",
"size": 363
},
{
"Best Result": "",
"name": "BitByBit",
"size": 813
},
{
"Best Result": "",
"name": "dreamertt",
"size": 517
},
{
"Best Result": "",
"name": "NaTuRal",
"size": 157
},
{
"Best Result": "",
"name": "Center",
"size": 1092
},
{
"Best Result": "",
"name": "Aphrodite",
"size": 1460
},
{
"Best Result": "",
"name": "Sound",
"size": 1053
},
{
"Best Result": "",
"name": "Sparta",
"size": 673
}
],
"name": "South Korea"
},
{
"children": [
{
"Best Result": "IEM Season VIII - Sao Paulo top8",
"name": "MajOr",
"size": 1744
},
{
"Best Result": "",
"name": "Maker",
"size": 1335
}
],
"name": "Mexico"
},
{
"children": [
{
"Best Result": "HomeStory Cup IX top4",
"name": "Dayshi",
"size": 1706
}
],
"name": "Millenium"
},
{
"children": [
{
"Best Result": "IEM Season X - Shenzhen top8",
"name": "uThermal",
"size": 1532
},
{
"Best Result": "DreamHack Winter 2010 top8",
"name": "ServaNT",
"size": 639
}
],
"name": "Netherlands"
},
{
"children": [
{
"Best Result": "IEM Season V - American Championships winner",
"name": "Fenix",
"size": 1311
}
],
"name": "Peru"
},
{
"children": [
{
"Best Result": "IEM Season V - European Championships top4",
"name": "Tarson",
"size": 1228
}
],
"name": "Poland"
},
{
"children": [
{
"Best Result": "ASUS ROG Summer 2011 top4",
"name": "Brat_OK",
"size": 1219
},
{
"Best Result": "IEM Season X - gamescom top12",
"name": "Happy",
"size": 1744
}
],
"name": "Russia"
},
{
"children": [
{
"Best Result": "2012 World Championship Series: Europe top3",
"name": "LucifroN",
"size": 1217
}
],
"name": "Spain"
},
{
"children": [
{
"Best Result": "2012 DreamHack Open Stockholm winner",
"name": "ThorZaIN",
"size": 1041
},
{
"Best Result": "IEM Season V - European Championships winner",
"name": "SjoW",
"size": 1403
},
{
"Best Result": "2011 Sony Ericsson Global StarCraft II League January top4",
"name": "Jinro",
"size": 861
}
],
"name": "Sweden"
},
{
"children": [
{
"Best Result": "2010 BlizzCon top12",
"name": "Ball",
"size": 860
}
],
"name": "Taiwan"
},
{
"children": [
{
"Best Result": "2012 StarCraft II World Championship Series: Southeast Asia Nationals top2",
"name": "RedArchon",
"size": 686
}
],
"name": "Thailand"
},
{
"children": [
{
"Best Result": "World Cyber Games 2011 top3",
"name": "Kas",
"size": 1857
},
{
"Best Result": "IEM Season VI - Global Challenge Guangzhou top8",
"name": "Strelok",
"size": 1850
}
],
"name": "Ukraine"
},
{
"children": [
{
"Best Result": "IEM Europe season V Top3",
"name": "DeMuslim",
"size": 2062
}
],
"name": "United Kingdom"
},
{
"children": [
{
"Best Result": "MLG Dallas 2010 top4",
"name": "NonY",
"size": 1015
},
{
"Best Result": "IEM Season V - American Championships top2",
"name": "qxc",
"size": 2032
},
{
"Best Result": "",
"name": "theognis",
"size": 772
},
{
"Best Result": "",
"name": "Illusion",
"size": 1645
},
{
"Best Result": "",
"name": "Xenocider",
"size": 1268
}
],
"name": "USA"
}
],
"name": "Terran"
},
{
"children": [
{
"children": [
{
"Best Result": "IEM Season V - World Championship top4",
"name": "mOOnGLaDe",
"size": 1289
},
{
"Best Result": "2012 StarCraft II World Championship Series: Oceania Finals top2",
"name": "MaFia",
"size": 725
},
{
"Best Result": "2012 StarCraft II World Championship Series: Oceania Finals top4",
"name": "tgun",
"size": 854
},
{
"Best Result": "",
"name": "PiG",
"size": 1530
}
],
"name": "Australia"
},
{
"children": [
{
"Best Result": "World Cyber Games 2012 top4",
"name": "LoWeLy",
"size": 1120
}
],
"name": "Belarus"
},
{
"children": [
{
"Best Result": "2012 World Championship Series: South America top4",
"name": "Tunico",
"size": 1304
}
],
"name": "Brazil"
},
{
"children": [
{
"Best Result": "2013 ASUS ROG: NorthCon top2",
"name": "Scarlett",
"size": 1566
},
{
"Best Result": "2012 World Championship Series: Canada top2",
"name": "Ostojiy",
"size": 977
},
{
"Best Result": "2015 WCS Season 1 top8",
"name": "Kane",
"size": 1503
},
{
"Best Result": "",
"name": "hendralisk",
"size": 802
}
],
"name": "Canada"
},
{
"children": [
{
"Best Result": "IEM Season VI - Global Challenge New York top3",
"name": "KiLLer",
"size": 1150
}
],
"name": "Chile"
},
{
"children": [
{
"Best Result": "2010 BlizzCon top8",
"name": "Luffy",
"size": 179
},
{
"Best Result": "NESO 2015 winner",
"name": "TooDming",
"size": 1767
},
{
"Best Result": "2012 StarCraft II World Championship Series: China Nationals winner",
"name": "Comm",
"size": 1299
},
{
"Best Result": "World Cyber Games 2011 top2",
"name": "XiGua",
"size": 1872
},
{
"Best Result": "",
"name": "Courage",
"size": 1515
},
{
"Best Result": "",
"name": "iAsonu",
"size": 760
}
],
"name": "China"
},
{
"children": [
{
"Best Result": "2015 WCS Season 1 top12",
"name": "Serral",
"size": 1365
}
],
"name": "Finland"
},
{
"children": [
{
"Best Result": "2012 World Championship Series: Europe winner",
"name": "Stephano",
"size": 1950
},
{
"Best Result": "DreamHack ROCCAT LotV Championship top3",
"name": "FireCake",
"size": 1460
}
],
"name": "France"
},
{
"children": [
{
"Best Result": "IEM Sao Paulo season VIII Top4",
"name": "TLO",
"size": 2105
},
{
"Best Result": "North American Star League Season 1 top8",
"name": "DarKFoRcE",
"size": 995
},
{
"Best Result": "IEM Season X - gamescom top8",
"name": "Lambo",
"size": 1003
}
],
"name": "Germany"
},
{
"children": [
{
"Best Result": "",
"name": "iceiceice",
"size": 1206
}
],
"name": "Hong Kong"
},
{
"children": [
{
"Best Result": "2011 GSL July - Code S winner",
"name": "NesTea",
"size": 1917
},
{
"Best Result": "2013 Global StarCraft II League Season 1 winner",
"name": "RorO",
"size": 1105
},
{
"Best Result": "2015 DreamHack Open: Valencia winner",
"name": "Curious",
"size": 1581
},
{
"Best Result": "2013 WCS Season 1 South Korea GSL winner",
"name": "Soulkey",
"size": 1320
},
{
"Best Result": "World E-sport Championships 2014 winner",
"name": "Jaedong",
"size": 1518
},
{
"Best Result": "IEM Season VIII - Shanghai winner",
"name": "Revival",
"size": 1862
},
{
"Best Result": "2014 WCS Season 1 America winner",
"name": "HyuN",
"size": 1494
},
{
"Best Result": "The best runner-up in the history of the game",
"name": "soO",
"size": 1320
},
{
"Best Result": "2015 StarCraft II StarLeague Season 3 top2",
"name": "ByuL",
"size": 1382
},
{
"Best Result": "2014 WCS Global Finals winner",
"name": "Life",
"size": 1763
},
{
"Best Result": "2013 Global StarCraft II League Season 1 2 top2",
"name": "Symbol",
"size": 1695
},
{
"Best Result": "2011 GSL July: Code S top2",
"name": "Losira",
"size": 1917
},
{
"Best Result": "IGN ProLeague Season 5 winner",
"name": "Leenock",
"size": 1909
},
{
"Best Result": "2012 MLG Spring Championship winner",
"name": "DongRaeGu",
"size": 1983
},
{
"Best Result": "DreamHack ROCCAT LotV Championship winner",
"name": "Solar",
"size": 1358
},
{
"Best Result": "2012 MLG Spring Arena 2 winner",
"name": "viOLet",
"size": 1718
},
{
"Best Result": "2014 WCS Season 2 Europe top4",
"name": "Golden",
"size": 1406
},
{
"Best Result": "2015 DreamHack Open: Valencia top2",
"name": "TRUE",
"size": 1518
},
{
"Best Result": "2014 DreamHack Open: Valencia winner",
"name": "Sacsri",
"size": 1518
},
{
"Best Result": "2014 WCS Season 3 America top12",
"name": "Check",
"size": 1457
},
{
"Best Result": "2015 WCS Global Finals top4",
"name": "Rogue",
"size": 1518
},
{
"Best Result": "2015 WCS Season 2 winner",
"name": "Hydra",
"size": 1698
},
{
"Best Result": "2015 KeSPA Cup Season 1 top2",
"name": "Dark",
"size": 1385
},
{
"Best Result": "2011 Global Starcraft II League March top2",
"name": "JulyZerg",
"size": 603
},
{
"Best Result": "IEM Season V - World Championship top2",
"name": "Moon",
"size": 761
},
{
"Best Result": "2012 DreamHack Open: Stockholm top4",
"name": "NAKSEO",
"size": 580
},
{
"Best Result": "2011 MLG Raleigh top2",
"name": "CoCa",
"size": 1114
},
{
"Best Result": "",
"name": "YugiOh",
"size": 1140
},
{
"Best Result": "2014 DreamHack Open: Bucharest top2",
"name": "Impact",
"size": 1739
},
{
"Best Result": "2014 DreamHack Open: Moscow top8",
"name": "BBoongBBoong",
"size": 1533
},
{
"Best Result": "2010 Global StarCraft II League Open Season 1 winner",
"name": "FruitDealer",
"size": 559
},
{
"Best Result": "IEM Season VI - Global Challenge Kiev top4",
"name": "Zenio",
"size": 1267
},
{
"Best Result": "IEM Season VIII - Singapore top8",
"name": "EffOrt",
"size": 1280
},
{
"Best Result": "IGN ProLeague Season 3 top2",
"name": "Lucky",
"size": 1194
},
{
"Best Result": "2010 Sony Ericsson StarCraft II Open Season 2 top8",
"name": "Kyrix",
"size": 336
},
{
"Best Result": "",
"name": "jookTo",
"size": 957
},
{
"Best Result": "",
"name": "TheWinD",
"size": 423
},
{
"Best Result": "",
"name": "SuHoSin",
"size": 1457
},
{
"Best Result": "",
"name": "Sniper",
"size": 1404
},
{
"Best Result": "",
"name": "Crazy",
"size": 582
},
{
"Best Result": "",
"name": "Shine",
"size": 1320
},
{
"Best Result": "",
"name": "RagnaroK",
"size": 1614
},
{
"Best Result": "",
"name": "hyvaa",
"size": 802
},
{
"Best Result": "",
"name": "Sleep",
"size": 1872
},
{
"Best Result": "",
"name": "SonGDuri",
"size": 569
},
{
"Best Result": "",
"name": "PenguiN",
"size": 1064
},
{
"Best Result": "",
"name": "OriOn",
"size": 60
},
{
"Best Result": "",
"name": "Rare",
"size": 663
},
{
"Best Result": "",
"name": "Action",
"size": 1074
},
{
"Best Result": "",
"name": "hitmaN",
"size": 851
},
{
"Best Result": "",
"name": "HoeJJA",
"size": 851
},
{
"Best Result": "",
"name": "Cacia",
"size": 582
},
{
"Best Result": "",
"name": "Armani",
"size": 1032
},
{
"Best Result": "",
"name": "oDin",
"size": 850
},
{
"Best Result": "",
"name": "Mamuri",
"size": 1400
},
{
"Best Result": "",
"name": "s2",
"size": 253
},
{
"Best Result": "",
"name": "SSanaEE",
"size": 386
},
{
"Best Result": "",
"name": "YoungJoo",
"size": 522
},
{
"Best Result": "",
"name": "Calm",
"size": 449
},
{
"Best Result": "",
"name": "Modesty",
"size": 195
},
{
"Best Result": "",
"name": "KassiA",
"size": 585
},
{
"Best Result": "",
"name": "ZerO",
"size": 522
},
{
"Best Result": "",
"name": "Adios",
"size": 393
},
{
"Best Result": "",
"name": "DeParture",
"size": 1527
},
{
"Best Result": "",
"name": "Ready",
"size": 517
},
{
"Best Result": "",
"name": "horror",
"size": 1908
},
{
"Best Result": "",
"name": "Mysticism",
"size": 1544
},
{
"Best Result": "",
"name": "CrazymoviNG",
"size": 1337
},
{
"Best Result": "",
"name": "Pet",
"size": 1527
},
{
"Best Result": "",
"name": "Slam",
"size": 1100
},
{
"Best Result": "",
"name": "Zero",
"size": 817
},
{
"Best Result": "",
"name": "KingKong",
"size": 1580
}
],
"name": "South Korea"
},
{
"children": [
{
"Best Result": "SteelSeries StarCraft II Challenge winner",
"name": "Ret",
"size": 2119
}
],
"name": "Netherlands"
},
{
"children": [
{
"Best Result": "",
"name": "JazBas",
"size": 913
},
{
"Best Result": "2015 WCS Season 3 top8",
"name": "Petraeus",
"size": 1351
}
],
"name": "New Zealand"
},
{
"children": [
{
"Best Result": "World E-sport Championships 2014 top2",
"name": "Snute",
"size": 1675
},
{
"Best Result": "2012 DreamHack Open: Valencia top4",
"name": "TargA",
"size": 1741
}
],
"name": "Norway"
},
{
"children": [
{
"Best Result": "2012 DreamHack Open: Bucharest winner",
"name": "Nerchio",
"size": 1860
},
{
"Best Result": "",
"name": "Tefel",
"size": 1939
},
{
"Best Result": "",
"name": "uzer",
"size": 245
},
{
"Best Result": "",
"name": "Elazer",
"size": 758
}
],
"name": "Poland"
},
{
"children": [
{
"Best Result": "IEM Season VII - Singapore top4",
"name": "sLivko",
"size": 1844
},
{
"Best Result": "2014 WCS Season 2 Europe top12",
"name": "LiveZerg",
"size": 1557
}
],
"name": "Russia"
},
{
"children": [
{
"Best Result": "2014 DreamHack Open: Valencia top8",
"name": "Starbuck",
"size": 1128
}
],
"name": "Slovenia"
},
{
"children": [
{
"Best Result": "2012 World Championship Series: Europe top2",
"name": "VortiX",
"size": 1605
}
],
"name": "Spain"
},
{
"children": [
{
"Best Result": "2015 WCS Season 3 top4",
"name": "Zanster",
"size": 1051
},
{
"Best Result": "IEM Season V - Global Challenge Cologne top8",
"name": "MaDFroG",
"size": 158
},
{
"Best Result": "",
"name": "Miniraser",
"size": 1819
}
],
"name": "Sweden"
},
{
"children": [
{
"Best Result": "2014 Taiwan open Winner",
"name": "Sen",
"size": 2105
},
{
"Best Result": "2012 StarCraft II World Championship Series: Asia Finals top24",
"name": "AK",
"size": 1461
},
{
"Best Result": "2014 Taiwan Open top4",
"name": "Ian",
"size": 1241
},
{
"Best Result": "World Cyber Games 2011 top8",
"name": "F91",
"size": 1882
},
{
"Best Result": "",
"name": "Slam",
"size": 724
}
],
"name": "Taiwan"
},
{
"children": [
{
"Best Result": "ASUS ROG Summer 2011 winner",
"name": "DIMAGA",
"size": 2041
},
{
"Best Result": "2012 DreamHack Open: Bucharest top2",
"name": "Bly",
"size": 1900
}
],
"name": "Ukraine"
},
{
"children": [
{
"Best Result": "TeamLiquid StarLeague 4 top8",
"name": "JonnyREcco",
"size": 1456
}
],
"name": "United Kingdom"
},
{
"children": [
{
"Best Result": "",
"name": "Sheth",
"size": 1013
},
{
"Best Result": "2012 World Championship Series: North America top2",
"name": "ViBE",
"size": 1276
},
{
"Best Result": "2012 Battle.net World Championship top8",
"name": "Suppy",
"size": 1714
},
{
"Best Result": "IEM Season VI - Global Challenge Guangzhou winner",
"name": "IdrA",
"size": 1017
},
{
"Best Result": "2012 World Championship Series: USA Nationals top2",
"name": "daisuki",
"size": 8
},
{
"Best Result": "2013 DreamHack Open: Valencia top4",
"name": "Goswser",
"size": 1506
},
{
"Best Result": "",
"name": "guitarcheese",
"size": 1024
}
],
"name": "USA"
}
],
"name": "Zerg"
}
],
"name": "SC2 Career Stats"
}

This bar chart visualizes hierarchical data using D3. Each blue bar is a representation of a folder. Data provided by coydoras

<!DOCTYPE html>
<meta charset="utf-8">
<style>
text {
font: 10px sans-serif;
}
rect.background {
fill: white;
}
.axis {
shape-rendering: crispEdges;
}
.axis path,
.axis line {
fill: none;
stroke: #000;
}
</style>
<body>
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
var margin = {top: 30, right: 120, bottom: 0, left: 120},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
var x = d3.scale.linear()
.range([0, width]);
var barHeight = 20;
var color = d3.scale.ordinal()
.range(["steelblue", "#ccc"]);
var duration = 750,
delay = 25;
var partition = d3.layout.partition()
.value(function(d) { return d.size; });
var xAxis = d3.svg.axis()
.scale(x)
.orient("top");
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
svg.append("rect")
.attr("class", "background")
.attr("width", width)
.attr("height", height)
.on("click", up);
svg.append("g")
.attr("class", "x axis");
svg.append("g")
.attr("class", "y axis")
.append("line")
.attr("y1", "100%");
d3.json("readme.json", function(error, root) {
if (error) throw error;
partition.nodes(root);
x.domain([0, root.value]).nice();
down(root, 0);
});
function down(d, i) {
if (!d.children || this.__transition__) return;
var end = duration + d.children.length * delay;
// Mark any currently-displayed bars as exiting.
var exit = svg.selectAll(".enter")
.attr("class", "exit");
// Entering nodes immediately obscure the clicked-on bar, so hide it.
exit.selectAll("rect").filter(function(p) { return p === d; })
.style("fill-opacity", 1e-6);
// Enter the new bars for the clicked-on data.
// Per above, entering bars are immediately visible.
var enter = bar(d)
.attr("transform", stack(i))
.style("opacity", 1);
// Have the text fade-in, even though the bars are visible.
// Color the bars as parents; they will fade to children if appropriate.
enter.select("text").style("fill-opacity", 1e-6);
enter.select("rect").style("fill", color(true));
// Update the x-scale domain.
x.domain([0, d3.max(d.children, function(d) { return d.value; })]).nice();
// Update the x-axis.
svg.selectAll(".x.axis").transition()
.duration(duration)
.call(xAxis);
// Transition entering bars to their new position.
var enterTransition = enter.transition()
.duration(duration)
.delay(function(d, i) { return i * delay; })
.attr("transform", function(d, i) { return "translate(0," + barHeight * i * 1.2 + ")"; });
// Transition entering text.
enterTransition.select("text")
.style("fill-opacity", 1);
// Transition entering rects to the new x-scale.
enterTransition.select("rect")
.attr("width", function(d) { return x(d.value); })
.style("fill", function(d) { return color(!!d.children); });
// Transition exiting bars to fade out.
var exitTransition = exit.transition()
.duration(duration)
.style("opacity", 1e-6)
.remove();
// Transition exiting bars to the new x-scale.
exitTransition.selectAll("rect")
.attr("width", function(d) { return x(d.value); });
// Rebind the current node to the background.
svg.select(".background")
.datum(d)
.transition()
.duration(end);
d.index = i;
}
function up(d) {
if (!d.parent || this.__transition__) return;
var end = duration + d.children.length * delay;
// Mark any currently-displayed bars as exiting.
var exit = svg.selectAll(".enter")
.attr("class", "exit");
// Enter the new bars for the clicked-on data's parent.
var enter = bar(d.parent)
.attr("transform", function(d, i) { return "translate(0," + barHeight * i * 1.2 + ")"; })
.style("opacity", 1e-6);
// Color the bars as appropriate.
// Exiting nodes will obscure the parent bar, so hide it.
enter.select("rect")
.style("fill", function(d) { return color(!!d.children); })
.filter(function(p) { return p === d; })
.style("fill-opacity", 1e-6);
// Update the x-scale domain.
x.domain([0, d3.max(d.parent.children, function(d) { return d.value; })]).nice();
// Update the x-axis.
svg.selectAll(".x.axis").transition()
.duration(duration)
.call(xAxis);
// Transition entering bars to fade in over the full duration.
var enterTransition = enter.transition()
.duration(end)
.style("opacity", 1);
// Transition entering rects to the new x-scale.
// When the entering parent rect is done, make it visible!
enterTransition.select("rect")
.attr("width", function(d) { return x(d.value); })
.each("end", function(p) { if (p === d) d3.select(this).style("fill-opacity", null); });
// Transition exiting bars to the parent's position.
var exitTransition = exit.selectAll("g").transition()
.duration(duration)
.delay(function(d, i) { return i * delay; })
.attr("transform", stack(d.index));
// Transition exiting text to fade out.
exitTransition.select("text")
.style("fill-opacity", 1e-6);
// Transition exiting rects to the new scale and fade to parent color.
exitTransition.select("rect")
.attr("width", function(d) { return x(d.value); })
.style("fill", color(true));
// Remove exiting nodes when the last child has finished transitioning.
exit.transition()
.duration(end)
.remove();
// Rebind the current parent to the background.
svg.select(".background")
.datum(d.parent)
.transition()
.duration(end);
}
// Creates a set of bars for the given data node, at the specified index.
function bar(d) {
var bar = svg.insert("g", ".y.axis")
.attr("class", "enter")
.attr("transform", "translate(0,5)")
.selectAll("g")
.data(d.children)
.enter().append("g")
.style("cursor", function(d) { return !d.children ? null : "pointer"; })
.on("click", down);
bar.append("text")
.attr("x", -6)
.attr("y", barHeight / 2)
.attr("dy", ".35em")
.style("text-anchor", "end")
.text(function(d) { return d.name; });
bar.append("rect")
.attr("width", function(d) { return x(d.value); })
.attr("height", barHeight);
return bar;
}
// A stateful closure for stacking bars horizontally.
function stack(i) {
var x0 = 0;
return function(d) {
var tx = "translate(" + x0 + "," + barHeight * i * 1.2 + ")";
x0 += x(d.value);
return tx;
};
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment