Cassandra forum structure II cavalier

README.md

Another tremap whose data comes from a forum analysed in the Cassandra project. This example is similar to a previous one, but uses a cavalier projection instead of isometric.

(Edit: found a similar approach named Cascaded Treemaps)

drugsforum.json

{
"name": "Drugs Forum",
"id": 0,
"size": 0,
"children": [
{
"name": "Cannabis",
"id": "7",
"size": "29411",
"children": [
{
"name": "Cannabis Experiences",
"id": "26",
"size": "2438",
"children": []
},
{
"name": "Coffeeshops",
"id": "62",
"size": "1034",
"children": [
{
"name": "Coffeeshop reviews",
"id": "125",
"size": "1",
"children": []
}
]
},
{
"name": "Cannabis paraphernalia",
"id": "106",
"size": "5770",
"children": [
{
"name": "Cannabis Paraphernalia Reviews",
"id": "493",
"size": "253",
"children": []
}
]
},
{
"name": "Cannabis growing",
"id": "331",
"size": "1",
"children": []
},
{
"name": "Cannabis & Health",
"id": "414",
"size": "5407",
"children": [
{
"name": "Medical Marijuana",
"id": "413",
"size": "527",
"children": [
{
"name": "Medical Marijuana News",
"id": "405",
"size": "1",
"children": []
}
]
},
{
"name": "Cannabis addiction",
"id": "418",
"size": "1",
"children": []
},
{
"name": "Medical Marijuana Dispensaries",
"id": "479",
"size": "1",
"children": []
}
]
},
{
"name": "Hashish & BHO",
"id": "415",
"size": "2591",
"children": []
},
{
"name": "Cooking with Cannabis",
"id": "416",
"size": "2095",
"children": []
}
]
},
{
"name": "Magic Mushrooms (Psilocybe & Amanita)",
"id": "8",
"size": "650",
"children": [
{
"name": "Magic Mushroom use",
"id": "28",
"size": "10949",
"children": []
},
{
"name": "Amanita",
"id": "79",
"size": "1196",
"children": []
},
{
"name": "Mushroom growing",
"id": "332",
"size": "1",
"children": []
},
{
"name": "Magic Mushroom hunting",
"id": "485",
"size": "1310",
"children": []
}
]
},
{
"name": "Drug chemistry",
"id": "17",
"size": "1",
"children": [
{
"name": "Other Drugs Chemistry",
"id": "38",
"size": "1",
"children": []
},
{
"name": "Phenethylamine Chem",
"id": "64",
"size": "1",
"children": [
{
"name": "MDMA Chemistry",
"id": "185",
"size": "1",
"children": []
},
{
"name": "Meth Chemistry",
"id": "186",
"size": "1",
"children": []
}
]
},
{
"name": "Setup & precursors",
"id": "65",
"size": "1",
"children": []
},
{
"name": "Opiate & Opioid Chem",
"id": "66",
"size": "1",
"children": []
},
{
"name": "Tryptamine Chemistry",
"id": "67",
"size": "1",
"children": [
{
"name": "LSD Synthesis",
"id": "328",
"size": "1",
"children": []
}
]
},
{
"name": "GHB Chemistry",
"id": "187",
"size": "1",
"children": []
},
{
"name": "Rhodium",
"id": "380",
"size": "1",
"children": []
},
{
"name": "Access Applications",
"id": "433",
"size": "466",
"children": []
},
{
"name": "Chemistry Basics",
"id": "435",
"size": "2385",
"children": []
}
]
},
{
"name": "Alcohol",
"id": "18",
"size": "18808",
"children": [
{
"name": "Alcohol addiction",
"id": "285",
"size": "1",
"children": []
}
]
},
{
"name": "Amphetamine",
"id": "19",
"size": "14365",
"children": [
{
"name": "Methamphetamine",
"id": "88",
"size": "53051",
"children": [
{
"name": "Meth Chemistry",
"id": "326",
"size": "1",
"children": []
}
]
},
{
"name": "Concerta & Ritalin",
"id": "135",
"size": "7786",
"children": []
},
{
"name": "Adderall",
"id": "136",
"size": "18621",
"children": []
},
{
"name": "Amphetamine addiction",
"id": "286",
"size": "1",
"children": []
},
{
"name": "Phenethylamine Chem",
"id": "325",
"size": "1",
"children": []
}
]
},
{
"name": "Research Chemicals",
"id": "21",
"size": "14014",
"children": [
{
"name": "Phenethylamines",
"id": "89",
"size": "9669",
"children": [
{
"name": "PEA Chem",
"id": "323",
"size": "1",
"children": []
},
{
"name": "Amphetamine addiction",
"id": "423",
"size": "1",
"children": []
}
]
},
{
"name": "Tryptamines",
"id": "90",
"size": "4456",
"children": [
{
"name": "Tryptamine Chem",
"id": "327",
"size": "1",
"children": []
}
]
},
{
"name": "Piperazines",
"id": "91",
"size": "984",
"children": []
},
{
"name": "Cannabinoids",
"id": "336",
"size": "15404",
"children": []
},
{
"name": "Beta-Ketones",
"id": "377",
"size": "15550",
"children": []
},
{
"name": "Unidentified Products",
"id": "392",
"size": "2176",
"children": []
},
{
"name": "Unidentified blends",
"id": "393",
"size": "699",
"children": []
},
{
"name": "Dissociative RC's",
"id": "445",
"size": "1365",
"children": []
}
]
},
{
"name": "Cocaine & Crack",
"id": "22",
"size": "33426",
"children": [
{
"name": "Cocaine addiction",
"id": "283",
"size": "1",
"children": []
}
]
},
{
"name": "Herbal Ecstasy",
"id": "23",
"size": "5324",
"children": []
},
{
"name": "Dissociatives",
"id": "24",
"size": "995",
"children": [
{
"name": "DXM",
"id": "80",
"size": "25936",
"children": []
},
{
"name": "Ketamine",
"id": "92",
"size": "7143",
"children": []
},
{
"name": "Nitrous Oxide",
"id": "119",
"size": "3040",
"children": []
},
{
"name": "Dissociative RC's",
"id": "446",
"size": "1",
"children": []
}
]
},
{
"name": "LSD",
"id": "25",
"size": "27596",
"children": [
{
"name": "LSD Questions",
"id": "500",
"size": "8",
"children": []
},
{
"name": "LSD Experiences",
"id": "501",
"size": "1",
"children": []
},
{
"name": "LSD Discussions",
"id": "502",
"size": "211",
"children": []
}
]
},
{
"name": "Ecstasy & MDMA",
"id": "30",
"size": "33775",
"children": [
{
"name": "MDMA Chemistry",
"id": "324",
"size": "1",
"children": []
},
{
"name": "Ecstasy addiction",
"id": "422",
"size": "1",
"children": []
}
]
},
{
"name": "Opiates & Opioids",
"id": "33",
"size": "24636",
"children": [
{
"name": "Heroin",
"id": "123",
"size": "44567",
"children": []
},
{
"name": "Morphine",
"id": "124",
"size": "4675",
"children": []
},
{
"name": "Codeine",
"id": "161",
"size": "10107",
"children": []
},
{
"name": "Opium & Poppy",
"id": "162",
"size": "11332",
"children": [
{
"name": "Poppy growing",
"id": "334",
"size": "1",
"children": []
}
]
},
{
"name": "Opiate addiction",
"id": "287",
"size": "1",
"children": []
},
{
"name": "Fentanyl",
"id": "395",
"size": "3713",
"children": []
},
{
"name": "Hydrocodone",
"id": "396",
"size": "6072",
"children": []
},
{
"name": "Methadone",
"id": "397",
"size": "5510",
"children": []
},
{
"name": "Oxycodone",
"id": "398",
"size": "14247",
"children": []
},
{
"name": "Tramadol",
"id": "399",
"size": "5867",
"children": []
},
{
"name": "Hydromorphone",
"id": "403",
"size": "2509",
"children": []
},
{
"name": "Oxymorphone",
"id": "404",
"size": "684",
"children": []
},
{
"name": "Buprenorphine",
"id": "406",
"size": "5808",
"children": []
},
{
"name": "Opiate Extraction, CWE",
"id": "432",
"size": "1",
"children": []
}
]
},
{
"name": "GHB",
"id": "36",
"size": "5523",
"children": [
{
"name": "GHB Chemistry",
"id": "322",
"size": "1",
"children": []
},
{
"name": "GHB addiction",
"id": "421",
"size": "1",
"children": []
}
]
},
{
"name": "Various drugs not covered by other forums",
"id": "37",
"size": "7424",
"children": [
{
"name": "Antidepressants",
"id": "107",
"size": "8526",
"children": []
},
{
"name": "Antipsychotics",
"id": "132",
"size": "2901",
"children": []
},
{
"name": "Tobacco",
"id": "133",
"size": "6012",
"children": []
},
{
"name": "Deliriant antihistamines",
"id": "134",
"size": "5778",
"children": []
},
{
"name": "Nootropics",
"id": "172",
"size": "6384",
"children": []
}
]
},
{
"name": "Ethnobotanicals",
"id": "40",
"size": "11298",
"children": [
{
"name": "Peyote & San Pedro",
"id": "32",
"size": "5194",
"children": [
{
"name": "Mescaline extraction",
"id": "320",
"size": "1",
"children": []
},
{
"name": "Cactus Growing",
"id": "353",
"size": "1",
"children": []
}
]
},
{
"name": "Salvia divinorum",
"id": "35",
"size": "10050",
"children": [
{
"name": "Salvia Growing",
"id": "408",
"size": "1",
"children": []
}
]
},
{
"name": "DMT and Ayahuasca",
"id": "52",
"size": "8474",
"children": [
{
"name": "DMT Extraction",
"id": "321",
"size": "1",
"children": []
}
]
},
{
"name": "Kratom",
"id": "76",
"size": "19853",
"children": []
},
{
"name": "LSA seeds",
"id": "93",
"size": "6003",
"children": []
},
{
"name": "Nightshades",
"id": "117",
"size": "1192",
"children": []
},
{
"name": "Kava-Kava",
"id": "118",
"size": "2470",
"children": []
},
{
"name": "Coca",
"id": "175",
"size": "1023",
"children": []
},
{
"name": "Caffeine & Coffee",
"id": "443",
"size": "1229",
"children": []
}
]
},
{
"name": "Law and order",
"id": "41",
"size": "23154",
"children": [
{
"name": "Drug Policy Reform & Narco Politics",
"id": "75",
"size": "13070",
"children": []
},
{
"name": "Drug Law Articles",
"id": "473",
"size": "1",
"children": []
}
]
},
{
"name": "About Drugs-Forum.com",
"id": "43",
"size": "1690",
"children": [
{
"name": "Announcements",
"id": "173",
"size": "3003",
"children": []
},
{
"name": "Site use",
"id": "184",
"size": "9991",
"children": []
},
{
"name": "Bug tracker",
"id": "312",
"size": "279",
"children": [
{
"name": "Resolved bugs",
"id": "504",
"size": "3087",
"children": []
},
{
"name": "Future fix",
"id": "505",
"size": "559",
"children": []
}
]
},
{
"name": "Helpdesk",
"id": "480",
"size": "1",
"children": []
},
{
"name": "Reputation bounties",
"id": "494",
"size": "48",
"children": []
}
]
},
{
"name": "Drogen-forum",
"id": "47",
"size": "6",
"children": [
{
"name": "Kokain",
"id": "197",
"size": "30",
"children": []
},
{
"name": "LSD",
"id": "198",
"size": "16",
"children": []
},
{
"name": "Zauberpilze",
"id": "199",
"size": "105",
"children": []
},
{
"name": "Amphetamin",
"id": "200",
"size": "426",
"children": []
},
{
"name": "XTC",
"id": "201",
"size": "25",
"children": []
},
{
"name": "GHB",
"id": "202",
"size": "33",
"children": []
},
{
"name": "Ethnobotanik",
"id": "203",
"size": "140",
"children": []
},
{
"name": "Cannabis",
"id": "204",
"size": "182",
"children": []
},
{
"name": "Herbal XTC",
"id": "205",
"size": "1",
"children": []
},
{
"name": "Downers",
"id": "206",
"size": "71",
"children": []
},
{
"name": "Dissoziativa",
"id": "207",
"size": "60",
"children": []
},
{
"name": "Research Chemicals",
"id": "348",
"size": "222",
"children": []
},
{
"name": "Opiate",
"id": "349",
"size": "180",
"children": []
},
{
"name": "Verschiedene Drogen",
"id": "350",
"size": "192",
"children": []
}
]
},
{
"name": "Downers and sleeping pills",
"id": "50",
"size": "9654",
"children": [
{
"name": "Benzodiazepines",
"id": "20",
"size": "22943",
"children": []
},
{
"name": "Downers addiction",
"id": "289",
"size": "1",
"children": []
}
]
},
{
"name": "Social Forums",
"id": "70",
"size": "13161",
"children": [
{
"name": "Insights & Mystical",
"id": "39",
"size": "12584",
"children": []
},
{
"name": "Some for all",
"id": "49",
"size": "12681",
"children": []
},
{
"name": "Funny shit",
"id": "51",
"size": "8071",
"children": []
},
{
"name": "Drug culture",
"id": "74",
"size": "12629",
"children": [
{
"name": "Book reviews",
"id": "142",
"size": "1",
"children": []
},
{
"name": "Multimedia",
"id": "188",
"size": "1931",
"children": []
},
{
"name": "Events",
"id": "394",
"size": "857",
"children": []
},
{
"name": "Music Groups",
"id": "476",
"size": "1",
"children": []
}
]
},
{
"name": "Computers",
"id": "85",
"size": "4201",
"children": []
},
{
"name": "About DF members",
"id": "195",
"size": "51866",
"children": []
},
{
"name": "Off-Topic Groups",
"id": "477",
"size": "1",
"children": []
},
{
"name": "Social Blogs",
"id": "478",
"size": "1",
"children": []
}
]
},
{
"name": "The euphoric body",
"id": "71",
"size": "10440",
"children": [
{
"name": "Drug combinations",
"id": "42",
"size": "12156",
"children": []
},
{
"name": "Sex and Drugs",
"id": "45",
"size": "8479",
"children": []
},
{
"name": "Drug testing discussion",
"id": "60",
"size": "8494",
"children": []
},
{
"name": "Pharmacology",
"id": "138",
"size": "4593",
"children": []
},
{
"name": "Surveys",
"id": "438",
"size": "1551",
"children": []
},
{
"name": "Drug testing Questions",
"id": "503",
"size": "1896",
"children": []
}
]
},
{
"name": "Diverse drugs gerelateerde forums",
"id": "148",
"size": "1",
"children": [
{
"name": "Nieuws over drugs",
"id": "58",
"size": "2490",
"children": [
{
"name": "Cultuur (Nieuws)",
"id": "315",
"size": "6",
"children": []
},
{
"name": "Gezondheid (Nieuws)",
"id": "316",
"size": "58",
"children": []
},
{
"name": "Politiek (Nieuws)",
"id": "317",
"size": "68",
"children": []
},
{
"name": "Justitie (Nieuws)",
"id": "318",
"size": "189",
"children": []
}
]
},
{
"name": "Over Drugs-Forum",
"id": "147",
"size": "266",
"children": []
},
{
"name": "Diverse zaken",
"id": "150",
"size": "668",
"children": []
},
{
"name": "Drugsbeleid",
"id": "343",
"size": "17",
"children": []
},
{
"name": "Justitie & Recht",
"id": "344",
"size": "17",
"children": []
},
{
"name": "Verslaving",
"id": "345",
"size": "36",
"children": []
}
]
},
{
"name": "Forums over drugs",
"id": "149",
"size": "1",
"children": [
{
"name": "Kruiden & cactus",
"id": "61",
"size": "372",
"children": []
},
{
"name": "Wiet & Hash",
"id": "82",
"size": "303",
"children": []
},
{
"name": "GHB",
"id": "86",
"size": "806",
"children": []
},
{
"name": "XTC",
"id": "87",
"size": "589",
"children": []
},
{
"name": "LSD",
"id": "108",
"size": "190",
"children": []
},
{
"name": "Research Chemicals",
"id": "109",
"size": "934",
"children": []
},
{
"name": "Cocaïne",
"id": "111",
"size": "361",
"children": []
},
{
"name": "Speed",
"id": "112",
"size": "491",
"children": []
},
{
"name": "Opiaten",
"id": "114",
"size": "334",
"children": []
},
{
"name": "Diverse drugs",
"id": "115",
"size": "1267",
"children": []
},
{
"name": "Smartdrugs",
"id": "157",
"size": "164",
"children": []
},
{
"name": "Paddo's",
"id": "158",
"size": "676",
"children": []
}
]
},
{
"name": "Verschiedenes",
"id": "208",
"size": "218",
"children": [
{
"name": "Über Drogen-Forum",
"id": "210",
"size": "173",
"children": []
},
{
"name": "Recht & Gesetz",
"id": "347",
"size": "217",
"children": []
},
{
"name": "Drogen-Wiki",
"id": "389",
"size": "1",
"children": []
},
{
"name": "Nachrichten",
"id": "442",
"size": "567",
"children": []
}
]
},
{
"name": "Psychoactive Plant Cultivation",
"id": "330",
"size": "548",
"children": [
{
"name": "Cannabis growing",
"id": "27",
"size": "8334",
"children": [
{
"name": "GrowFAQ",
"id": "379",
"size": "1",
"children": []
},
{
"name": "Strains & Breeding",
"id": "400",
"size": "580",
"children": []
},
{
"name": "Outdoor Cannabis",
"id": "401",
"size": "778",
"children": []
},
{
"name": "Indoor Cannabis",
"id": "402",
"size": "923",
"children": []
}
]
},
{
"name": "Mushroom growing",
"id": "29",
"size": "9607",
"children": []
},
{
"name": "Poppy growing",
"id": "333",
"size": "4344",
"children": []
},
{
"name": "Cactus Growing",
"id": "352",
"size": "1108",
"children": []
},
{
"name": "Salvia Growing",
"id": "407",
"size": "528",
"children": []
}
]
},
{
"name": "DRUG CREATIE",
"id": "346",
"size": "1",
"children": [
{
"name": "Wiet kweken",
"id": "110",
"size": "106",
"children": []
},
{
"name": "Chemie & extractie",
"id": "159",
"size": "910",
"children": []
}
]
},
{
"name": "Drug News",
"id": "351",
"size": "1",
"children": [
{
"name": "Miscellaneous News",
"id": "53",
"size": "19792",
"children": []
},
{
"name": "Justice & Law (News)",
"id": "306",
"size": "19494",
"children": []
},
{
"name": "Politics (News)",
"id": "307",
"size": "6670",
"children": []
},
{
"name": "Health (News)",
"id": "308",
"size": "13445",
"children": []
},
{
"name": "Culture (News)",
"id": "309",
"size": "8255",
"children": []
},
{
"name": "Weird News",
"id": "310",
"size": "5287",
"children": []
},
{
"name": "Drug News Portal",
"id": "342",
"size": "1",
"children": []
},
{
"name": "Medical Marijuana News",
"id": "381",
"size": "3071",
"children": []
}
]
},
{
"name": "Drug Addiction & Recovery",
"id": "424",
"size": "1",
"children": [
{
"name": "Cocaine addiction",
"id": "280",
"size": "3718",
"children": []
},
{
"name": "Opiate addiction",
"id": "281",
"size": "53338",
"children": []
},
{
"name": "Amphetamines addiction",
"id": "282",
"size": "6461",
"children": []
},
{
"name": "Alcohol addiction",
"id": "284",
"size": "3993",
"children": []
},
{
"name": "Downers addiction",
"id": "288",
"size": "4621",
"children": []
},
{
"name": "Cannabis addiction",
"id": "417",
"size": "3951",
"children": []
},
{
"name": "GHB addiction",
"id": "420",
"size": "1060",
"children": []
},
{
"name": "Other drug addiction",
"id": "425",
"size": "1871",
"children": []
},
{
"name": "Family & friends",
"id": "440",
"size": "3956",
"children": []
},
{
"name": "Psychological & social",
"id": "441",
"size": "3026",
"children": []
},
{
"name": "General Addiction discussion",
"id": "506",
"size": "9175",
"children": []
}
]
},
{
"name": "Drugs-Wiki",
"id": "426",
"size": "1",
"children": [
{
"name": "Wiki Testing Grounds",
"id": "174",
"size": "1",
"children": []
},
{
"name": "Wiki Articles",
"id": "176",
"size": "1",
"children": []
},
{
"name": "Wiki Discussions",
"id": "391",
"size": "275",
"children": []
},
{
"name": "Wiki Books",
"id": "428",
"size": "1",
"children": []
},
{
"name": "Wiki Categories",
"id": "429",
"size": "1",
"children": []
},
{
"name": "Wiki Templates",
"id": "430",
"size": "1",
"children": []
}
]
},
{
"name": "Extraction",
"id": "434",
"size": "1932",
"children": [
{
"name": "DMT Extraction",
"id": "84",
"size": "3782",
"children": []
},
{
"name": "Cactus Extraction",
"id": "319",
"size": "923",
"children": []
},
{
"name": "Opiate Extraction",
"id": "431",
"size": "5354",
"children": []
},
{
"name": "DXM Extraction",
"id": "437",
"size": "1022",
"children": []
}
]
},
{
"name": "Drug Addiction Tools",
"id": "463",
"size": "1",
"children": [
{
"name": "International rehab index",
"id": "196",
"size": "1",
"children": [
{
"name": "Australia",
"id": "220",
"size": "1",
"children": []
},
{
"name": "South Africa",
"id": "226",
"size": "1",
"children": []
},
{
"name": "Europe",
"id": "277",
"size": "1",
"children": [
{
"name": "Spain",
"id": "216",
"size": "1",
"children": []
},
{
"name": "Netherlands",
"id": "217",
"size": "1",
"children": []
},
{
"name": "UK",
"id": "218",
"size": "1",
"children": []
},
{
"name": "Ireland",
"id": "222",
"size": "1",
"children": []
},
{
"name": "Portugal",
"id": "225",
"size": "1",
"children": []
},
{
"name": "Denmark",
"id": "293",
"size": "1",
"children": []
},
{
"name": "Germany",
"id": "294",
"size": "1",
"children": []
},
{
"name": "Italy",
"id": "295",
"size": "1",
"children": []
},
{
"name": "France",
"id": "296",
"size": "1",
"children": []
},
{
"name": "Belgium",
"id": "297",
"size": "1",
"children": []
},
{
"name": "Bulgaria",
"id": "354",
"size": "1",
"children": []
},
{
"name": "Croatia",
"id": "355",
"size": "1",
"children": []
},
{
"name": "Finland",
"id": "356",
"size": "1",
"children": []
},
{
"name": "Latvia",
"id": "357",
"size": "1",
"children": []
},
{
"name": "Macedonia",
"id": "358",
"size": "1",
"children": []
},
{
"name": "Norway",
"id": "359",
"size": "1",
"children": []
},
{
"name": "Slovakia",
"id": "360",
"size": "1",
"children": []
},
{
"name": "Sweden",
"id": "361",
"size": "1",
"children": []
},
{
"name": "Switzerland",
"id": "362",
"size": "1",
"children": []
},
{
"name": "Ukraine",
"id": "363",
"size": "1",
"children": []
}
]
},
{
"name": "North America",
"id": "278",
"size": "1",
"children": [
{
"name": "USA",
"id": "211",
"size": "1",
"children": [
{
"name": "Alabama",
"id": "212",
"size": "1",
"children": []
},
{
"name": "Alaska",
"id": "213",
"size": "1",
"children": []
},
{
"name": "Arizona",
"id": "214",
"size": "1",
"children": []
},
{
"name": "Arkansas",
"id": "215",
"size": "1",
"children": []
},
{
"name": "Colorado",
"id": "227",
"size": "1",
"children": []
},
{
"name": "California",
"id": "228",
"size": "1",
"children": []
},
{
"name": "Florida",
"id": "229",
"size": "1",
"children": []
},
{
"name": "Hawaii",
"id": "230",
"size": "1",
"children": []
},
{
"name": "Illinois",
"id": "231",
"size": "1",
"children": []
},
{
"name": "Kentucky",
"id": "232",
"size": "1",
"children": []
},
{
"name": "Texas",
"id": "233",
"size": "1",
"children": []
},
{
"name": "Utah",
"id": "234",
"size": "1",
"children": []
},
{
"name": "Washington",
"id": "235",
"size": "1",
"children": []
},
{
"name": "Pennsylvania",
"id": "236",
"size": "1",
"children": []
},
{
"name": "Connecticut",
"id": "237",
"size": "1",
"children": []
},
{
"name": "Delaware",
"id": "238",
"size": "1",
"children": []
},
{
"name": "Georgia",
"id": "239",
"size": "1",
"children": []
},
{
"name": "Idaho",
"id": "240",
"size": "1",
"children": []
},
{
"name": "Indiana",
"id": "241",
"size": "1",
"children": []
},
{
"name": "Iowa",
"id": "242",
"size": "1",
"children": []
},
{
"name": "Kansas",
"id": "243",
"size": "1",
"children": []
},
{
"name": "Louisiana",
"id": "244",
"size": "1",
"children": []
},
{
"name": "Maine",
"id": "245",
"size": "1",
"children": []
},
{
"name": "Maryland",
"id": "246",
"size": "1",
"children": []
},
{
"name": "Massachusetts",
"id": "247",
"size": "1",
"children": []
},
{
"name": "Michigan",
"id": "248",
"size": "1",
"children": []
},
{
"name": "Minnesota",
"id": "249",
"size": "1",
"children": []
},
{
"name": "Mississippi",
"id": "250",
"size": "1",
"children": []
},
{
"name": "Missouri",
"id": "251",
"size": "1",
"children": []
},
{
"name": "Montana",
"id": "252",
"size": "1",
"children": []
},
{
"name": "Nebraska",
"id": "253",
"size": "1",
"children": []
},
{
"name": "Nevada",
"id": "254",
"size": "1",
"children": []
},
{
"name": "New Hampshire",
"id": "255",
"size": "1",
"children": []
},
{
"name": "New Jersey",
"id": "256",
"size": "1",
"children": []
},
{
"name": "New Mexico",
"id": "257",
"size": "1",
"children": []
},
{
"name": "New York",
"id": "258",
"size": "1",
"children": []
},
{
"name": "North Carolina",
"id": "259",
"size": "1",
"children": []
},
{
"name": "North Dakota",
"id": "260",
"size": "1",
"children": []
},
{
"name": "Ohio",
"id": "261",
"size": "1",
"children": []
},
{
"name": "Oklahoma",
"id": "262",
"size": "1",
"children": []
},
{
"name": "Oregon",
"id": "263",
"size": "1",
"children": []
},
{
"name": "Rhode Island",
"id": "264",
"size": "1",
"children": []
},
{
"name": "South Carolina",
"id": "265",
"size": "1",
"children": []
},
{
"name": "South Dakota",
"id": "266",
"size": "1",
"children": []
},
{
"name": "Tennessee",
"id": "267",
"size": "1",
"children": []
},
{
"name": "Vermont",
"id": "268",
"size": "1",
"children": []
},
{
"name": "Virginia",
"id": "269",
"size": "1",
"children": []
},
{
"name": "West Virginia",
"id": "270",
"size": "1",
"children": []
},
{
"name": "Wisconsin",
"id": "271",
"size": "1",
"children": []
},
{
"name": "Wyoming",
"id": "272",
"size": "1",
"children": []
}
]
},
{
"name": "Canada",
"id": "219",
"size": "1",
"children": []
},
{
"name": "Mexico",
"id": "273",
"size": "1",
"children": []
}
]
},
{
"name": "Asia",
"id": "279",
"size": "1",
"children": [
{
"name": "Hong Kong",
"id": "221",
"size": "1",
"children": []
},
{
"name": "Israel",
"id": "223",
"size": "1",
"children": []
},
{
"name": "Nepal",
"id": "224",
"size": "1",
"children": []
}
]
},
{
"name": "South America",
"id": "290",
"size": "1",
"children": [
{
"name": "Peru",
"id": "291",
"size": "1",
"children": []
},
{
"name": "Brazil",
"id": "292",
"size": "1",
"children": []
}
]
},
{
"name": "New Zealand",
"id": "375",
"size": "1",
"children": []
}
]
},
{
"name": "Recovery Articles",
"id": "464",
"size": "1",
"children": []
},
{
"name": "Assess your addiction",
"id": "465",
"size": "1",
"children": []
}
]
},
{
"name": "Recovery Journals",
"id": "467",
"size": "1",
"children": [
{
"name": "Alcohol R&A Journals",
"id": "468",
"size": "614",
"children": []
},
{
"name": "Amphetamines R&A Journals",
"id": "469",
"size": "562",
"children": []
},
{
"name": "Cannabinoids R&A Journals",
"id": "470",
"size": "572",
"children": []
},
{
"name": "Downers R&A Journals",
"id": "471",
"size": "378",
"children": []
},
{
"name": "Opiate R&A Journals",
"id": "472",
"size": "15033",
"children": []
},
{
"name": "Other Drug R&A Journals",
"id": "507",
"size": "522",
"children": []
}
]
}
]
}

