Question

我有一个Google饼图，图例位置设置为标签。我的目标是使所有文本和图例标记行变黑。现在，线是灰色的，值和百分比的数字也是。有什么办法可以使这些全部变黑吗？

var options = {
		  pieHole: 0.5,
		  pieSliceText: 'none',
		  textStyle:{color: 'black'},
		  legend: {position:'labeled', labeledValueText: 'both', alignment:'center',
        	textStyle: {
                  color: 'black', 
                  fontSize: 12}, strokeColor: {color: 'black'},  
              },
};

Here is an example of the gray text and line marker I'm trying to make all black

Answer 1

我需要Mutationobserver，因为Google图表没有内置用于更改这些属性的命令。

var container = document.getElementById('pie_chart');
    var chart = new google.visualization.PieChart(container);
    chart.draw(view, options, observer);

		var observer = new MutationObserver(function () {
      $.each($('#pie_chart path[stroke="#636363"]'), function (index, path) {
        $(path).attr('stroke', '#000000');
      });
	  $.each($('#pie_chart path[fill="#636363"]'), function (index, path) {
        $(path).attr('fill', '#000000');
      });
      $.each($('#pie_chart text[fill="#9e9e9e"]'), function (index, label) {
        $(label).attr('fill', '#000000');
      });
    });
    observer.observe(container, {
      attributes: true,
      childList: true,
      subtree: true
    });

并将其添加到标题中。

<script src="//cdn.jsdelivr.net/npm/mutationobserver-shim/dist/mutationobserver.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Here is the source of the code

Google饼图图例标有线条颜色

1 个答案: