Hey @jeffland thanks for your answer. I wish I could use the logic in SPL to do this, in fact we already did that and the customer said it wasn't sufficient because they want their table to look like the top one in my attached file..... not like the bottom one. The bottom one is as far as I can get using SPL (I think).
So I tried adding a variable (compare_value) like you suggested, but I'm not sure what I'm doing wrong. My code is on another network so I can't paste it here but I'll use the example file to show you what I did.... maybe you could help me one step further?
require([
'underscore',
'jquery',
'splunkjs/mvc',
'splunkjs/mvc/tableview'A,
'splunkjs/mvc/simplexml/ready!'
], function(_, $, mvc, TableView) {
// I added this part:
var compare_value;
if (cell.field==='cell_to_compare_with'){
compare_value=parseFloat(cell.value)
}
// then compared using compare_value below.
var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
canRender: function(cell) {
// Enable this custom cell renderer for both the availability and the response field
return _(['Application_Availability', 'Application_Response']).contains(cell.field);
},
render: function($td, cell) {
// Add a class to the cell based on the returned value
var value = parseFloat(cell.value);
// Apply interpretation for availabiliy
if (cell.field === 'Application_Availability') {
if (value < compare_value) {
$td.addClass('range-cell').addClass('range-severe');
}
else if (value > compare_value) {
$td.addClass('range-cell').addClass('range-elevated');
}
}
// Apply interpretation for response
if (cell.field === 'Application_Response') {
if (value < 50) {
$td.addClass('range-cell').addClass('range-severe');
}
else if (value > 50 && value < 100) {
$td.addClass('range-cell').addClass('range-elevated');
}
else if (value == 100) {
$td.addClass('range-cell').addClass('range-low');
}
}
// Update the cell content
$td.text(value.toFixed(2)).addClass('numeric');
}
});
mvc.Components.get('highlight').getVisualization(function(tableView) {
// Add custom cell renderer
tableView.table.addCellRenderer(new CustomRangeRenderer());
// tableView.on('rendered', function() {
// Apply class of the cells to the parent row in order to color the whole row
// tableView.$el.find('td.range-cell').each(function() {
// $(this).addClass(this.className);
// });
//});
... View more