# Power Chart - Showing transformed value in x-trace instead of integer value?

**URL:** <https://forum.inductiveautomation.com/t/power-chart-showing-transformed-value-in-x-trace-instead-of-integer-value/68527>\
**Category:** Ignition\
**Tags:** perspective, vision\
**Created:** [January 12, 2023, 3:30am UTC](https://forum.inductiveautomation.com/t/power-chart-showing-transformed-value-in-x-trace-instead-of-integer-value/68527 "2023-01-12T03:30:47Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [January 20, 2023, 9:30am UTC](https://forum.inductiveautomation.com/t/power-chart-showing-transformed-value-in-x-trace-instead-of-integer-value/68527/3 "2023-01-20T09:30:54Z")

</div>

it would be possible with js injection, but seems like a lot of work for what a legend could solve

edit...  
... and ofc i do a lot of work 😛

it works... but i'm a bit worried about client performance on big charts, so test it out! And let us know if its doable.  
the onhover event didnt trigger enough to match the chart, so im doing a mutationobserver on it, but that kinda triggers to much...

give your chart a domid  
and setup your value mapping  
this binding goes into the markdown ofc with escaped html

```auto
def transform(self, value, quality, timestamp):
	#make the value the key to write too.
	chartDomId = "PowerTableId"
	mappingStatus = "{0:'stopped',1:'started'}"
	code = "<img style='display:none' src='/favicon.ico' onload=\"const mappingStatus="+mappingStatus+"; const chart = document.getElementById('"+chartDomId+"'); const callback = (mutationList, observer) => {let textLabels = document.querySelectorAll('#"+chartDomId+" .ia_powerChartComponent __labelText.ia_powerChartComponent__ xTrace __box__ label > tspan'); textLabels.forEach(textLabel => {if(textLabel.textContent in mappingStatus){textLabel.textContent = mappingStatus[textLabel.textContent]; }})}; const observer = new MutationObserver(callback); observer.observe(chart, { attributes: false, childList: true, subtree: true })\"></img>"
	return code

```

dont forget to change the size of the trace box to match increased text lengths  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/e/0eab76dcc6e491103fe17a7a2a868c8b100e0b35.png)

---

_[View the full topic](https://forum.inductiveautomation.com/t/power-chart-showing-transformed-value-in-x-trace-instead-of-integer-value/68527)._