https://www.gooddata.com/ logo
Join Slack
Powered by
Hi everyone. I am trying to integrate a GeoPushpin...
# gooddata-ui
h
Hi everyone. I am trying to integrate a GeoPushpin map in my dashboard in GoodData.UI. When running on localhost, the map works well with GeoPushPin component and InsightView. But when I run it on my server, neither of them work. Attached is how the map looks after deploying it. Any idea how to fix this?
j
Hello @Hrudhai Rajasekhar! Can you please make sure you are importing all the required CSS packages, and also that you are providing a working mapbox token?
h
Yes. I have imported everything. It works when I run it in my localhost. But doesn't work on the server. I am using the docker method to deploy the React application
j
@Hrudhai Rajasekhar so it works on your localhost, but it doesn't work when deployed? That's really strange 🤔 Can you please try some other chart type, e.g. a Column Chart? I'd like to rule out the possibility that this is due to wrong/missing mapbox token. Please let me know! 🙏
h
Yeah. The column chart also works fine without any issue. I tried giving a wrong mapbox token and it said specifically that I am using the wrong token
In fact, all other charts and insights are working perfectly fine. Only the map isn't working
j
@Hrudhai Rajasekhar are you working hosted GoodData platform (codename Bear), or with self-hosted GoodData.CN (codename Tiger)?
h
GoodData platform
j
@Hrudhai Rajasekhar it really should work. Can you share your project so that I can try to run it on my machine? I would try to deploy it on my S3 bucket and see if I'm able to replicate the issue.
If you're not comfortable sharing your source code, please share at least your package.json. I'd like see to what version of GD.UI you are using and I would test on my side.
h
Hi, sorry for the late response. I don't think I'll be able to share the project but I can share the package.json file
Copy code
"@gooddata/react-components": "^7.9.1",
        "@gooddata/sdk-backend-bear": "^8.9.0",
        "@gooddata/sdk-model": "^8.9.0",
        "@gooddata/sdk-ui": "^8.9.0",
        "@gooddata/sdk-ui-charts": "^8.9.0",
        "@gooddata/sdk-ui-dashboard": "^8.9.0",
        "@gooddata/sdk-ui-ext": "^8.9.0",
        "@gooddata/sdk-ui-filters": "^8.9.0",
        "@gooddata/sdk-ui-geo": "^8.9.0",
        "@gooddata/sdk-ui-pivot": "^8.9.0",
"mapbox-gl": "^2.8.2",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-helmet": "^6.1.0",
"react-icons": "^4.3.1",
"react-map-gl": "^7.0.10",
"react-query": "^3.39.0",
"react-redux-toastr": "^7.6.8",
"react-router-dom": "^5.3.0",
"react-router-use-location-state": "^2.3.1",
"react-scripts": "4.0.3",
These are the dependencies
j
@Hrudhai Rajasekhar I just tested myself with my private mapbox token and ended up with the same result 😞 I'm reporting this immediately and I'll keep you posted. Thank you for your patience!
Hello @Hrudhai Rajasekhar, our engineering team investigated the issue with deployed geo charts and it is caused by the combination of mapbox and create-react-app. The easiest workaround is to change your browserslist definition in your 
package.json
like this:
Copy code
"browserslist": {
        "production": [
            "defaults",
            "not ie 11"
        ], …
Then 
rm -rf node_modules/
to delete all your dependencies, 
yarn install
to install new dependencies and re-build and re-deploy. As you can see in the attached screenshot, this resolved the problem on our side, and we believe it will resolve the same problem on your side as well. We will fix this in the upcoming version of create-gooddata-react-app v8.10 that will be coming out most likely around mid-July. Once again, thank you for reporting this, thank you for your patience, and let us know if it resolved the issue on your side. If not, please let us know!
Open in Slack
PreviousNext
Powered by