- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I have a search that reads a value 0-10. I use a rangemap command to insert custom icons in toa table based on the what that value is. If it is 0-50, it is a red x. If it is 51-75, it is a yellow caution. If it is 76-100, it is a green check. I have a table that contains two columns: Application and range which is automatically created by the rangemap command.
tag="*" LocID="-7" SbuID="-7" | dedup tag |eval x=substr(ResponseDisplay,1,3) |stats values(x) AS "Application_Response" by tag |rangemap field=Application_Response severe=0-50 elevated=51-75 low=76-100 default=severe | table tag range
How do I rename the 'range' column to 'Health Status'?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content

- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
@aina_sloan, can we do this without making any change to JS script?
Also when I create two dashboard panel that use rangemap, one shows the visualisation and other doesn't. Any chance I could fix this as well.
Thanks.
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi @pranav_agile. The default return cell.field is range, i.e, return cell.field === 'range' , if this is the name of the field in your final result in your table then you do not need to change the field name in JS.
When you create two tables you need to specify table id for each of the dashboard panels. For example:
<row>
<panel>
<table id="table1">
<search>
<query> your query</query>
<earliest>-7d</earliest>
<latest>now</latest>
</search>
<option name="name">value</option>
</format>
</table>
</panel>
</row>
<row>
<panel>
<table id="table2">
<search>
<query> your query</query>
<earliest>-7d</earliest>
<latest>now</latest>
</search>
<option name="name">value</option>
</format>
</table>
</panel>
</row>
Here is were we are getting an issue with not editing the JS. Because the custom script only has configuration for one table:
mvc.Components.get('table1').getVisualization(function(tableView){
// Register custom cell renderer
tableView.table.addCellRenderer(new RangeMapIconRenderer());
// Force the table to re-render
tableView.table.render();
We need to copy this part of the script for our table id="table2". Meaning that we will have something like this at the bottom of our script:
mvc.Components.get('table1').getVisualization(function(tableView){
// Register custom cell renderer
tableView.table.addCellRenderer(new RangeMapIconRenderer());
// Force the table to re-render
tableView.table.render());
});
mvc.Components.get('table2').getVisualization(function(tableView){
// Register custom cell renderer
tableView.table.addCellRenderer(new RangeMapIconRenderer());
// Force the table to re-render
tableView.table.render());
});
});
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
There are several things that need to be done in order to rename the range field:
- Amend the JS to reference the new name of the field, for example Health_Status. Make the following changes in JS:
- return cell.field === 'Heath_Status' ;
- $td.addClass('icon').html(_.template('', {
- Health_Status: cell.value
Make changes in your search:
tag="*" LocID="-7" SbuID="-7" | dedup tag |eval x=substr(ResponseDisplay,1,3) |stats values(x) AS "Application_Response" by tag |rangemap field=Application_Response severe=0-50 elevated=51-75 low=76-100 default=severe | eval Health_Status=range
| table tag Health_Status
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content

Like this:
... | rename range AS "Health Status"
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
This does rename the column of the output, but then the icons do not load.
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content

Did the rename work? Which place in js do we need to change? I added label along with range. But it's not changed. Can you please help?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content

Assuming your JS refers to the column by name then yes, you will need to update that accordingly.
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
thank you!
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I have custom icons going into that table column. If I rename it, the icons do show up. Do I needto edit the .css or.js file?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
the icons do not show up sorry
