cancel
Showing results for 
Search instead for 
Did you mean: 
edselv
Sisense Team Member
Sisense Team Member

This article will show you how to quickly color a pivot table into two sections: by Row and by Value

1. Build your pivot table.

2. In the widget editor, add the widget script below. Information on how to add a widget script here: https://sisense.dev/guides/js/extensions.html

 

 

 

var $dom = prism.$injector.get('ux-controls.services.$dom');
var tip = null;

widget.on('cellEnter', function (widget, event) {
   var measure  = event.metadata.measure;
   if (tip) { tip.deactivate(); }
   if (!measure) { return; }
   var scope = prism.$ngscope.$new();
   scope.title = 'Cell Info:';
	scope.text = 'Value - ' + event.cell.content;
	scope.text2 = 'Column - ' + measure.title;
	//add more text scope here
 
   tip = $dom.tip({
       template: '<span> <b> {{title}} </b> <br> {{text}} <br> {{text2}} <br> </span>',
       scope: scope,
   }, {
       placement: { place: 'l', anchor: 't' },
       radial: false
   });
  
   tip.activate({x: event.domEvent.clientX, y: event.domEvent.clientY, space: 5});
});

widget.on('cellLeave', function (widget, event) {
   if (tip) {
       tip.deactivate();
   }
});

 

 

Note:
- You can change the values presented by changing the metadata you are pointing too (examples in 'scope.text' and 'scope.text2'). You can add more data to be included by adding another scope field.

- You can change the template of how your tooltip represents data by changing the html in the 'template' field. You can use HTML to customize the look of the text in the tooltip.

For additional references on available metadata and Pivot 2 functionality please see: https://sisense.dev/reference/js/widget/pivot2.html

Example:

Screen Shot 2022-04-19 at 14.03.05.png



Version history
Last update:
‎04-19-2022 02:09 PM
Updated by:
Contributors
Community Toolbox

Recommended quick links to assist you in optimizing your community experience:

Need additional support?:

Community Support Request