d3 Collapsible tree vertical

I have just finished playing around with M. Bostoc's collapsible tree. Here is a link to his original version.

This tree has a right to left orientation, and I wanted a top to bottom. He does provide an option for tree orientations here. 

Sources showing how to vertically orient it online, showcase a very simple non interactive tree. 

SO i just changed his original code a bit, just small x, y tweaks (mainly the diagonal and the node transitions). Quiet simple actually. And this is what it looks like. 

Also including the code and the hierarchical JSON object used. 

Hope this helps. :)

Comments

  1. deutschblitzJanuary 21, 2019 at 7:54 PM

    where is the code? and where is the demo? I would love to use this.

    ReplyDelete

Post a Comment

Popular posts from this blog

Accessing Coursera learning material offline

Image
So Coursera is awesome right? But one thing that really bothered me was that I was not able to access material offline. My commute is a whopping 3 hours so yeah, I could make use of that time to read up on stuff!! (Yes i do look out the window.....but still!) There is this repository on Github suggested by a co-worker that is excellent for this exact purpose. But getting up and running is a little difficult for someone who may be isn't into programming or may be new to Python as well. (Python is a language used to do a lot of stuff , but is popular for data analysis). Before you begin you will need a Coursera account and be enrolled (free or paid) in a course. So whatever be your background, do the following to get access to the learning material of your Coursera course offline. This will download the learning material to your computer in a very organized way and you will be able to read and watch videos without needing the internet. Oh also goes without saying
Read more

Adding and deleting Angular directives dynamically (Part 1)

Image
There comes a time in the development of angular applications when you get into the nitty -gritty of directives. Yes, of course, it was the first thing slammed at you when you started with angular and you soon began to enjoy using ng-this and ng-that. But now writi-'ng' one of those and manipulati-'ng' them dynamically? OMG!! Its like when someone threw this at your face. At first you say "Whaaaa?"  Then you lick a little off and say "Hmm!"  Then you lick some more and say "mmmmmmmmmmmmm" And then you're asked to make something like that. From scratch. My reaction? Alright alright, getting to the point! Ill use this post as the first of three posts, each post covering the following: 1. Write a directive (duh! aren't these a gazillion posts already?) But Ill be using this directive to explore # 2 and #3, hence the introduction.  2. Add a directive dynamically .  3. Remove a directive dynamically . Th
Read more