# How to bind 2 datasources to XY chart?

**URL:** <https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [February 26, 2025, 1:17pm UTC](https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904 "2025-02-26T13:17:03Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [February 26, 2025, 1:17pm UTC](https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904/1 "2025-02-26T13:17:03Z")

</div>

Hello!

I´m trying to bind a XY Chart to 2 datasources with no success.

What I´ve done is create two custom properties with the data I want to show in each graph:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/c/3c09306be87d6b05b43794ed445ce430fe66d054.png)

props.custom.processTempData  
props.custom.outputTempData

Then succesfully Bind that data to the  
props.series[0].data  
props.series[1].data

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/1/41f2d0e3d9c1ea09f5456960f70b87835649d894.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/b/7ba91fa30e9a85b56178414151b3ab5f89af2d83.png)

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/9/09103bbaebe84a19114be4a011e0206c6c71d358.png)

I am doing something wrong but not sure what is it.

The result I would like to have is this graph:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/a/eacb43c294f7b0ba3f0fcc7673a8965cfa21f2a9.png)

but with binded data from 2 different datasources.

Any ideas welcome.

Update:

I getting this error  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/9/d9a250187a90fa4957a5a13fee7b695cbb992156.png)

trying to fix

---

<div class="post-metadata">

**Author:** ![jespinmartin1](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jespinmartin1/32/57175_2.png) [@jespinmartin1](https://forum.inductiveautomation.com/u/jespinmartin1)\
**Post date:** [February 26, 2025, 1:41pm UTC](https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904/2 "2025-02-26T13:41:38Z")

</div>

you need to take a moment to understand how the component actually works. My first observation is that you are destroying the _series_ property that is not meant to hold data but in how the data renders. Another thing to think is if your data can be merged by domain (t\_stamp) and must be hold by _datasource_ property. So  
` [{"t_stamp":2025-02-26 00:00:00, "output_temp":123, "process_temp:456"},...].` . if not , multiple xAxis must be used.

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [February 26, 2025, 1:44pm UTC](https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904/3 "2025-02-26T13:44:45Z")

</div>

Thanks @jespinmartin1 , the error seem that I using an array and should just an object instead

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/6/06c987fe282032f6476a766165d8852e2e14b22f.png)

---

<div class="post-metadata">

**Author:** ![jespinmartin1](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jespinmartin1/32/57175_2.png) [@jespinmartin1](https://forum.inductiveautomation.com/u/jespinmartin1)\
**Post date:** [February 26, 2025, 1:46pm UTC](https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904/4 "2025-02-26T13:46:49Z")

</div>

Again. _series_ property is not the place where data should be. What are you trying to put in there?

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [February 26, 2025, 1:48pm UTC](https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904/5 "2025-02-26T13:48:33Z")

</div>

Ah, ok, so I should put both on dataSources. I will work on this, If keep having trouble I´m back to the forum. Thanks @jespinmartin1

I´m trying to put weekly values from a measure. I´m able to do that with one datasource, but not with 2

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/4/24e3e177309cfaac37297de94d5c32d8b51047b0.png)

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [February 27, 2025, 8:02am UTC](https://forum.inductiveautomation.com/t/how-to-bind-2-datasources-to-xy-chart/102904/6 "2025-02-27T08:02:10Z")

</div>

ok, done thank you, here I try explain more the problem I faced.

I just bind 2 datasources on the graph from 2 different years  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/4/14b2ac281882e81802fe5a72338a93e8333b079b.png)

In order to share same X axe t\_stamp I took out the year .` """  
'value' is the dataset (query results) passed into this transform.  
"""

```
# 1) Get the code from TextField_3
code_filter = self.getSibling("TextField_3").props.text

resultsDS = value  
filtered_list = []

    row_count = resultsDS.getRowCount()
    
    for row in range(row_count):
        codigo = resultsDS.getValueAt(row, "CODIGO")
        if codigo == code_filter:
            week_start = resultsDS.getValueAt(row, "WEEK_START")
            pue = resultsDS.getValueAt(row, "AVG_KWIT") # Weekly PUE value
            
            # Extract year from timestamp
            from java.util import Calendar
            cal = Calendar.getInstance()
            cal.setTime(week_start)
            year = cal.get(Calendar.YEAR)
            
            # Create t_stamp without year
            from java.text import SimpleDateFormat
            date_format = SimpleDateFormat("MM-dd") # Simplified format
            t_stamp_without_year = date_format.format(week_start)
            

            if pue is not None and isinstance(pue, (int, long, float)):
                filtered_list.append({
                    "t_stamp": t_stamp_without_year,
                    "year": year,
                    "process_temp": pue
                })

# Sort the filtered list by t_stamp to ensure proper ordering
filtered_list.sort(key=lambda x: x["t_stamp"])

return filtered_list`

```

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/b/1b5e7116e1778ad7457ad87527edde9c70bcf1fe.png)

If I don´t mege the t\_stamp of both charts, they are show separated

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/b/5b1164fc3bca9c0c07f75d7f03be6c796999903c.png)

All I need now is to improve the graph and add a legend wich each color linked to the year.