All Apps and Add-ons

Why am I not able to use more than 4 table icon rangemaps in Splunk 6.x dashboards?

sameera123
Explorer

Not able to use more than 4 table icon rangemaps in Splunk 6.x dashboards. Can any one please suggest on this?

I'm using table icon rangemaps for 4 tables by creating for each table and each js file. I did the same thing with the 5th table, but it's not working.

0 Karma

duuhsousa
New Member

Can you post your css and XML too ?

0 Karma

renjith_nair
SplunkTrust
SplunkTrust

I have tested this in Splunk 6.2 and 6.3 and is working. Each of the table should have an id and use that id to render. You can write a loop to get all the table id and render it too.

I have used a field name as Status and this should be the column name of the ICON

  require([
      'underscore',
      'jquery',
      'splunkjs/mvc',
      'splunkjs/mvc/tableview',
      'bootstrap.tab',
      'splunkjs/mvc/simplexml/ready!'
    ], function(_, $, mvc, TableView) {
    // Translations from rangemap results to CSS class
    var ICONS = {
       severe: 'alert-circle',
      elevated: 'alert',
      low: 'check-circle'
    };
    var RangeMapIconRenderer = TableView.BaseCellRenderer.extend({
      canRender: function(cell) {
      // Only use the cell renderer for the range field
      return cell.field === 'Status';
     },
    render: function($td, cell) {
    var icon = 'question';
    // Fetch the icon for the value
    if (ICONS.hasOwnProperty(cell.value)) {
    icon = ICONS[cell.value];
    }
    // Create the icon element and add it to the table cell
    $td.addClass('icon').html(_.template('<i class="icon-<%-icon%> <%- range %>" title="<%- range %>"></i>', {
    icon: icon,
    range: cell.value
    }));
    }
    });
    //For each status tables, include the icons with rspective colors
    mvc.Components.get('host_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });
    mvc.Components.get('boot_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });
    mvc.Components.get('process_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });
    mvc.Components.get('url_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });    

    mvc.Components.get('ssl_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });
    mvc.Components.get('license_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });        
    mvc.Components.get('df_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });
    mvc.Components.get('cpu_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });
    mvc.Components.get('ram_status').getVisualization(function(tableView){
    // Register custom cell renderer
    tableView.table.addCellRenderer(new RangeMapIconRenderer());
    // Force the table to re-render
    tableView.table.render();
    });    

  });    

Enable the debugger(firebug or similar) to identify any issue with your JS

Happy Splunking!

renjith_nair
SplunkTrust
SplunkTrust

Did it help?

Happy Splunking!
0 Karma

renjith_nair
SplunkTrust
SplunkTrust

Are you using the example from splunk 6.x dashboard examples? I have created at least 8 tables on same dashboard and never experience any limitations. In between I'm using single js for all tables. How did you manage to call different JS file for each table ?

Happy Splunking!
0 Karma

sameera123
Explorer

if you don't mind pasting the table_icon_rangemap.js file here please.I was able to do it for only 2 tables in single js not more than that.and what version you are using??

0 Karma
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...