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

【问题标题】：Mis-aligned labels/slice text in my Google Pie Charts我的 Google 饼图中未对齐的标签/切片文本
【发布时间】：2013-12-05 21:10:10
【问题描述】：

我正在使用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);

【问题讨论】：

我相信这是Chrome bug。我们（谷歌图表）有一个 hacky 工作，我们将在下一个版本中挑选出来，但这可能需要一些时间。因此，这将在接下来的几天/几周内神奇地自行修复。
啊对！我很高兴当时不只是我看到了这个错误，这不是我做错了什么:) 我喜欢它是一个谷歌产品的方式，但不一定能按照它在另一个谷歌产品中的预期方式工作......大声笑 -感谢您更新我！
我在 Firefox 中看到了同样的问题，所以它不是孤立于 Chrome 的。您是否有机会使用 Bootstrap？我认为这可能与此有关..
不幸的是，我没有使用 Bootstrap，所以对我来说它与那个无关......
在jsfiddle.net/WqFPF中找不到问题

标签： javascript charts google-visualization

【解决方案1】：

此问题已在 November 7, 2013 中修复，应该不会导致更多问题。

来自错误报告：

重现问题的步骤：

在开发检查器中突出显示主表左列中的任何单元格（例如包含“100”的单元格）

在页面上，突出显示的框显示宽度为 32，devtools 中的指标显示宽度为 32，单独的“标尺”扩展显示宽度为 32

预期的行为是什么？
该元素的 offsetWidth 也返回 32

出了什么问题？
offsetWidth 大大低于实际值，在这种情况下 offsetWidth 为 22。在其他情况下以任意数量关闭（例如，右上角的单元格与其下方的单元格相差 1px）。

【讨论】：