2013-06-27 2 views
0

У меня есть таблица визуализации с построенной на стороне сервера JSON. Когда я пытаюсь использовать форматирование цвета на основе значения ячейки, оно применяется только для конкретных целей. Мне нужно применить цвет для полной строки на основе значения одиночной ячейки. Например,Форматирование таблицы таблицы визуализации для полного значения ячейки на ячейке

 C1 C2 C3 C4 

    R1  - - - 0 // This row should be "red" 

    R2  - - - 1 // This row should be "green" 

    R3  - - - 0 

    R4  - - - 1 

Но цвет применяется только для C4.

MyCode:

var dataTable = new google.visualization.DataTable(data, 0.5); 

var formatter_short1 = new google.visualization.DateFormat({pattern:'h:mm aa'}); 
formatter_short1.format(dataTable,1); 
formatter_short1.format(dataTable,2); 
var view = new google.visualization.DataView(dataTable); 
view.hideColumns([0,3,4,5,8,9,14]); 
var color_formatter = new google.visualization.ColorFormat(); 
color_formatter.addRange(0,1, 'green', 'orange'); 
color_formatter.addRange(1,null, 'orange', 'green'); 
//color_formatter.format(dataTable, 1,2,6,7,9,11,12,13); // Apply formatter to 10 column 
color_formatter.format(dataTable, 10); // Apply formatter to 10 column 

ответ

3

Я не нашел ответа на этот вопрос, так что я вывешу мое решение для этого старый вопрос здесь.

Похоже, Google не поддерживает такое поведение из коробки, но вы можете достичь его с помощью пользовательского форматирования. Это один работает в моем случае:

function RowColorFormat() { 
    var colorFormat = new google.visualization.ColorFormat(); 

    this.addRange = function(from, to, color, bgcolor) { 
     colorFormat.addRange(from, to, color, bgcolor); 
    }; 

    this.addGradientRange = function(from, to, color, fromBgColor, toBgColor) { 
     colorFormat.addGradientRange(from, to, color, bgcolor); 
    }; 

    this.format = function(dataTable, column) { 
     dataTable.setPropertyOverriden = dataTable.setProperty; 
     dataTable.setProperty = function (row, column, name, value) { 
      var length = this.getNumberOfColumns(); 
      for (var i = 0; i < length; i++) { 
       this.setPropertyOverriden(row, i, name, value); 
      } 
     }; 
     colorFormat.format(dataTable, column); 
     dataTable.setProperty = dataTable.setPropertyOverriden; 
     delete dataTable.setPropertyOverriden; 
    }; 
} 

и использовать его как google.visualization.ColorFormat

Смежные вопросы