Introduction

Foreword

This final project might be different than other submissions as it is a real use case from my employer (data anonymised). My employer is getting more and more into data science services and one of the tasks was data visualisation task which I was assigned to. Although due to the anonymisation the "narrative" is severely impeded, I still chose this project to give a real life example and show how Udacity's course actually build the fundament to pursue this project.
Our client needed an interactive visualisation to gain an overview which of his products and services are integrated into which websites. The main diagram is on page2.html. The Services arcs have a lighter color and no chords because they are passive – they have been integrated into the companies.
I used d3.js to produce chord diagrams. I had no prior experience except of Udacity's teaching prior to this final project. The customer was very pleased with the result and entrusted us to build several more chord diagrams. I must admin it was a very steep learning curve. I had huge problems to modify the chord diagram to group chords. Either for “Super Arcs” or for grouping arcs via colours. Also adding and CENTRALISING text into arcs was extremely tough for me. However, learning some new plain vanilla javascript was very pleasing (e.g. double parenthesis when calling a function).
Another issue for novices is that most examples in D3 are still in v3 although v4 was released nearly a year ago. Countless hours were invested to make v3 examples work with v4. I would have never expected too have huge issues in D3 with mundande tasks like centralising text. However, now I feel more confident with this powerful framework and can't wait to create new visualisations with it.

References

Stack Overflow Questions