How to bind 2 datasources to XY chart?

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

props.custom.processTempData
props.custom.outputTempData

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

image

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

The result I would like to have is this graph:

but with binded data from 2 different datasources.

Any ideas welcome.

Update:

I getting this error
image

trying to fix

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.

1 Like

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

image

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

1 Like

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

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

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`

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

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