Thank you vganjare. It works now! ... View more

Hi vganjare. I tried your solution but the table shows empty if i apply the javascript and css to the dashboard. Splunk Query sourcetype=ret | rex "popularityIndex=(\")(?P<PI>[^>]+)(\")" | search PI=* | rex "<!--(?P<Channel_Name>[^-]+)" | eval Channel_Name = substr(Channel_Name, 0, len(Channel_Name)-18) | dedup Channel_Name | table Channel_Name PI| rename PI as "Popularity Index" Channel_Name as "Channel" | sort "Popularity Index" | appendcols [search sourcetype=shmapplogs "getMS3SAS ended for - deviceId" | bucket span=1d _time | stats count by _time channelId | sort count desc | lookup youview_channels.csv service_id_truncated AS channelId OUTPUT channel_name_letter | streamstats count AS position by _time | fields channel_name_letter position _time | convert timeformat="%d-%b-%Y" ctime(_time) As Time | chart max(position) over channel_name_letter by Time | rename channel_name_letter as "Channel"] | eval Channel = "NO_HIGHLIGHT_"+Channel Javascript require([ 'underscore', 'jquery', 'splunkjs/mvc', 'splunkjs/mvc/tableview', 'splunkjs/mvc/simplexml/ready!' ], function(_, $, mvc, TableView) { // Row Coloring Example with custom, client-side range interpretation var CustomRangeRenderer = TableView.BaseCellRenderer.extend({ canRender: function(cell) { // Enable this custom cell renderer for both the active_hist_searches and the active_realtime_searches field return true; }, render: function($td, cell) { // Add a class to the cell based on the returned value // Apply interpretation for number of historical searches //var tdPosition = $td.parent().children().index($td[0]); var value = cell.value; var isHighlight = (value.search('NO_HIGHLIGHT_') == -1); //console.log(tdposition + value); //alert(tdposition + value); if (isHighlight) { var value = parseInt(value); if ((value > 0) && (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) && (value <= 150)) { $td.addClass('range-cell').addClass('range-low'); } else { $td.addClass('range-cell').addClass('range-empty'); } } else { value = value.replace('NO_HIGHLIGHT_',''); } // Update the cell content $td.text(value); } }); mvc.Components.get('rettable').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); // }); //}); // Force the table to re-render tableView.table.render(); }); }); CSS #rettable td.range-low { color: #C0D9D9; } #rettable td.range-elevated { background-color: #ffc57a !important; font-weight: bold; } #rettable td.range-severe { background-color: #d59392 !important; font-weight: bold; } #rettable td.range-empty { color: #C0D9D9; } Source Code <panel> <table id="rettable"> <title>RET Statistics</title> <search> <query>sourcetype=ret | rex "popularityIndex=(\")(?P&lt;PI&gt;[^&gt;]+)(\")" | search PI=* | rex "&lt;!--(?P&lt;Channel_Name&gt;[^-]+)" | eval Channel_Name = substr(Channel_Name, 0, len(Channel_Name)-18) | dedup Channel_Name | table Channel_Name PI| rename PI as "Popularity Index" Channel_Name as "Channel" | sort "Popularity Index" | appendcols [search sourcetype=shmapplogs "getMS3SAS ended for - deviceId" | bucket span=1d _time | stats count by _time channelId | sort count desc | lookup youview_channels.csv service_id_truncated AS channelId OUTPUT channel_name_letter | streamstats count AS position by _time | fields channel_name_letter position _time | convert timeformat="%d-%b-%Y" ctime(_time) As Time | chart max(position) over channel_name_letter by Time | rename channel_name_letter as "Channel"] | eval Channel = "NO_HIGHLIGHT_"+Channel</query> <earliest>$time.earliest$</earliest> <latest>$time.latest$</latest> </search> <option name="wrap">undefined</option> <option name="rowNumbers">undefined</option> <option name="drilldown">row</option> <option name="dataOverlayMode">none</option> <option name="count">10</option> </table> </panel> ... View more

I understood your point. Understood the eval condition. But i am confused about how to write that condition in js file. It would be great if you share a small example of the js file. Also i am using return=true . previously it was return _(['Fieldname']).contains(cell.field); Is it correct. As I am new to javascript, so if you could share a similar example it would be better for me to understand. ... View more

Can you give an example to explain what you said? Below is my javascript require([ 'underscore', 'jquery', 'splunkjs/mvc', 'splunkjs/mvc/tableview', 'splunkjs/mvc/simplexml/ready!' ], function(_, $, mvc, TableView) { // Row Coloring Example with custom, client-side range interpretation var CustomRangeRenderer = TableView.BaseCellRenderer.extend({ canRender: function(cell) { // Enable this custom cell renderer for both the active_hist_searches and the active_realtime_searches field return true; }, render: function($td, cell) { // Add a class to the cell based on the returned value // Apply interpretation for number of historical searches var tdPosition = $td.parent().children().index($td[0]); var value = cell.value; if (tdPosition > 0) { var value = parseInt(value); if ((value > 0) && (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) && (value <= 150)) { $td.addClass('range-cell').addClass('range-low'); } else { $td.addClass('range-cell').addClass('range-empty'); } } // Update the cell content $td.text(value).addClass('numeric'); } }); mvc.Components.get('samptable').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); // }); //}); // Force the table to re-render tableView.table.render(); }); }); ... View more

Yes. And other cells belong to fields which are time dependent. Based on the threshold ranges i will color the cells for all fields other than 'Channel' ... View more

Hi Flynt. How to highlight cells of fields which are dynamic. My table looks like below if you select last 3 days from timepicker Channel 24-Jun-15 23-Jun-15 22-Jun-15 21-Jun-15 BBC Sport 6 3 7 9 Discovery 2 6 4 3 As you can see the fields names here are time dependent. I want to color all cells for fields other than 'Channel' here. How can I do that? Please help. ... View more

In the below link i have specified everything very clearly. Please have a look. http://answers.splunk.com/answers/249570/content-not-showing-in-the-table.html ... View more

Hi paramagurukarthikeyan. Below is the script i am using right now. The bolded parts (i.e parts with **) has some problems. The table is showing empty i.e. only the column names are showing without any values. I think there is some problem with updating the cell content. Can you please help? require([ 'underscore', 'jquery', 'splunkjs/mvc', 'splunkjs/mvc/tableview', 'splunkjs/mvc/simplexml/ready!' ], function(_, $, mvc, TableView) { // Row Coloring Example with custom, client-side range interpretation var CustomRangeRenderer = TableView.BaseCellRenderer.extend({ canRender: function(cell) { // Enable this custom cell renderer for both the active_hist_searches and the active_realtime_searches field **return true;** }, render: function($td, cell) { // Add a class to the cell based on the returned value // Apply interpretation for number of historical searches var tdPosition = $td.parent().children().index($td[0]); **var value = cell.value;** if (tdPosition > 0) { **var value = parseFloat(value);** if ((value > 0) && (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) && (value <= 150)) { $td.addClass('range-cell').addClass('range-low'); } else { $td.addClass('range-cell').addClass('range-empty'); } } // Update the cell content **$td.text(value).addClass('numeric');** } }); mvc.Components.get('rettable').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); // }); //}); // Force the table to re-render tableView.table.render(); }); }); ... View more

Below will be sample of my results if i chose 3 days from timepicker Channel 22-Jun-15 21-Jun-15 20-Jun-15 19-Jun-15 BBC Sport 6 3 7 9 Discovery 2 6 4 3 My query: sourcetype=shmapplogs "getMS3SAS ended for - deviceId" | bucket span=1d _time | stats count by _time channelId | sort count desc | lookup youview_channels.csv service_id_truncated AS channelId OUTPUT channel_name_letter | streamstats count AS position by _time | fields channel_name_letter position _time | convert timeformat="%d-%b-%Y" ctime(_time) As Time | chart max(position) over channel_name_letter by Time i want to color all '_time' columns from the above format based on the numbers each column contains. Channel will be the static column and rest all will be dynamic. I want coloring only for dynamic columns. so what should i write for return[()].contains(cell.field)? ... View more

okay.. Thank you.. one more question.. return (['active_hist_searches', 'active_realtime_searches']).contains(cell.field); }, The names mentioned in return[] contains the field names whose cells i want to color. what should i mention in return field for my case as the column names are dynamic? my first field name is "Channel" and it's static. After that only dynamic _time column names will come. ... View more

can i use below to give same condition for all the columns after 1st column. if (tdPosition > 0) { if (value > 2) { $td.addClass('range-cell').addClass('range-severe'); } else if (value > 1) { $td.addClass('range-cell').addClass('range-elevated'); } else if (value > 0) { $td.addClass('range-cell').addClass('range-low'); } } Also do i need return field if i use tdposition? ... View more

i cannot post screenshots here. But in my question itself i have specified the format of my results. Please have a look. ... View more

Below is my query : sourcetype=shmapplogs "getMS3SAS ended for - deviceId" | bucket span=1d _time | stats count by _time channelId | sort count desc | lookup youview_channels.csv service_id_truncated AS channelId OUTPUT channel_name_letter | streamstats count AS position by _time | fields channel_name_letter position _time | convert timeformat="%d-%b-%Y" ctime(_time) As Time | chart max(position) over channel_name_letter by Time I want to color the cells belong to 'Time' field. ... View more

Hi paramagurukarthikeyan. If you could just give one example to demonstrate the solution you suggested, it would be great. ... View more

Hi paramagurukarthikeyan. Appreciate you answer but couldn't understand the entire part. It would be great if you could explain me a bit more and tell me what exactly will be my return field. ex - require([ 'underscore', 'jquery', 'splunkjs/mvc', 'splunkjs/mvc/tableview', 'splunkjs/mvc/simplexml/ready!' ], function(_, $, mvc, TableView) { // Row Coloring Example with custom, client-side range interpretation var CustomRangeRenderer = TableView.BaseCellRenderer.extend({ canRender: function(cell) { // Enable this custom cell renderer for both the active_hist_searches and the active_realtime_searches field return _(['active_hist_searches', 'active_realtime_searches']).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 number of historical searches if (cell.field === 'active_hist_searches') { if (value > 2) { $td.addClass('range-cell').addClass('range-severe'); } else if (value > 1) { $td.addClass('range-cell').addClass('range-elevated'); } else if (value > 0) { $td.addClass('range-cell').addClass('range-low'); } } // Apply interpretation for number of realtime searches if (cell.field === 'active_realtime_searches') { if (value > 1) { $td.addClass('range-cell').addClass('range-severe'); } } // 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); // }); //}); // Force the table to re-render tableView.table.render(); }); }); In the above example, the return fields are 'active_hist_searches' & 'active_realtime_searches'. Smilarly for my case as its a dynamic _time field, what should i write inside return[]? ... View more

Thanks woodcock! The method in the link works perfectly! ... View more

I have already used pivot command but unfortunately pivot doesn't solve my issue. I have posted the search and the results. Please have a look ... View more

Hi woodcock. Appreciate your answer but i have already tried this. http://answers.splunk.com/answers/241901/ranking-rows-in-a-table-based-on-the-count.html My client specifically told to filter the ranks for each day so i can't show him for all days. Any other ideas will be highly entertained. ... View more

Thanks davebrooking & sc0tt. ... View more