javascript - 我的 Google 饼图中未对齐的标签/切片文本

Question

我正在使用 Google Charts以饼图的形式显示有关电子邮件的打开和点击的一些数据。我的饼图显示了正确的数据，但是饼图上的标签有问题。

我不知道为什么，但它没有对齐 - 决定标签不应该像往常一样位于切片的中间 (左图) .

有趣的是，尽管大多数时候我看到它没有对齐，但我注意到顶部切片的文本有几次正确对齐(主要是当我刚刚对代码进行更改时)，但随后它又回到了刷新后处于切片边缘 (右图) .



有谁知道如何正确定位这些，或者我正在做的事情是否会破坏定位？

function drawPieChartOpens() 
{

    var data = new google.visualization.arrayToDataTable([
        ['Opens','Count'],
        ['Opens',3988],
        ['Non Opens',21145]
    ]);

    var options = {
        'width':200,
        'height':300,
        'legend':'none',
        colors: ['#00933B','#DDDDDD'],
        slices: {0: {offset: 0.2}},
        'chartArea':{width:'100%'}
    };

    var chart = new google.visualization.PieChart(document.getElementById('opens-2782714'));
    chart.draw(data, options);
}

google.setOnLoadCallback(drawPieChartOpens);

Answer 1

此问题已在 November 7, 2013 中修复，它不应该引起更多问题。

从错误报告中:

Steps to reproduce the problem:

1. Highlight any cell in the main table's left column in dev inspector (e.g. the one containing "100")
2. On page, highlighted box shows width 32, metrics in devtools shows width 32, and a separate "ruler" extension shows width 32

What is the expected behavior?
That element's offsetWidth also returns 32

What went wrong?
offsetWidth is dramatically under the actual value, with offsetWidth of 22 in this case. Off by arbitrary amounts in other cases (e.g. upper-right cell and the one beneath it differ by 1px).