Jump to content

Tibco Spotfire Summary Table - Column Headings

Doug Hall 4

Recommended Posts

You can change the "column" heading with a little javascript. Just add a text area and add this script:


//script parameter

const newColName = "something+ descriptive"

let i=0


function setColName(){

//set column name


// Select the node that will be observed for mutations

const colHeader= document.querySelectorAll(".sfc-summary-table .sfc-column-header");


//fisrt column is last colHeader _()_/

const columnHeader = colHeader[colHeader.length-1]


//change fisrt col name

columnHeader.innerHTML = newColName


//if first col name changes, change it back

// Options for the observer (which mutations to observe)

const config = { attributes: !true, childList: true, subtree: true };


// Callback function to execute when mutations are observed

const callback = function(mutationList, observer) {


// Use traditional 'for loops' for IE 11

// for(const mutation of mutationList) {

// targetNode.innerText = newColName

// }



// Create an observer instance linked to the callback function

const observer = new MutationObserver(callback);


// Start observing the target node

const targetNode = document.querySelectorAll(".sfc-summary-table .topLeftCornerCanvas")[0]

observer.observe(targetNode, config);




//keep monitoring every 3 seconds in case it changes back to "column"






You can also add tooltips for each column. Just add a text area and add this script:addSummaryTableTooltips.js

//define tooltips for measurements columns. Use n to add a space


"the sum of the values",

"the average of the values for each column",

"min stands for minimum",

"maximum value",

"median is the middle number in a nsorted, ascending or descending list of numbers",

"Standar deviation refers to the square root of its variance "




//adds tooltips to measurements and re-run every 5 seconds in case resize happens

function setTooltips(){

[...document.querySelectorAll(".frozenRowsContainer div[row]")].map((e,i)=>{e.title = tooltip})





setTooltips()If you really want to change the column titles, then change the setTooltips function to this:

function setTooltips(){

[...document.querySelectorAll(".frozenRowsContainer div[row]")].map((e,i)=>{e.innerText = tooltip})



if you really want to add html to titles, then replace "innerText" with "innerHTML"

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Create New...