Custom Component, JSON object for Mapbox

App Building
,
#1

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:

image
image429×742 11.5 KB

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!

#2

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!

#3

There's another helpful example here

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

#4

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.