index.coffee

treehue = (node, hue_range, fraction, rev) ->
  # 0 <= hue_range[0] <= hue_range[1]
  r = hue_range[1]-hue_range[0]
  node.hue = hue_range[0]+r/2
  
  if node.children?
    n = node.children.length
    ri = r/n
    child_hue_ranges = []
    half_n = Math.floor(n/2)
    for i in [0...half_n]
      child_hue_ranges.push [
        hue_range[0] + ri*i + ri*(1-fraction)/2,
        hue_range[0] + ri*(i+1) - ri*(1-fraction)/2
      ]
      child_hue_ranges.push [
        hue_range[0] + ri*(i+half_n) + ri*(1-fraction)/2,
        hue_range[0] + ri*(i+1+half_n) - ri*(1-fraction)/2
      ]
    
    # if n is odd we need to push the middle item
    if n%2 is 1
      child_hue_ranges.push [
        hue_range[0] + ri*(half_n) + ri*(1-fraction)/2,
        hue_range[0] + ri*(1+half_n) - ri*(1-fraction)/2
      ]
    
    child_hue_ranges.reverse() if rev
    
    for child, i in node.children
      treehue(child, child_hue_ranges[i], fraction, i % 2 is 0)
    
treelum = d3.scale.linear()
  .range([90,40])

