{"id":44591780,"url":"https://github.com/goong-io/goong-map-react","last_synced_at":"2026-02-14T07:08:39.540Z","repository":{"id":57113918,"uuid":"374978084","full_name":"goong-io/goong-map-react","owner":"goong-io","description":"A fork of react-map-gl. React components for Goong JS","archived":false,"fork":false,"pushed_at":"2022-12-30T04:08:44.000Z","size":14787,"stargazers_count":7,"open_issues_count":1,"forks_count":5,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-10-31T21:22:58.508Z","etag":null,"topics":["goong-io","goong-js","goong-map-react","map","react","react-map-gl","webgl"],"latest_commit_sha":null,"homepage":"https://docs.goong.io/goong-map-react","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/goong-io.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-06-08T11:05:50.000Z","updated_at":"2025-08-25T16:59:08.000Z","dependencies_parsed_at":"2023-01-31T10:31:13.920Z","dependency_job_id":null,"html_url":"https://github.com/goong-io/goong-map-react","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/goong-io/goong-map-react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/goong-io%2Fgoong-map-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/goong-io%2Fgoong-map-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/goong-io%2Fgoong-map-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/goong-io%2Fgoong-map-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/goong-io","download_url":"https://codeload.github.com/goong-io/goong-map-react/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/goong-io%2Fgoong-map-react/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29439023,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-14T05:24:35.651Z","status":"ssl_error","status_checked_at":"2026-02-14T05:24:34.830Z","response_time":53,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["goong-io","goong-js","goong-map-react","map","react","react-map-gl","webgl"],"created_at":"2026-02-14T07:08:38.866Z","updated_at":"2026-02-14T07:08:39.531Z","avatar_url":"https://github.com/goong-io.png","language":"JavaScript","readme":"[![npm](https://img.shields.io/npm/v/@goongmaps/goong-map-react.svg)](https://npmjs.org/package/@goongmaps/goong-map-react)\n## @goongmaps/goong-map-react | [Documentation](https://docs.goong.io/goong-map-react)\n\n`@goongmaps/goong-map-react` is a fork of [react-map-gl](https://github.com/visgl/react-map-gl). It provides React components for [Goong GL JS](https://github.com/goong-io/goong-js). More information in the online documentation.\n\nSee our [Design Philosophy](docs/README.md#design-philosophy).\n\n### Installation\n\nUsing `@goongmaps/goong-map-react` requires `react \u003e= 16.3`.\n\n```sh\nnpm install --save @goongmaps/goong-map-react\n```\n\n### Example\n\n```js\nimport * as React from 'react';\nimport ReactMapGL from '@goongmaps/goong-map-react';\n\nfunction Map() {\n  const [viewport, setViewport] = React.useState({\n    latitude: 21.03072,\n    longitude: 105.85239,\n    zoom: 12\n  });\n\n  return (\n    \u003cReactMapGL\n      {...viewport}\n      width=\"100%\"\n      height=\"100%\"\n      onViewportChange={(viewport) =\u003e setViewport(viewport)}\n    /\u003e\n  );\n}\n```\n\n### Using Goong Maptiles key\n\nTo show maps from Goong you will need to [register](https://account.goong.io) on our website in order to retrieve a map tiles key required by the map component, which will be used to identify you and start serving up map tiles. The service will be free until a certain level of traffic is exceeded.\n\nThere are several ways to provide a token to your app, as showcased in some of the example folders:\n\n* Provide a `goongApiAccessToken` prop to the map component\n* Set the `GoongAccessToken` environment variable (or set `REACT_APP_GOONG_ACCESS_TOKEN` if you are using Create React App)\n\nBut we would recommend using something like [dotenv](https://github.com/motdotla/dotenv) and put your key in an untracked `.env` file, that will then expose it as a `process.env` variable, with much less leaking risks.\n\n\n### Limitations\n\nThis library provides convenient wrappers around initializing and (to some degree) tracking the state of a Goong WebGL map. Because most of the functionality of Goong's JS API depends on the use of HTML5 canvases and WebGL, which React is not built to manipulate, the React component does not mirror all the functionality of Goong GL JS's Map class. You may access the native Goong API exposed by the `getMap()` function in this library. However, proceed with caution as calling the native APIs may break the connection between the React layer props and the underlying map state.\n\nExamples of replacing common native API calls with their React equivalents can be found on the [FAQ](/docs/get-started/faq.md) page.\n\n\n### Contribute\n\nSee [contribution guide](/CONTRIBUTING.md).\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgoong-io%2Fgoong-map-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgoong-io%2Fgoong-map-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgoong-io%2Fgoong-map-react/lists"}