Google 图表 - 更改“更多”链接的颜色

Question

我制作了几个图表（饼图和条形图），由于空间限制，它们需要重新调整大小，这导致为图例部分添加了“1/2 \xe2\x96\xbc”。

\n\n

我在这里添加了我的代码：http://codepen.io/qtx/pen/EtHvi \n如果我的问题没有正确显示，这里是我的网站https://i.stack.imgur 的屏幕截图。 com/C45fQ.png，在我想要更改的内容周围画一个圆圈。\n（如果我超过 8 列，它也会显示在条形图中，如上面的示例所示）

\n\n

所以我的问题是，有什么方法可以改变该文本/链接的颜色吗？我似乎无法在网上或 api 文档中找到任何内容。

\n\n

任何帮助将不胜感激。

\n\n

    <script type="text/javascript">\n\n      // Load the Visualization API and the piechart package.\n      google.load(\'visualization\', \'1.0\', {\'packages\':[\'corechart\']});\n\n      // Set a callback to run when the Google Visualization API is loaded.\n      google.setOnLoadCallback(drawChart);\n\n      // Callback that creates and populates a data table,\n      // instantiates the pie chart, passes in the data and\n      // draws it.\n      function drawChart() {\n\n        // Create the data table.\n        var data = new google.visualization.arrayToDataTable([\n        [\'Task\', \'Hours per Day\'],\n        [\'Set 1\', 215],\n        [\'Set 2\', 83],\n        [\'Set 3\', 132],\n        [\'Set 4\', 72],\n        [\'Set 5\', 260],\n        [\'Set 6\', 34],\n        [\'Set 7\', 9],\n        [\'Set 8\', 24]\n        ]);\n        // Create the data table.\n        var data2 = new google.visualization.arrayToDataTable([\n        [\'Genre\', \'Set 1\', \'Set 2\', \'Set 3\', \'Set 4\', \'Set 5\', \'Set 6\', \'Set 7\',\'Set 8\',{ role: \'annotation\' } ],\n        [\'18/7\', 0, 0, 0, 0, 0, 0, 0, 2, \'\'],\n        [\'23/7\', 0, 0, 0, 0, 0, 0, 0, 1, \'\'],\n        [\'24/7\', 0, 0, 0, 0, 0, 0, 0, 4, \'\'],\n        [\'26/7\', 0, 0, 0, 0, 0, 0, 0, 4, \'\'],\n        [\'29/7\', 0, 0, 0, 0, 260, 0, 0, 0, \'\'],\n        [\'31/7\', 0, 0, 0, 0, 0, 0, 0, 1, \'\'],\n        [\'2/8\', 0, 0, 0, 0, 0, 0, 9, 0, \'\'],\n        [\'3/8\', 0, 0, 132, 0, 0, 0, 0, 0, \'\'],\n        [\'4/8\', 0, 0, 0, 0, 0, 0, 0, 11, \'\'],\n        [\'8/8\', 0, 0, 0, 0, 0, 0, 0, 0, \'\'],\n        [\'13/8\', 0, 83, 0, 0, 0, 0, 0, 0, \'\'],\n        [\'14/8\', 215, 0, 0, 0, 0, 0, 0, 0, \'\'],\n        [\'15/8\', 0, 0, 0, 72, 0, 0, 0, 0, \'\'],\n        [\'16/8\', 0, 0, 0, 0, 0, 34, 0, 0, \'\'],\n        ]);\n\n        // Set chart options\n        var options = {\n        title: \'% of photos\', fontSize: \'12\', backgroundColor: "transparent",\n        colors: [\'#F56363\', \'#eda15f\', \'#40C1A0\', \'#FFD586\', \'#81CFE0\', \'#fcfcfc\', \'#A06C90\', \'#FFCAD1\'],\n        };\n        // Set chart options\n        var options2 = {\n        title: \'# of photos\', backgroundColor: "transparent",\n        colors: [\'#F56363\', \'#eda15f\', \'#40C1A0\', \'#FFD586\', \'#81CFE0\', \'#fcfcfc\', \'#A06C90\', \'#FFCAD1\'],\n        legend: { position: \'bottom\', maxLines: 3 },\n        bar: { groupWidth: \'99%\' },\n        isStacked: true,\n        };\n\n        // Instantiate and draw our chart, passing in some options.\n        var chart = new google.visualization.PieChart(document.getElementById(\'chart_div\'));\n        chart.draw(data, options);\n        var chart2 = new google.visualization.ColumnChart(document.getElementById(\'chart_div2\'));\n        chart2.draw(data2, options2);\n\n      }\n    </script>\n

\n\n

感谢您的时间。

\n

Answer 1

您可以使用legend.scrollArrows.activeColor和legend.scrollArrows.inactiveColor来设置这些。legend.pagingTextStyle.color也可用。

在你的情况下，它会是这样的：

var options2 = {
        title: '# of photos', backgroundColor: "transparent",
        colors: ['#F56363', '#eda15f', '#40C1A0', '#FFD586', '#81CFE0', '#fcfcfc', '#A06C90', '#FFCAD1'],
        legend: { position: 'bottom', maxLines: 3, scrollArrows: { inactiveColor: "red", activeColor: "red" } },
        bar: { groupWidth: '99%' },
        isStacked: true
};