treechroma = d3.scale.sqrt()
  .range([0,60])

svg = d3.select('svg')
width = svg.node().getBoundingClientRect().width
height = svg.node().getBoundingClientRect().height

# append a group for zoomable content
zoomable_layer = svg.append('g')

# define a zoom behavior
zoom = d3.behavior.zoom()
  .scaleExtent([1,1000]) # min-max zoom
  .on 'zoom', () ->
    # GEOMETRIC ZOOM
    zoomable_layer
      .attr
        transform: "translate(#{zoom.translate()})scale(#{zoom.scale()})"

# bind the zoom behavior to the main SVG
svg.call(zoom)

vis = zoomable_layer.append('g')
  .attr
    class: 'vis'
    transform: "translate(#{width/2-400},#{height/2-200})"

# [x, y, h] -> [-Math.sqrt(3)/2*x+Math.sqrt(3)/2*y, 0.5*x+0.5*y-h]
isometric = (_3d_p) -> [-Math.sqrt(3)/2*_3d_p[0]+Math.sqrt(3)/2*_3d_p[1], +0.5*_3d_p[0]+0.5*_3d_p[1]-_3d_p[2]]

cavalier = (_3d_p) -> [_3d_p[0]-_3d_p[2]/Math.sqrt(2), +_3d_p[1]-_3d_p[2]/Math.sqrt(2)]

parallelepipedon = (d) ->
  d.x = 0 if not d.x?
  d.y = 0 if not d.y?
  d.h = 0 if not d.h?
  d.dx = 10 if not d.dx?
  d.dy = 10 if not d.dy?
  d.dh = 10 if not d.dh?

  fb = cavalier [d.x, d.y, d.h],
  mlb = cavalier [d.x+d.dx, d.y, d.h],
  nb = cavalier [d.x+d.dx, d.y+d.dy, d.h],
  mrb = cavalier [d.x, d.y+d.dy, d.h],
  ft = cavalier [d.x, d.y, d.h+d.dh],
  mlt = cavalier [d.x+d.dx, d.y, d.h+d.dh],
  nt = cavalier [d.x+d.dx, d.y+d.dy, d.h+d.dh],
  mrt = cavalier [d.x, d.y+d.dy, d.h+d.dh]

  d.iso = {
    face_bottom: [fb, mrb, nb, mlb],
    face_left: [mlb, mlt, nt, nb],
    face_right: [nt, mrt, mrb, nb],
    face_top: [ft, mrt, nt, mlt],
    outline: [ft, mrt, mrb, nb, mlb, mlt],
    fb: fb,
    mlb: mlb,
    nb: nb,
    mrb: mrb,
    ft: ft,
    mlt: mlt,
    nt: nt,
    mrt: mrt
  }

  return d

