Положение текста многострочной диаграммы d3.js - PullRequest
Новая
       19

Положение текста многострочной диаграммы d3.js

0 голосов
/ 05 сентября 2018

Я рисую многострочную диаграмму d3 как прикрепленное изображение, но текст на диаграмме накладывается друг на друга.

Как разрешить фиолетовому тексту вверху оранжевый текст, когда данные рядом?

enter image description here

   lines.selectAll('circle-group')
      .data(data.metricCategorys)
      .enter()
      .append('g')
      .style('fill', (d, i) => lineColor[i])
      .selectAll('circle')
      .data(d => d.data)
      .enter()
      .append('g')
      .attr('class', 'circle')
      .each((d, i, n) => {
        d3.select(n[i])
          .append('circle')
          .attr('cx', xScale(d.xAxisValue))
          .attr('cy', yScale(d.yAxisValue))
          .attr('r', circleRadius);
        d3.select(n[i])
          .append('text')
          .attr('class', 'text')
          .attr('text-anchor', 'middle')
          .text(`${d.yAxisValue}`)
          .attr('x', xScale(d.xAxisValue))
          .attr('y', yScale(d.yAxisValue) - 8)
          .attr('font-family', 'Arial')
          .attr('font-weight', '900')
          .attr('font-size', '14px');
      });
  }
...