Gauges in Spotfire

1) Add TextArea
2) Edit HTML
3) Add property (calculated column)

For example.
<SpotfireControl id="0e9f0a8148354db49fe6b71ad3545ccd" />

3) Add below code snippet

<style> 
.regionSettings{
float:left;
width:200px;
margin:10px;
padding: 5px;
border:2px solid gray;
background:whitesmoke;
}
</style>
<div  id="gauge" style="width: 200px; height: 120px;"></div>
<span id="calcValue">
<SpotfireControl id="0e9f0a8148354db49fe6b71ad3545ccd" />
</span>

4) Add js as below

//define your javascript libraries

resource=[

 "//cdn.jsdelivr.net/raphael/2.1.0/raphael-min.js",

 "//cdn.jsdelivr.net/justgage/1.0.1/justgage.min.js"

]

//add scripts to head

$.getScript(resource[0],function(){

 $.getScript(resource[1],init)

})

//start your widget

init=function(){

  var g = new JustGage({

    id: "gauge", 

    value:  parseInt($("#0e9f0a8148354db49fe6b71ad3545ccd").text()), 

    min: 0,

    max: 5646,

    title: "Visitors"

  });

  

  //refresh gauge when calcvalue changes

  $(calcValue).on('DOMSubtreeModified',function(){

    g.refresh($(this).text())

  })

}