ordering = (a,b) -> b.i - a.i

iso_layout = (data, shape, scale) ->
  scale = 1 if not scale?

  data.forEach (d) ->
    shape(d, scale)

  # this uses the treemap ordering in some way... (!!!)
  # also, use the index to obtain a total ordering
  data.sort ordering

path_generator = (d) -> 'M' + d.map((p)->p.join(' ')).join('L') + 'z'

DH = 9
PAD = 5

treemap = d3.layout.treemap()
  .size([800, 400])
  .value((d) -> d.size)
  .sort((a,b) -> ordering(b,a)) # same as before, but inverted
  .padding(PAD)
  .ratio(1/2)
  .round(false) # bugfix: d3 wrong ordering

color = d3.scale.category20c()

correct_x = d3.scale.linear()
  .domain([0, width])
  .range([0, width*1.2])
correct_y = d3.scale.linear()
  .domain([0, height])
  .range([0, height*1.1])

d3.json 'drugsforum.json', (tree) ->
  walk = (n, depth) ->
    n.dh = DH
    n.h = DH*depth
    
    n.splitted_name = n.name.split(' ')
    
    if not n.children?
      n.children = []
      
    size = +n.size
      
    if n.children.length > 0
      for child in n.children
        walk(child, depth+1)
      n.children.sort (a,b) -> a.size - b.size
      n.size = size + d3.sum n.children, (d) -> d.size
      
      n.children.unshift {
        dh: 0,
        h: DH*(depth+1),
        name: n.name,
        splitted_name: n.splitted_name,
        size: size,
        leaves: true
      }
    

  walk(tree, 0)
  
  # depth-first enumeration
  i = 0
  walk_i = (n) ->
    if n.children?
      for child in n.children
        walk_i(child)
    n.i = i
    i += 1

  walk_i(tree)
  
  treehue(tree, [180,720], 0.7)
  treelum
    .domain([0, 3])
  treechroma
    .domain([0, 3])
  
  data = treemap.nodes(tree)
  iso_layout(data, parallelepipedon)

  data.forEach (d, i) ->
    # save the template color
    if d.leaves? and d.leaves
      depth = d.depth-1
    else
      depth = d.depth
      
    d.template_color = d3.hcl(d.hue, treechroma(depth), treelum(depth))
  
  pipedons = vis.selectAll('.pipedon')
    .data(data)

  enter_pipedons = pipedons.enter().append('g')
    .attr
      class: 'pipedon'
    .classed('leaves', (d) -> d.leaves? and d.leaves)

  enter_pipedons.append('path')
    .attr
      class: 'iso face bottom'
      d: (d) -> path_generator(d.iso.face_bottom)

  enter_pipedons.append('path')
    .attr
      class: 'iso face left'
      d: (d) -> path_generator(d.iso.face_left)
      fill: (d) -> d.template_color

  enter_pipedons.append('path')
    .attr
      class: 'iso face right'
      d: (d) -> path_generator(d.iso.face_right)
      fill: (d) -> d3.hcl(d.template_color.h, d.template_color.c, d.template_color.l-12)

  enter_pipedons.append('path')
    .attr
      class: 'iso face top'
      d: (d) -> path_generator(d.iso.face_top)
      fill: (d) -> d3.hcl(d.template_color.h, d.template_color.c, d.template_color.l+12)

  enter_labels_g = enter_pipedons.append('g')
  	.classed('hidden', (d) -> d.children?)

  enter_labels = enter_labels_g.append('svg')
    .attr
      class: 'label'

  enter_texts = enter_labels.append('text')
    
  tspans = enter_texts.selectAll('tspan')
    .data((d) -> d.splitted_name)
    
  tspans.enter().append('tspan')
    .text((d) -> d.toUpperCase())
    .attr
      x: 0
      y: (d, i) ->
        l = d3.select(this.parentNode).datum().splitted_name.length
        return (i-l/2) + 'em'
    
  enter_texts
    .each (node) ->
      bbox = this.getBBox()
      bbox_aspect = bbox.width / bbox.height

      node_bbox = {width: node.dx, height: node.dy}
      node_bbox_aspect = node_bbox.width / node_bbox.height

      rotate = bbox_aspect >= 1 and node_bbox_aspect < 1 or bbox_aspect < 1 and node_bbox_aspect >= 1
      node.label_bbox = {
        x: bbox.x+(bbox.width-correct_x(bbox.width))/2,
        y: bbox.y+(bbox.height-correct_y(bbox.height))/2,
        width: correct_x(bbox.width),
        height: correct_y(bbox.height)
      }

      if rotate
        node.label_bbox = {
          x: node.label_bbox.y,
          y: node.label_bbox.x,
          width: node.label_bbox.height,
          height: node.label_bbox.width
        }      
        d3.select(this).attr('transform', 'rotate(90) translate(0,28)')

  enter_labels
    .each (d) ->
      d.iso_x = cavalier([d.x+d.dx/2, d.y+d.dy/2, d.h+d.dh])[0]-d.dx/2
      d.iso_y = cavalier([d.x+d.dx/2, d.y+d.dy/2, d.h+d.dh])[1]-d.dy/2

  enter_labels
    .attr
      x: (d) -> d.iso_x
      y: (d) -> d.iso_y
      width: (node) -> node.dx
      height: (node) -> node.dy
      viewBox: (node) -> "#{node.label_bbox.x} #{node.label_bbox.y} #{node.label_bbox.width} #{node.label_bbox.height}"
      preserveAspectRatio: 'none'
      fill: (d) -> d3.hcl(d.template_color.h, d.template_color.c, d.template_color.l-12)

