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

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

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

enter image description here

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

.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

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

2
KnowledgeSeeker001 26 मार्च 2020, 19:22

1 उत्तर

सबसे बढ़िया उत्तर

मैंने आपके सभी <g> तत्वों पर मौजूद opacity:0.5 को हटाकर और माउस ईवेंट का उपयोग करके आर्क्स paths पर अपारदर्शिता को लागू करके इसे ठीक कर दिया, इसके बाद से मैंने टूलटिप को थोड़ा ऊपर ले जाया। चापों को घुमाना कठिन बना देता है, यहाँ एक कार्यशील है स्टैकब्लिट्ज

1
ROOT 26 मार्च 2020, 17:00