dc-js / dc.js

Multi-Dimensional charting built to work natively with crossfilter rendered with d3.js
Apache License 2.0
7.42k stars 1.81k forks source link

dc sunburst chart - externalLabels not working #1867

Open rfx77 opened 2 years ago

rfx77 commented 2 years ago

when i set the externalLabels on a sunburst chart all labels are displayed in the center of the chart.

the problem is that startAngle and endAngle is not set on the d3Shape.arc in the function _labelPositon. when i change to

_labelPosition (d, _arc) {
          let centroid;
          if (this._externalLabelRadius) {
              centroid = d3Shape.arc()
                  .startAngle(d => d.x0)
                  .endAngle(d => d.x1)
                  .outerRadius(this._radius + this._externalLabelRadius)
                  .innerRadius(this._radius + this._externalLabelRadius)
                  .centroid(d);
          } else {
              centroid = _arc.centroid(d);
          }
          if (isNaN(centroid[0]) || isNaN(centroid[1])) {
              return 'translate(0,0)';
          } else {
              return `translate(${centroid})`;
          }
      }

the labels are displayed but labels of each path in the tree overwrite each other. so the position in the path should be taken into account.

versions: "d3": "^6.6.2", "dc": "^4.2.7"