Question

我正在使用odoo10。当我进入树状视图然后单击图表时，然后单击饼图图标。饼图标签在某些点上重叠。我试图在/web/static/nvd3/nv.d3.js文件中解决一些问题，但是它给了我错误或n效果。谁能帮助我如何在不将文本重叠在饼图上的情况下实现这一目标？

/ * 重叠的饼形标签不好。这样做的目的是防止重叠。每个标签位置都经过哈希处理，如果发生哈希冲突，我们会假设发生重叠。调整标签的y位置以消除重叠。 * / 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)'
}

以上代码给了我所有以饼图中间/中心为中心的文本标签，它们相互重叠。如果删除.rotateLabels（-45），则标签在饼图圆之外，但某些文本彼此重叠。预先感谢！

Answer 1

这对我有用。不要像我在问题中应用的那样应用rotateLabels（-45）。如下所示在nv.d3.js文件中设置ShowLabels = true和labelSunbeamLayout = true。

//============================================================
// 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')
    ;

如何避免Odoo 10 NVD3饼图中的文本重叠

1 个答案: