function footballChart()

in ArticleTemplates/assets/js/bootstraps/football.js [6:90]
69 lines of code
5 McCabe index (conditional complexity)

function footballChart(homeTeam, awayTeam) {
    const pieChart = document.getElementsByClassName('pie-chart--possession')[0];

    const data = [
        [awayTeam, (pieChart && pieChart.getAttribute('data-away')) || null, 'away'],
        [homeTeam, (pieChart && pieChart.getAttribute('data-home')) || null, 'home']
    ];

    const width = 250;
    const height = 250;
    const radius = Math.min(height, width) / 2;

    const arcShape = arc()
        .outerRadius(radius)
        .innerRadius(radius / 3);

    const pieShape = pie()
        .sort(null)
        .value(d => d[1]);

    const // Init d3 chart
        vis = select('.pie-chart')
            .attr('preserveAspectRatio', 'xMinYMin slice')
            .attr('viewBox', '0 0 250 250')
            .append('g')
            .attr('class', 'pie-chart__inner')
            .attr('transform', `translate(${width / 2},${width / 2})`);

    // Add percentage symbol to center
    vis.append('text')
        .attr('class', 'pie-chart__key')
        .text('%')
        .attr('transform', 'translate(-18,15)');

    // Background
    const backgroundData = [['null', 100]];

    const backgroundarc = arc()
        .outerRadius(radius - 1)
        .innerRadius((radius / 3) + 1);

    vis.append('path')
        .data(pieShape(backgroundData))
        .attr('class', 'pie-chart__pie')
        .attr('d', backgroundarc);

    // Draw Segements
    const g = vis.selectAll('.pie-chart__segment')
        .data(pieShape(data))
        .enter().append('g')
        .attr('class', 'pie-chart__segment');

    g.append('path')
        .attr('class', d => `pie-chart__segment-arc pie-chart__segment-arc--${d.data[2]}`)
        .attr('d', arcShape);

    // Add Text Labels
    const tblock = vis.selectAll('.pie-chart__label')
        .data(pieShape(data))
        .enter().append('foreignObject')
        .attr('class', d => `pie-chart__label pie-chart__label--${d.data[2]}`)
        .attr('width', 75)
        .attr('height', 50)
        .attr('text-anchor', 'middle')
        .attr('transform', d => {
            d.innerRadius = 0;
            d.outerRadius = radius;
            let textpoint = arcShape.centroid(d);
            textpoint = [textpoint[0] - 35, textpoint[1] - 25];
            return `translate(${textpoint})`;
        });

    tblock.append('xhtml:div')
        .attr('class', 'pie-chart__label-text')
        .attr('width', '50')
        .attr('x', 0)
        .attr('dy', '1.2em')
        .text(d => d.data[0]);

    tblock.append('xhtml:div')
        .attr('class', 'pie-chart__label-value')
        .attr('x', 0)
        .attr('dy', '1.2em')
        .text(d => d.data[1]);
}