Team coherentie: CeIf

100%

Team coherentie: CeIf

✓ Published0🌍 Public

Last edited Jan 30, 2020

Created on Jan 30, 2020

This example uses a stretched chord diagram to show how tickets move between teams within the CeIf service for 2019. The left side lists the team that initially receives a ticket, while the right side shows the team that ultimately resolves it, based on data from 2,460 respondents. The visualization is built with D3 v3, using a custom `customChordLayout` and a modified `stretchedChord` path generator to pull the two halves apart. An animated linear gradient is applied to the SVG paths to suggest flow, and the chart responds to screen width by adapting its size and pull-out distance.

AI-generated description

An example of using the Circular Flow diagram with actual data, as explained in my blog on How to create a Flow diagram with a circular Twist

It shows what types of educations (on the left) lead to what types of occupations (on the right) about 1.5 years after graduating. The data is based on about 18000 HBO graduates in 2014 in the Netherlands used for the State of the State project

forked from <a href='http://bl.ocks.org/nbremer/'>nbremer</a>'s block: <a href='http://bl.ocks.org/nbremer/f9dacd23eece9d23669c'>Stretched Chord Diagram - From educations to occupations</a>

forked from <a href='http://bl.ocks.org/jonpage/'>jonpage</a>'s block: <a href='http://bl.ocks.org/jonpage/5db8f8367169112d0738'>Stretched Chord Diagram - From educations to occupations</a>

forked from <a href='http://bl.ocks.org/MisunoKitara/'>MisunoKitara</a>'s block: <a href='http://bl.ocks.org/MisunoKitara/abe8987858204fae859b0e07d4d3aa21'>2018: Stretched Chord Diagram ATAB</a>

forked from <a href='http://bl.ocks.org/MisunoKitara/'>MisunoKitara</a>'s block: <a href='http://bl.ocks.org/MisunoKitara/9140fb0e0d4cf7a3d02c1028e664541f'>2019: Stretched Chord Diagram ATAB</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Team coherentie 2021: CeIf

This interactive chord diagram shows team interactions for the CeIf service in 2021, distinguishing between the team that initially receives a ticket and the team that resolves it. The visualization uses a custom stretched chord layout to separate the two halves of the diagram, with animated gradients along the chords. It is built with D3 v3, using custom layout functions for chord sorting and stretching, and renders as SVG with hover effects that adjust chord opacity. The data is embedded as a matrix of ticket counts between teams, with dummy entries to create empty space in the circle.

MMisunoKitara

94% match

Loading thumbnail…

Team coherentie: CeIf

This example visualizes team interaction for the CeIf service in 2020, showing which team initially receives a ticket (left side) and which team resolves it (right side). Built with D3.js v3, it uses a custom-stretched chord layout to separate the two halves of the circular flow diagram, with animated gradients along the curved links. The matrix data includes 2,379 tickets among teams like Netwerken, Datacenter, and Servicepunt, with empty dummy groups used to balance the layout. Rendering uses SVG paths and animated linear gradients.

MMisunoKitara

91% match

Loading thumbnail…

Team coherentie: Ceif

This circular flow diagram visualizes team interactions within the Ceif service, showing which teams (on the left) resolve tickets originating from other teams (on the right). Built with D3.js v3, the visualization uses a stretched chord layout and animated SVG gradients to depict the flow of approximately 2,405 ticket interactions. The data is displayed in a bipartite layout, with a custom `customChordLayout` and `stretchedChord` function pulling the two halves apart for clarity. The matrix-driven diagram highlights the most significant team connections, omitting less active teams to maintain readability.

MMisunoKitara

91% match

Loading thumbnail…

Team coherentie: Ceif

This example visualizes team interaction for the Ceif service, distinguishing between the team that initiates a ticket and the team that resolves it. The chord diagram uses a custom layout to include dummy segments for empty space and a custom stretched chord function to pull the two halves of the circle apart. Built with D3 v3, the SVG animation uses linear gradients to create a moving light effect. The underlying matrix data is based on 2,178 respondents.

MMisunoKitara

90% match

Loading thumbnail…

Team coherentie: ATAB

This example uses a stretched chord diagram to show how tickets are transferred between teams within the ATAB department, mapping the team that initially receives a ticket (on the left) to the team that ultimately resolves it (on the right). Built with D3 v3 and custom layout functions, the visualization animates an SVG-based flow with an animated gradient along the chords, while hovering can highlight specific connections. The data consists of 4,443 ticket interactions among the department’s teams, with a dummy segment added to create visual balance. The diagram is rendered with two pulled-apart halves, using custom `customChordLayout` and `stretchedChord` functions to achieve the stretched effect.

MMisunoKitara

88% match

Loading thumbnail…

Team coherentie: FOOCES

This example visualizes team interactions for the FOOCES service in 2019, showing which teams initially receive tickets and which teams resolve them. It uses a stretched chord diagram to pull the two halves apart, with the left side representing the receiving teams and the right side the resolving teams. Built with D3.js v3, the chart uses a custom `customChordLayout` function and a custom `stretchedChord` function to create the separated arcs and animated gradients. The data is based on 11,146 tickets, with only the largest teams included for clarity.

MMisunoKitara

86% match

Loading thumbnail…

Team coherentie: KlaSCe

This example visualizes team interactions within the KlaSCe service for 2019, showing which team initially receives a ticket and which team resolves it. A stretched chord diagram separates the two sets of teams on the left and right, with the thickness of each chord representing the volume of handoffs. The visualization uses a custom layout and drawing function built on D3 v3, with data from approximately 53,333 respondents. An animated linear gradient highlights the direction of flow.

MMisunoKitara

86% match

Loading thumbnail…

Team coherentie: ATAB

This example visualizes team interaction for the ATAB service, showing which team initially receives a ticket versus which team resolves it. It uses a stretched chord diagram with two separated halves, displaying only the teams with the largest shares. The visualization is built with D3 v3 and the custom `customChordLayout` and `stretchedChord` functions, which control sorting and pull apart the chords. Data comes from 5,380 ticket records, and the SVG includes animated gradient effects via SMIL animations.

MMisunoKitara

86% match