Custom Component, JSON object for Mapbox

Dear all,

I am having trouble getting a GEOJSON into my custom component.

This is an example format: https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson

My endpoint with my own geo data returns the same format but stringified, I then use the REST Api query and return JSON.parse(query.data). It looks good in retool review.

However, now in the mapbox custom component I need to add a source.

It should look like this:

I have an endpoint which returns this:

image

Now I put this in my model and put it like this in my code:
image

image

Can you help me? If I copy paste the actual response into the code, it does work.

Greetings!

Hi @smarlet thanks for reaching out! Glad to hear it works when hardcoded--that narrows things down quite a bit

Are you passing the model in to your custom component?

React:

const MyCustomComponent = ({ triggerQuery, model, modelUpdate }) => ( 

JS:

window.Retool.subscribe(function(model) { 

My teammate made a sample app here that you can import into your instance if you want to see a working custom component!

Let me know if you're already passing in the model!

1 Like

There's another helpful example here

Subscribing to the model allows you to call model.keyName:

Thank you Tess, this was indeed the problem. Apparently I only used window.Retool.modelUpdate() for only output to the model.

Is there a possibility to narrow down the subscribe function? it keeps refreshing anytime a small thing changes.

Hi @smarlet Unfortunately, I'm not finding any settings that would help to narrow down how often it updates :disappointed: Does the component need the most up to date info? If not, can we limit how often the query runs?