मेरे d3js पाई चार्ट में आर्क लेबल धुंधला क्यों है?

मेरे पास d3js का उपयोग करके एक पाइचार्ट तैयार किया गया है। चाप लेबल के लिए मैं निम्नलिखित शैली लागू कर रहा हूँ।

.pieChartOuterLabel {
  font-size: 1em;
  fill: black;
  font-weight: bold;
  font-family: 'Times New Roman, Times, serif';
}

मेरा पाई चार्ट इस तरह दिखता है। आप देख सकते हैं कि प्रतिशत टेक्स्ट लेबल धुंधले हैं (ऐसा लगता है कि मूल तत्वों पर लागू अन्य सीएसएस शैलियाँ इन लेबलों में अस्पष्टता को .5 पर सेट कर रही हैं)।

मैंने यह कोशिश की है लेकिन यह अच्छी तरह से काम नहीं किया।

.pieChartOuterLabel {
  font-size: 1em;
  fill: black;
  font-weight: bold;
  font-family: 'Times New Roman, Times, serif';
  opacity: 1 !important;
}

परियोजना यहाँ पर उपलब्ध है। मैं क्या उम्मीद करता हूं कि चाप लेबल उसी शैली में प्रदर्शित किए जाने चाहिए जो डोनट चार्ट के केंद्र पाठ में हैं।

https://stackblitz.com/edit/angular-6ufows

वास्तव में सराहना करते हैं अगर आप मदद कर सकते हैं तो धन्यवाद