2

我的 Google PieChart pieSliceText 位置有问题。它重叠在页面上，而不是完全重叠在 PieChart 本身上。

看这张截图照片：

在此处输入图像描述

我什至将字体调整为更小，但同样的问题： 在此处输入图像描述

由于波动的数据值和百分比，我想避免调整“pieStartAngle”属性，因为我认为它看起来很傻。

有没有办法将“男性”的标签移动到饼图上，而不是在“无人区”中重叠？我希望这很容易（就像谷歌条形图一样），但事实并非如此。

这是我的图表选项的样子：

var colors = ["#B5ACCE", "#61B036"]; //green and purple colors

var data = google.visualization.arrayToDataTable([
    ['Type',     'Count'],
    ['Male',      parseInt(_maleEnrollment)],
    ['Female',    parseInt(_femaleEnrollment)]
]);

//chart options 
var chartOptions = { 
     title: 'Gender' 
    ,pieSliceText: 'label' 
    ,pieSliceTextStyle: { color: 'black', fontName: 'Arial', fontSize: 20 } 
    ,colors: colors 
    ,backgroundColor: 'transparent' 
    ,legend: { textStyle: { color: 'black', fontName: 'Arial', fontSize: 14 } } 
    ,chartArea: { left: 0, 'width': '100%', 'height': '100%' } 
    ,enableInteractivity: false 
};
4

2 回答 2

2

我似乎在我的谷歌图表饼图中定位标签时偶然发现了同样的错误。经过一番摸索，我意识到我正在执行 chart.draw() 函数，而目标 div 元素是隐藏的。然后，我会切换图表元素并注意不稳定的格式。

在绘制图表之前调整我的 javascript 以等待显示 div 解决了我的问题。

前：

前

后：

后

于 2019-12-09T19:59:43.697 回答
0

为了获得关于图例的灵活性，您可能只想将其关闭并使用 html 创建您自己的图例，或者利用https://developers.google.com/chart/interactive/docs/customizing_charts中的 API 中的其他预设选项

于 2016-04-14T18:38:03.397 回答