Question

我已经研究了很多关于谷歌饼图和隐藏的切片标签，但没有找到切片外面的标签，所以我希望有另一种解决方案而不是{{3 }} already suggested。

我生成了许多不同的图表类型，为了更好的可读性，我自定义了pie（doghnut）图表，以便在切片外部显示标签，并用线条连接。现在正如其他问题中所见，谷歌图表只会隐藏切片标签，如果没有空间或者价值太小，这对我来说是不可接受的，为什么我想把它们展示在应该有足够空间的地方。< / p>

仍然谷歌排行榜不喜欢＆＃34;未成年人＆＃34;即使sliceVisibilityThreshold设置为0，数据值也不会显示其标签，是否还有其他解决方案，请考虑以下设置？（你应该看到标签＆＃34;远＆＃34;紫罗兰切片没有渲染）

＆＃13;

var chartData = {
    "options": {
      "legend": {
        "position": "none"
      },
      "pieHole": 0.5
    },
    "data": [
      [
        "Label 1",
        "Label 2"
      ],
      [
        "Foo",
        33059
      ],
      [
        "Bar",
        57893
      ],
      [
        "Baz",
        8135
      ],
      [
        "Boo",
        12211
      ],
      [
        "Far",
        3740
      ],
      [
        "Faz",
        7219
      ]
    ]
  },
  ctx = document.getElementById('canvas');

var onLoadGoogle = function() {
  var data = new google.visualization.arrayToDataTable(chartData.data);
  var chart = new google.visualization['PieChart'](ctx);
  var options = chartData.options;

  options.legend.position = 'labeled';
  options.pieSliceText = 'none';
  options.sliceVisibilityThreshold = 0;

  chart.draw(data, chartData.options);
}

window.google.load("visualization", "1.1", {
  packages: ["corechart"],
  callback: onLoadGoogle,
  nocss: true
});

＆＃13;

#canvas {
  width: 600px;
  height: 300px;
}

＆＃13;

<div id="canvas"></div>
<script src="https://www.google.com/jsapi"></script>

＆＃13;

Answer 1

如documentation for PieChart中所述，pieStartAngle选项可以帮助为某些标签腾出空间，但如果空间不足，则无法做任何事情。这适用于切片内的默认标签和您正在使用的标记图例选项。

您还可以尝试使用pieSliceTextStyle和legend.textStyle将fontSize选项设置为较小的字体。

谷歌饼图强制渲染馅饼外的“次要”标签

1 个答案: