Google折线图:特定范围的不同颜色

时间:2013-03-14 17:30:37

标签: google-visualization linechart

https://developers.google.com/chart/interactive/docs/gallery/linechart?hl=ja#Configuration_Options

如何根据特定范围为单行指定不同的颜色?例如,一行应为蓝色,从0到10,红色从10到20。

1 个答案:

答案 0 :(得分:4)

简短回答:你不能。

答案很长:您可以构建一个冗长的解决方法,但每个步骤都会出现一些您可能会发现比单色线更糟糕的问题。

在数据中运行循环,以便每个颜色位于每个系列的不同列中。这是最快捷的方式。

例如,如果您有数据:

  var data = google.visualization.arrayToDataTable([
    ['Month', 'Data'],
    ['2004/05', 123],
    ['2005/06', 234],
    ['2006/07', 345],
    ['2007/08', 456],
    ['2008/09', 789]

你想把它分成3种颜色: < 300, 300-600

  

600

您可以编写脚本以使数据如下所示:

  var data = google.visualization.arrayToDataTable([
    ['Month', 'Red', 'Green', 'Blue'],
    ['2004/05', 123, null, null],
    ['2005/06', 234, null, null],
    ['2006/07', null, 345, null],
    ['2007/08', null, 456, null],
    ['2008/09', null, null, 789]

以上将为您提供每个不同范围的彩色点。如果您确实希望连接它们的线条在超过某个阈值时立即改变颜色,则必须在任何一天计算300的截距,并将其添加到系列中。与600相同。您还必须将“月”系列更改为实际为日期值,以便您可以正确设置它们之间的点。当然,那些中间点也会出现,这是一个不同的头痛......

你也可以摆弄domains,但那些不会帮助你着色(但会帮助你将不同的点连接到同一系列)。