question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Markers fail to render for albersUSA

See original GitHub issue

The following throws an error on my map when using AlbersUSA projection,

              {events.map(event => {
                const marker = {
                  coordinates: event.geoLocation,
                  name: event.title,
                };

                return (
                  <Marker marker={marker} key={event.id}>
                    <circle cx={0} cy={0} r={10} />
                  </Marker>
                );
              })}

The error happens because it’s calling clipAngle on the projection but clipAngle doesn’t exist, https://github.com/zcreativelabs/react-simple-maps/blob/423a5aea814e1be7626801fbafb04aa717f180a4/src/Marker.js#L117

I was able to change the compiled src,

var isGlobe = projection.clipAngle() === degrees;

to

var isGlobe = false;

and the markers successfully rendered.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
samuel-belcastrocommented, Apr 9, 2020

@zimrick this still happens but now with error: TypeError: Invalid attempt to destructure non-iterable instance

Passing array coordinates with albersUSA projection fails. I switched projections and it worked fine

0reactions
Maintrain97commented, Jun 19, 2020

@zimrick I am experiencing the same issues reported above by @samuel-belcastro

Read more comments on GitHub >

github_iconTop Results From Across the Web

Problem with rendering markers | React Native - Stack Overflow
I use for maps in react native-react-native-maps. I need to render markers to the map from json file. But I have a error...
Read more >
Cannot read property '0' of null - Interactive Geo Maps
If the map does not display and instead it displays this error, most likely it's something related with your markers coordinates.
Read more >
Rendering the US with React Simple Maps | by August Giles
In this article, we will be rendering an Albers projection of the USA (a conic projection (according to the internet )), which brings...
Read more >
4 Maps
A useR guide to creating highly interactive graphics for exploratory and expository visualization.
Read more >
Projections - React Simple Maps
These include: geoEqualEarth — Equal Earth projection; geoAlbers — Albers projection; geoAlbersUsa — Albers USA composite projection; geoAzimuthalEqualArea — ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found