Geek asks and answers

Google chart: different colors for specific ranges

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

How can I specify different colors for a single line depending on a specific range? For example, one line should be blue from 0 to 10 and red from 10 to 20.

+5
source share
1 answer

Short answer: you cannot.

The long answer: you can create a long workaround, but each step will present different problems, which may turn out to be worse than monochrome.

Run the data loop so that each color is in different columns for each series. This is the fastest way.

For example, if you have data:

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

And you want to break it into 3 colors: & L; 300, 300-600

600

script, :

  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. "", , . , , ...

, ( ).

+4

More articles: