OutSystems friends,

I am having an issue when using HighCharts in React Web. I am creating this sort of chart:

When my query input changes, the chart updates, as expected. 

However, the JSON that I am using to display a total count in the middle of the chart, does not update.

I cannot seem to figure out anyway to force this JSON bit to reload when the query inputs change.

Does anyone know any techniques to force an update in this case?


---- Erik Bleifield


Hi Erick,

For testing purpose, I did almost the same implementation and in my case it's working as expected

I would suggest you to try the below mentioned steps

1) Introduce a Local Variable called SupplierCount 

2) Within the DataSource OnAfterFetch action flow, define an assignment node with below assign statement

 SupplierCount = Supplier.TotalCount

3) Map the Local variable within the Chart JSON string as text property value, instead of directly mapping the Supplier.TotalCount

4) Introduce an expression mapped with Local Variable SupplierCount within the UI screen to monitor the value change

Hope this helps you!


Benjith Sam



This is great to see. Thanks for the quick solution.

What are you theories on why a local variable works here - instead of the way I was trying to do it?

(You sure went above and beyond with your solution!)

How do you control the speed of animation on the right chart? That is a nice effect.

Thanks so much,


You are most welcome, Erik :)

Yeah it's true, I did some testing and trials for the mentioned case apart from that while working with Reactive applications, I have observed that in some of the cases even though it's React Framework, on value update the changes won't reflect in the UI, so you will have to take an additional steps (kind of work-around). Sorry I don't know the actual reason for this cause :(

How do you control the speed of animation on the right chart? That is a nice effect.

Please refer the attached .oml solution file


Benjith Sam