Вращение текста на точечной диаграмме

Используя этот пример, я смог создать точечную диаграмму D3 с текстовыми метками с точками рассеяния.

Я хотел бы повернуть каждую метку в определенной степени, однако, когда я пытаюсь это сделать, весь текст в целом вращается по одной оси, а не по отдельной оси.

Вот мой код:

svg.selectAll("circle")
    .data(data)
    .enter()
    .append('circle')
        .attr('fill', '#4E5FF3')
        .attr('stroke', 'none')
        .attr('cx', d => { return x(Date.parse(d.date)) })
        .attr('cy', d => { return y(d.totalValue) })
        .attr('r', 3);
svg.selectAll("text")
    .data(data)
    .enter()
    .append('text')
        .attr('x', d => { return x(Date.parse(d.date)) })
        .attr('y', d => { return y(d.totalValue) })
        .text(d => {
            return 'Total: ' + d.totalValue + ' - Month: ' + d.monthValue;
        })
        .attr('transform','rotate(5)translate(0, 0)');

Как преобразовать каждую метку на отдельной оси, а не все метки на одной оси?