Search code examples
reactjsmongodbiframechartsmongodb-charts

MongoDB embedded chart in React, filtering ObjectId not working


I embedded a mongoDB chart into a react component, using the SDK. The chart works great, now I want to add a filter to send in the user's team_oid.

I carefully followed the Filter Embedded Charts instructions here

When I create the chart without a filter it works great:

chart = sdk.createChart({
  chartId: "6e12970a-a356-490f-a322-464153ad0080"
})

But... When I add a filter, it stops working:

chart = sdk.createChart({
  chartId: "6e12970a-a356-490f-a322-464153ad0080",
  filter: { team_oid: mongoose.Types.ObjectId("603f8ceda2e7b500043ffe60") }
})

It only shows the title of the chart, but no data (the chart is blank). It acts as if there is no data for the filter.

Here is the render logic:

chart
    .render(document.getElementById('trust_chart'))
    .catch(() => window.alert('Chart failed to initialise')); 
}

Is this how filtering works? Is this typical for SDK queries?

Any tips or suggestions appreciated!


Solution

  • I discovered my mistake, so posting the answer here to help others.

    The code above is correct

    The issue was two parts:

    1. The filter settings in Mongodb Charts were not configured to allow outside filtering
    2. The test data I was using in localhost was incomplete and filter came back blank

    I hope this is helpful for future observers.