#   enter_labels_g
#     .attr
#       transform: (d) -> "translate(#{d.iso_x+d.dx/2},#{d.iso_y+d.dy/2}) scale(1, #{1/Math.sqrt(3)}) translate(#{-(d.iso_x+d.dx/2)},#{-(d.iso_y+d.dy/2)})"

  enter_pipedons.append('path')
    .attr
      class: 'iso outline'
      d: (d) -> path_generator(d.iso.outline)

  enter_pipedons.append('title')
    .text((d) -> d.name)

index.css

.iso.outline {
  stroke: #111;
  fill: none;
  vector-effect: non-scaling-stroke;
}
.leaves .iso.outline {
  display: none;
}

.label {
  pointer-events: none;
  text-anchor: middle;
  font-family: Impact;
}

.pipedon:hover .label {
  fill: black;
}
.pipedon:hover .face {
  fill: yellow;
}

.hidden {
  display: none;
}

index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Cassandra forum structure II cavalier</title>
    <script src="http://d3js.org/d3.v3.min.js"></script>
    <link rel="stylesheet" href="index.css">
  </head>
  <body>
    <svg width="960px" height="500px"></svg>
    <script src="index.js"></script>
  </body>
</html>

index.js

// Generated by CoffeeScript 1.10.0
(function() {
  var DH, PAD, cavalier, color, correct_x, correct_y, height, iso_layout, isometric, ordering, parallelepipedon, path_generator, svg, treechroma, treehue, treelum, treemap, vis, width, zoom, zoomable_layer;

  treehue = function(node, hue_range, fraction, rev) {
    var child, child_hue_ranges, half_n, i, j, k, len, n, r, ref, ref1, results, ri;
    r = hue_range[1] - hue_range[0];
    node.hue = hue_range[0] + r / 2;
    if (node.children != null) {
      n = node.children.length;
      ri = r / n;
      child_hue_ranges = [];
      half_n = Math.floor(n / 2);
      for (i = j = 0, ref = half_n; 0 <= ref ? j < ref : j > ref; i = 0 <= ref ? ++j : --j) {
        child_hue_ranges.push([hue_range[0] + ri * i + ri * (1 - fraction) / 2, hue_range[0] + ri * (i + 1) - ri * (1 - fraction) / 2]);
        child_hue_ranges.push([hue_range[0] + ri * (i + half_n) + ri * (1 - fraction) / 2, hue_range[0] + ri * (i + 1 + half_n) - ri * (1 - fraction) / 2]);
      }
      if (n % 2 === 1) {
        child_hue_ranges.push([hue_range[0] + ri * half_n + ri * (1 - fraction) / 2, hue_range[0] + ri * (1 + half_n) - ri * (1 - fraction) / 2]);
      }
      if (rev) {
        child_hue_ranges.reverse();
      }
      ref1 = node.children;
      results = [];
      for (i = k = 0, len = ref1.length; k < len; i = ++k) {
        child = ref1[i];
        results.push(treehue(child, child_hue_ranges[i], fraction, i % 2 === 0));
      }
      return results;
    }
  };

  treelum = d3.scale.linear().range([90, 40]);

  treechroma = d3.scale.sqrt().range([0, 60]);

  svg = d3.select('svg');

  width = svg.node().getBoundingClientRect().width;

  height = svg.node().getBoundingClientRect().height;

  zoomable_layer = svg.append('g');

  zoom = d3.behavior.zoom().scaleExtent([1, 1000]).on('zoom', function() {
    return zoomable_layer.attr({
      transform: "translate(" + (zoom.translate()) + ")scale(" + (zoom.scale()) + ")"
    });
  });

  svg.call(zoom);

  vis = zoomable_layer.append('g').attr({
    "class": 'vis',
    transform: "translate(" + (width / 2 - 400) + "," + (height / 2 - 200) + ")"
  });

  isometric = function(_3d_p) {
    return [-Math.sqrt(3) / 2 * _3d_p[0] + Math.sqrt(3) / 2 * _3d_p[1], +0.5 * _3d_p[0] + 0.5 * _3d_p[1] - _3d_p[2]];
  };

  cavalier = function(_3d_p) {
    return [_3d_p[0] - _3d_p[2] / Math.sqrt(2), +_3d_p[1] - _3d_p[2] / Math.sqrt(2)];
  };

  parallelepipedon = function(d) {
    var fb, ft, mlb, mlt, mrb, mrt, nb, nt;
    if (d.x == null) {
      d.x = 0;
    }
    if (d.y == null) {
      d.y = 0;
    }
    if (d.h == null) {
      d.h = 0;
    }
    if (d.dx == null) {
      d.dx = 10;
    }
    if (d.dy == null) {
      d.dy = 10;
    }
    if (d.dh == null) {
      d.dh = 10;
    }
    fb = cavalier([d.x, d.y, d.h], mlb = cavalier([d.x + d.dx, d.y, d.h], nb = cavalier([d.x + d.dx, d.y + d.dy, d.h], mrb = cavalier([d.x, d.y + d.dy, d.h], ft = cavalier([d.x, d.y, d.h + d.dh], mlt = cavalier([d.x + d.dx, d.y, d.h + d.dh], nt = cavalier([d.x + d.dx, d.y + d.dy, d.h + d.dh], mrt = cavalier([d.x, d.y + d.dy, d.h + d.dh]))))))));
    d.iso = {
      face_bottom: [fb, mrb, nb, mlb],
      face_left: [mlb, mlt, nt, nb],
      face_right: [nt, mrt, mrb, nb],
      face_top: [ft, mrt, nt, mlt],
      outline: [ft, mrt, mrb, nb, mlb, mlt],
      fb: fb,
      mlb: mlb,
      nb: nb,
      mrb: mrb,
      ft: ft,
      mlt: mlt,
      nt: nt,
      mrt: mrt
    };
    return d;
  };

  ordering = function(a, b) {
    return b.i - a.i;
  };

  iso_layout = function(data, shape, scale) {
    if (scale == null) {
      scale = 1;
    }
    data.forEach(function(d) {
      return shape(d, scale);
    });
    return data.sort(ordering);
  };

  path_generator = function(d) {
    return 'M' + d.map(function(p) {
      return p.join(' ');
    }).join('L') + 'z';
  };

  DH = 9;

  PAD = 5;

  treemap = d3.layout.treemap().size([800, 400]).value(function(d) {
    return d.size;
  }).sort(function(a, b) {
    return ordering(b, a);
  }).padding(PAD).ratio(1 / 2).round(false);

  color = d3.scale.category20c();

  correct_x = d3.scale.linear().domain([0, width]).range([0, width * 1.2]);

  correct_y = d3.scale.linear().domain([0, height]).range([0, height * 1.1]);

  d3.json('drugsforum.json', function(tree) {
    var data, enter_labels, enter_labels_g, enter_pipedons, enter_texts, i, pipedons, tspans, walk, walk_i;
    walk = function(n, depth) {
      var child, j, len, ref, size;
      n.dh = DH;
      n.h = DH * depth;
      n.splitted_name = n.name.split(' ');
      if (n.children == null) {
        n.children = [];
      }
      size = +n.size;
      if (n.children.length > 0) {
        ref = n.children;
        for (j = 0, len = ref.length; j < len; j++) {
          child = ref[j];
          walk(child, depth + 1);
        }
        n.children.sort(function(a, b) {
          return a.size - b.size;
        });
        n.size = size + d3.sum(n.children, function(d) {
          return d.size;
        });
        return n.children.unshift({
          dh: 0,
          h: DH * (depth + 1),
          name: n.name,
          splitted_name: n.splitted_name,
          size: size,
          leaves: true
        });
      }
    };
    walk(tree, 0);
    i = 0;
    walk_i = function(n) {
      var child, j, len, ref;
      if (n.children != null) {
        ref = n.children;
        for (j = 0, len = ref.length; j < len; j++) {
          child = ref[j];
          walk_i(child);
        }
      }
      n.i = i;
      return i += 1;
    };
    walk_i(tree);
    treehue(tree, [180, 720], 0.7);
    treelum.domain([0, 3]);
    treechroma.domain([0, 3]);
    data = treemap.nodes(tree);
    iso_layout(data, parallelepipedon);
    data.forEach(function(d, i) {
      var depth;
      if ((d.leaves != null) && d.leaves) {
        depth = d.depth - 1;
      } else {
        depth = d.depth;
      }
      return d.template_color = d3.hcl(d.hue, treechroma(depth), treelum(depth));
    });
    pipedons = vis.selectAll('.pipedon').data(data);
    enter_pipedons = pipedons.enter().append('g').attr({
      "class": 'pipedon'
    }).classed('leaves', function(d) {
      return (d.leaves != null) && d.leaves;
    });
    enter_pipedons.append('path').attr({
      "class": 'iso face bottom',
      d: function(d) {
        return path_generator(d.iso.face_bottom);
      }
    });
    enter_pipedons.append('path').attr({
      "class": 'iso face left',
      d: function(d) {
        return path_generator(d.iso.face_left);
      },
      fill: function(d) {
        return d.template_color;
      }
    });
    enter_pipedons.append('path').attr({
      "class": 'iso face right',
      d: function(d) {
        return path_generator(d.iso.face_right);
      },
      fill: function(d) {
        return d3.hcl(d.template_color.h, d.template_color.c, d.template_color.l - 12);
      }
    });
    enter_pipedons.append('path').attr({
      "class": 'iso face top',
      d: function(d) {
        return path_generator(d.iso.face_top);
      },
      fill: function(d) {
        return d3.hcl(d.template_color.h, d.template_color.c, d.template_color.l + 12);
      }
    });
    enter_labels_g = enter_pipedons.append('g').classed('hidden', function(d) {
      return d.children != null;
    });
    enter_labels = enter_labels_g.append('svg').attr({
      "class": 'label'
    });
    enter_texts = enter_labels.append('text');
    tspans = enter_texts.selectAll('tspan').data(function(d) {
      return d.splitted_name;
    });
    tspans.enter().append('tspan').text(function(d) {
      return d.toUpperCase();
    }).attr({
      x: 0,
      y: function(d, i) {
        var l;
        l = d3.select(this.parentNode).datum().splitted_name.length;
        return (i - l / 2) + 'em';
      }
    });
    enter_texts.each(function(node) {
      var bbox, bbox_aspect, node_bbox, node_bbox_aspect, rotate;
      bbox = this.getBBox();
      bbox_aspect = bbox.width / bbox.height;
      node_bbox = {
        width: node.dx,
        height: node.dy
      };
      node_bbox_aspect = node_bbox.width / node_bbox.height;
      rotate = bbox_aspect >= 1 && node_bbox_aspect < 1 || bbox_aspect < 1 && node_bbox_aspect >= 1;
      node.label_bbox = {
        x: bbox.x + (bbox.width - correct_x(bbox.width)) / 2,
        y: bbox.y + (bbox.height - correct_y(bbox.height)) / 2,
        width: correct_x(bbox.width),
        height: correct_y(bbox.height)
      };
      if (rotate) {
        node.label_bbox = {
          x: node.label_bbox.y,
          y: node.label_bbox.x,
          width: node.label_bbox.height,
          height: node.label_bbox.width
        };
        return d3.select(this).attr('transform', 'rotate(90) translate(0,28)');
      }
    });
    enter_labels.each(function(d) {
      d.iso_x = cavalier([d.x + d.dx / 2, d.y + d.dy / 2, d.h + d.dh])[0] - d.dx / 2;
      return d.iso_y = cavalier([d.x + d.dx / 2, d.y + d.dy / 2, d.h + d.dh])[1] - d.dy / 2;
    });
    enter_labels.attr({
      x: function(d) {
        return d.iso_x;
      },
      y: function(d) {
        return d.iso_y;
      },
      width: function(node) {
        return node.dx;
      },
      height: function(node) {
        return node.dy;
      },
      viewBox: function(node) {
        return node.label_bbox.x + " " + node.label_bbox.y + " " + node.label_bbox.width + " " + node.label_bbox.height;
      },
      preserveAspectRatio: 'none',
      fill: function(d) {
        return d3.hcl(d.template_color.h, d.template_color.c, d.template_color.l - 12);
      }
    });
    enter_pipedons.append('path').attr({
      "class": 'iso outline',
      d: function(d) {
        return path_generator(d.iso.outline);
      }
    });
    return enter_pipedons.append('title').text(function(d) {
      return d.name;
    });
  });

}).call(this);

thumbnail.png