Custome legend for antd pie chart - reactjs

currently, I have a pie chart which is display the data like this
(https://i.stack.imgur.com/E1geb.png)
this is my config now
(https://i.stack.imgur.com/61cP6.png)
what I want is to display the value of each piece next to label

Related

How to create multilines legend in Data Studio

In Data Studio my 10 points pie chart is like below:
As you can see there is a navigation arrow in the legend at the top of the pie.
I wonder how can I avoid the navigation by creating the multiline legend? How can I wrap the current single line legend?
Three ways to display all items in the legend; located in the Style Tab of the Pie Chart (added a GIF to elaborate):
Increasing the max lines;
Increasing the width of the Pie Chart;
Reducing the font size of the legend.
EDIT: Multi line Legend (Workaround using a Bar Chart)
How about using the legend from a Bar Chart? Added a GIF to elaborate as well as a few points:
Bar Chart: Use a Dimension and Breakdown Dimension that's the same as the one on the Pie Chart and enable the legend (Top) as well as using 2 lines (no legend for the Pie Chart)
Shape: Add a Shape over the Bar Chart (one that blends in with the background)
Order: Right click on components and select Order from the drop down to change the order of the components (Bar Chart: Send to back; Shape: Send Backwards (behind the Pie Chart); Pie Chart: Bring to Front)
Fine Tuning: Use Shift + Movement for precision placement (to get the shape exactly where you want it)

React-native: Pull out a slice of victory pie

I used victory chart to create my chart. And I need to add an event that when I click on one of slices of pie chart, it would be pull out.
By any chance, is it possible?

JFree pie chart section label goes outside pie section

I am using JFreeChart to create pie charts. I want to set a label inside pie section.But some part of label goes out side of pie section. Please can any one help me? I want to set this label inside the section only.
plot.setLabelFont(new Font("SansSerif", Font.PLAIN, 12));
plot.setNoDataMessage("No data available");
plot.setCircular(true);
plot.setLabelPaint(Color.DARK_GRAY);
plot.setSimpleLabels(true);

Add Start up animation on Pie chart using angular-nvd3 chart library

I need to add Start up animation on Pie chart in angular-nvd3 chart library , it is possible to add animation to some parts but I could not set animation for pie chart .
here is sample code http://plnkr.co/edit/vtKWU0?p=preview

how do i capture the legend shape in google pie charts using jquery?

I am new to angularjs,i made a donut pie chart using google charts now i want to change the legend shape because default shape is circle but i needed square.
google chart append all code for pie charts on load when page render in browser ,so how can i capture the element for legend shape using jquery and change it from circle to square.The element for legend is really down in hierarchy inside the main div so how its possible.
my html for pie charts:
<div class="chart-container">
<div class="chart-title" style="padding-right:7em;">Total Calls</div>
<div google-chart chart="data"></div>
</div>
you can see in snapshot that how google chart append the pie chart inside my html.Inside svg element there is a g element and that g have some other g elements and first g is for legends.
any guide thanks

Resources