# Displaying MongoDB data in charts

**URL:** <https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192>\
**Category:** Ignition\
**Tags:** ignition81, perspective\
**Created:** [March 25, 2025, 7:52pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192 "2025-03-25T19:52:44Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![asgharbmcproject](https://avatars.discourse-cdn.com/v4/letter/a/a9adbd/32.png) [@asgharbmcproject](https://forum.inductiveautomation.com/u/asgharbmcproject)\
**Post date:** [March 25, 2025, 7:52pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/1 "2025-03-25T19:52:44Z")

</div>

Hi everyone,

I'm trying to visualize data from my MongoDB database in Ignition charts. I'm successfully retrieving the data, but I'm having trouble displaying it properly in the chart components.

Could you please guide me on how to Properly structure the data for Ignition charts?

Any examples or best practices would be greatly appreciated!

Thanks in advance.

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

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [March 25, 2025, 8:44pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/2 "2025-03-25T20:44:31Z")

</div>

Try setting,  
`xAxes.0.render : date`

---

<div class="post-metadata">

**Author:** ![asgharbmcproject](https://avatars.discourse-cdn.com/v4/letter/a/a9adbd/32.png) [@asgharbmcproject](https://forum.inductiveautomation.com/u/asgharbmcproject)\
**Post date:** [March 25, 2025, 8:56pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/3 "2025-03-25T20:56:07Z")

</div>

I had already tested `date`, but I didn’t get a result.  
Since it displays the time as a number, I think it recognizes time as a numeric timestamp.  
I added new chart to the page. In the data source, all the data is inside a key named `example`.  
I couldn’t create it using a MongoDB query.  
Maybe adding a parent key would solve the issue.  
I appreciate any kind of help.

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

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [March 25, 2025, 9:07pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/4 "2025-03-25T21:07:53Z")

</div>

Copy the XY Chart from the Project Browser and past it here as formatted text using the \</\> button. Then we can test it.

---

<div class="post-metadata">

**Author:** ![asgharbmcproject](https://avatars.discourse-cdn.com/v4/letter/a/a9adbd/32.png) [@asgharbmcproject](https://forum.inductiveautomation.com/u/asgharbmcproject)\
**Post date:** [March 25, 2025, 9:33pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/5 "2025-03-25T21:33:45Z")

</div>

Thank you @Transistor

```python
[
  {
    "type": "ia.chart.xy",
    "version": 0,
    "props": {
      "xAxes": [
        {
          "name": "time",
          "label": {
            "enabled": true,
            "text": "Time",
            "color": ""
          },
          "visible": true,
          "tooltip": {
            "enabled": true,
            "text": "",
            "cornerRadius": 3,
            "pointerLength": 4,
            "background": {
              "color": "",
              "opacity": 1
            }
          },
          "inversed": false,
          "render": "date",
          "category": {
            "break": {
              "enabled": false,
              "startCategory": "",
              "endCategory": "",
              "size": 0.05
            }
          },
          "date": {
            "baseInterval": {
              "enabled": false,
              "timeUnit": "second",
              "count": 1,
              "skipEmptyPeriods": false
            },
            "range": {
              "max": "",
              "min": "",
              "useStrict": false
            },
            "break": {
              "enabled": false,
              "startDate": "",
              "endDate": "",
              "size": 0.05
            },
            "inputFormat": "M/d/yyyy",
            "format": "M/d/yyyy"
          },
          "value": {
            "range": {
              "max": "",
              "min": "",
              "useStrict": false
            },
            "logarithmic": false,
            "break": {
              "enabled": false,
              "startValue": 0,
              "endValue": 100,
              "size": 0.05
            },
            "format": "#,###.##"
          },
          "appearance": {
            "opposite": false,
            "inside": false,
            "labels": {
              "color": "",
              "opacity": 1,
              "rotation": 0,
              "verticalCenter": "middle",
              "horizontalCenter": "middle"
            },
            "grid": {
              "color": "",
              "opacity": 1,
              "dashArray": "",
              "minDistance": 60,
              "position": 0.5
            },
            "font": {
              "size": "",
              "weight": 500
            }
          }
        }
      ],
      "yAxes": [
        {
          "name": "Sp",
          "label": {
            "enabled": true,
            "text": "sP",
            "color": ""
          },
          "visible": true,
          "tooltip": {
            "enabled": true,
            "text": "",
            "cornerRadius": 3,
            "pointerLength": 4,
            "background": {
              "color": "",
              "opacity": 1
            }
          },
          "inversed": false,
          "render": "value",
          "category": {
            "break": {
              "enabled": false,
              "startCategory": "",
              "endCategory": "",
              "size": 0.05
            }
          },
          "date": {
            "baseInterval": {
              "enabled": false,
              "timeUnit": "hour",
              "count": 1,
              "skipEmptyPeriods": false
            },
            "range": {
              "max": "",
              "min": "",
              "useStrict": false
            },
            "break": {
              "enabled": false,
              "startDate": "",
              "endDate": "",
              "size": 0.05
            },
            "inputFormat": "yyyy-MM-dd kk:mm:ss",
            "format": "M/d/yyyy HH:mm:ss"
          },
          "value": {
            "range": {
              "max": "",
              "min": "",
              "useStrict": false
            },
            "logarithmic": false,
            "break": {
              "enabled": false,
              "startValue": 0,
              "endValue": 100,
              "size": 0.05
            },
            "format": "#,###.##"
          },
          "appearance": {
            "opposite": false,
            "inside": false,
            "labels": {
              "color": "",
              "opacity": 1,
              "rotation": 0,
              "verticalCenter": "middle",
              "horizontalCenter": "middle"
            },
            "grid": {
              "color": "",
              "opacity": 1,
              "dashArray": "",
              "minDistance": null,
              "position": 0.5
            },
            "font": {
              "size": "",
              "weight": 500
            }
          }
        }
      ],
      "series": [
        {
          "name": "Sp",
          "label": {
            "text": ""
          },
          "visible": true,
          "hiddenInLegend": false,
          "defaultState": {
            "visible": true
          },
          "data": {
            "source": "",
            "x": "time",
            "y": "Sp"
          },
          "xAxis": "time",
          "yAxis": "Sp",
          "zIndex": 0,
          "tooltip": {
            "enabled": true,
            "text": "{name}: [bold]{valueY}[/]",
            "cornerRadius": 3,
            "pointerLength": 4,
            "background": {
              "color": "",
              "opacity": 1
            }
          },
          "render": "line",
          "candlestick": {
            "open": {
              "x": "",
              "y": ""
            },
            "high": {
              "x": "",
              "y": ""
            },
            "low": {
              "x": "",
              "y": ""
            },
            "appearance": {
              "fill": {
                "color": "",
                "opacity": 1
              },
              "stroke": {
                "color": "",
                "opacity": 1,
                "width": 1
              },
              "stacked": false,
              "deriveFieldsFromData": {
                "fill": {
                  "color": "",
                  "opacity": ""
                },
                "stroke": {
                  "color": "",
                  "opacity": "",
                  "width": ""
                }
              },
              "heatRules": {
                "enabled": false,
                "max": "",
                "min": "",
                "dataField": ""
              }
            }
          },
          "column": {
            "open": {
              "x": "",
              "y": ""
            },
            "appearance": {
              "fill": {
                "color": "",
                "opacity": 1
              },
              "stroke": {
                "color": "",
                "opacity": 1,
                "width": 1
              },
              "stacked": false,
              "width": null,
              "height": null,
              "deriveFieldsFromData": {
                "fill": {
                  "color": "",
                  "opacity": ""
                },
                "stroke": {
                  "color": "",
                  "opacity": "",
                  "width": ""
                }
              },
              "heatRules": {
                "enabled": false,
                "max": "",
                "min": "",
                "dataField": ""
              }
            }
          },
          "line": {
            "open": {
              "x": "",
              "y": ""
            },
            "appearance": {
              "connect": true,
              "tensionX": 1,
              "tensionY": 1,
              "minDistance": 0.5,
              "stroke": {
                "width": 3,
                "opacity": 1,
                "color": "",
                "dashArray": ""
              },
              "fill": {
                "opacity": 0,
                "color": ""
              },
              "bullets": [
                {
                  "enabled": false,
                  "render": "circle",
                  "width": 10,
                  "height": 10,
                  "label": {
                    "text": "{value}",
                    "position": {
                      "dx": 0,
                      "dy": 0
                    }
                  },
                  "fill": {
                    "color": "",
                    "opacity": 1
                  },
                  "stroke": {
                    "color": "",
                    "opacity": 1,
                    "width": 1
                  },
                  "rotation": 0,
                  "tooltip": {
                    "enabled": true,
                    "text": "{name}: [bold]{valueY}[/]",
                    "cornerRadius": 3,
                    "pointerLength": 4,
                    "background": {
                      "color": "",
                      "opacity": 1
                    }
                  },
                  "deriveFieldsFromData": {
                    "fill": {
                      "color": "",
                      "opacity": ""
                    },
                    "stroke": {
                      "color": "",
                      "opacity": "",
                      "width": ""
                    },
                    "rotation": ""
                  },
                  "heatRules": {
                    "enabled": false,
                    "max": 100,
                    "min": 2,
                    "dataField": ""
                  }
                }
              ]
            }
          },
          "stepLine": {
            "open": {
              "x": "",
              "y": ""
            },
            "appearance": {
              "connect": true,
              "tensionX": 1,
              "tensionY": 1,
              "minDistance": 0.5,
              "stroke": {
                "width": 3,
                "opacity": 1,
                "color": "",
                "dashArray": ""
              },
              "fill": {
                "opacity": 0,
                "color": ""
              },
              "bullets": [
                {
                  "enabled": true,
                  "render": "circle",
                  "width": 10,
                  "height": 10,
                  "label": {
                    "text": "{value}",
                    "position": {
                      "dx": 0,
                      "dy": 0
                    }
                  },
                  "fill": {
                    "color": "",
                    "opacity": 1
                  },
                  "stroke": {
                    "color": "",
                    "opacity": 1,
                    "width": 1
                  },
                  "rotation": 0,
                  "tooltip": {
                    "enabled": true,
                    "text": "{name}: [bold]{valueY}[/]",
                    "cornerRadius": 3,
                    "pointerLength": 4,
                    "background": {
                      "color": "",
                      "opacity": 1
                    }
                  },
                  "deriveFieldsFromData": {
                    "fill": {
                      "color": "",
                      "opacity": ""
                    },
                    "stroke": {
                      "color": "",
                      "opacity": "",
                      "width": ""
                    },
                    "rotation": ""
                  },
                  "heatRules": {
                    "enabled": false,
                    "max": 100,
                    "min": 2,
                    "dataField": ""
                  }
                }
              ]
            }
          }
        }
      ]
    },
    "meta": {
      "name": "XYChart_0"
    },
    "position": {
      "x": 340.4976806640625,
      "y": 579.7857939147949,
      "width": 288,
      "height": 189
    },
    "custom": {},
    "propConfig": {
      "props.dataSources": {
        "binding": {
          "type": "connectorMongoDb.query",
          "config": {
            "type": "Find",
            "connector": "MongoDB",
            "collection": "RunLogs",
            "struct": {
              "filter": {},
              "projection": {
                "Sp": "\"$pressure.set_point\"",
                "_id": 0,
                "time": "\"$time\""
              },
              "sort": {
                "time": -1
              },
              "collation": {},
              "limit": 10,
              "skip": 0
            },
            "polling": {
              "enabled": true,
              "rate": "1"
            },
            "enableValueCache": true
          }
        }
      }
    }
  }
]

```

---

<div class="post-metadata">

**Author:** ![asgharbmcproject](https://avatars.discourse-cdn.com/v4/letter/a/a9adbd/32.png) [@asgharbmcproject](https://forum.inductiveautomation.com/u/asgharbmcproject)\
**Post date:** [March 25, 2025, 9:43pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/6 "2025-03-25T21:43:19Z")

</div>

I think my issue is because I cannot create a name for the data source.  
That's why I haven't assigned any name in the data source section.  
I don't know how to create a data source name for the data retrieved from MongoDB.

question:  
I can retrieve data from MongoDB in the Gateway, but I don't know how to use a function for the chart data source.  
Is this method possible?

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [March 25, 2025, 9:53pm UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/7 "2025-03-25T21:53:04Z")

</div>

![Mongo DB binding](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/2/d2043e5392e4f0d964b587774d3a1ebae796769e.png)

- Click in the gutter beside `example`.
- Create your MongoDB binding in there as you've done in post #1. You can see an array of dictionaries is being returned in the Binding Preview. (I think if you hover over it the tooltip will show more data.)

That should be enough to return the data as shown above.

---

<div class="post-metadata">

**Author:** ![asgharbmcproject](https://avatars.discourse-cdn.com/v4/letter/a/a9adbd/32.png) [@asgharbmcproject](https://forum.inductiveautomation.com/u/asgharbmcproject)\
**Post date:** [March 26, 2025, 1:56am UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/8 "2025-03-26T01:56:06Z")

</div>

Dear @Transistor,

Thank you so much for your help. Following your guidance, my issue has been resolved.

I wanted to have the data as 120 new entries by adding `limit: -1`, but the chart was giving a sorting error. Upon investigation, I realized that the chart accepts data sorted in descending order. By adding the transmission `sorted(value, key=lambda x: x['time'])`, I was able to fix the issue.

I’ve written this in case my method is incorrect. If so, please let me know the correct approach. If my method is valid, perhaps someone else facing a similar issue could benefit from this advice.

Once again, thank you for your support!

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [March 26, 2025, 1:59am UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/9 "2025-03-26T01:59:16Z")

</div>

> [@asgharbmcproject](#):
>
> I realized that the chart accepts data sorted in **descending** order.

**Ascending** perhaps?

---

<div class="post-metadata">

**Author:** ![asgharbmcproject](https://avatars.discourse-cdn.com/v4/letter/a/a9adbd/32.png) [@asgharbmcproject](https://forum.inductiveautomation.com/u/asgharbmcproject)\
**Post date:** [March 26, 2025, 2:25am UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/10 "2025-03-26T02:25:01Z")

</div>

> [@Transistor](#):
>
> **Ascending** perhaps?

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

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [March 26, 2025, 2:32am UTC](https://forum.inductiveautomation.com/t/displaying-mongodb-data-in-charts/104192/11 "2025-03-26T02:32:51Z")

</div>

![Data ascending](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/8/68e1775d29ce9e4c570ab508e49b7f16383d9f19.png)

Yes, **ascending**.
