Wykres Google Line: Różne kolory dla określonych zakresów

Question

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

Jak mogę określić różne kolory dla pojedynczej linii zależy od konkretnego zakresu? Na przykład jedna linia powinna być niebieska od 0 do 10 i czerwona od 10 do 20.

Answer 1

Krótka odpowiedź: nie możesz.

Długa odpowiedź: można zbudować długotrwałe obejście problemu, ale każdy krok będzie przedstawiać różne problemy, które mogą być gorsze od pojedynczych linii.

Przeprowadź pętlę przez dane, aby każdy kolor był w innej kolumnie dla każdej serii. To jest najszybszy sposób.

Na przykład, jeśli masz dane:

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

I chcesz podzielić ją w 3 kolorach: < 300, 300-600

Możesz napisać skrypt, aby Twoje dane wyglądały tak:

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] 

Powyższe daje kolorowe punkty dla każdego innego zakresu. Jeśli chcesz, aby linie łączące je zmieniły kolor, gdy przekroczą określony próg, musisz obliczyć punkt przecięcia 300 z dowolnym dniem i dodać go do serii. To samo z 600. Trzeba też zmienić serię "Miesiąc", aby faktycznie były wartościami daty, aby można było prawidłowo ustawić punkt pomiędzy. Oczywiście te punkty pośrednie również się pojawią, co jest innym bólem głowy ...

Możesz także bawić się przy pomocy domains, ale te nie pomogą ci w kolorowaniu (ale pomogą ci połączyć różne punkty do tej samej serii).