How to avoid text overlapping in odoo 10 nvd3 pie chart - odoo

Question

I am using odoo 10. When I go to tree view then charts then click on pie chart icon. Pie Labels are overlapping at some points. I tried to some work around in /web/static/nvd3/nv.d3.js file but it is either giving me errors or n effect. Could anyone help me how to achieve this without text overlapping on piechart?
/*
Overlapping pie labels are not good. What this attempts to do is, prevent overlapping.
Each label location is hashed, and if a hash collision occurs, we assume an overlap.
Adjust the label's y-position to remove the overlap.
*/
var center = labelsArc[i].centroid(d);
var percent = getSlicePercentage(d);
if (d.value && percent >= labelThreshold) {
var hashKey = createHashKey(center);
if (labelLocationHash[hashKey]) {
center[1] -= avgHeight;
}
labelLocationHash[createHashKey(center)] = true;
}
return 'translate(' + center + ').rotateLabels(-45)'
}
Above code giving me all text labels centered in piechart middle/centre overlapped on each other. if I remove .rotateLabels(-45) then labels are outside the pie circle but some text overlapping on each other. Thanks in advance!

Answer 1

This worked for me. Do not apply rotateLabels(-45) as I have applied in the question. set ShowLabels=true and labelSunbeamLayout=true as shown below in nv.d3.js file.
//============================================================
// Public Variables with Default Settings
//------------------------------------------------------------
var margin = {top: 0, right: 0, bottom: 0, left: 0}
, width = 500
, height = 500
, getX = function(d) { return d.x }
, getY = function(d) { return d.y }
, id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
, container = null
, color = nv.utils.defaultColor()
, valueFormat = d3.format(',.2f')
, showLabels = true
, labelsOutside = true
, labelType = "key"
, labelThreshold = .02 //if slice percentage is under this, don't show label
, donut = false
, title = false
, growOnHover = true
, titleOffset = 0
, labelSunbeamLayout = true
, startAngle = false
, padAngle = false
, endAngle = false
, cornerRadius = 0
, donutRatio = 0.5
, arcsRadius = []
, dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove', 'renderEnd')
;