Questions tagged [react-simple-maps]
26 questions
                    
                    3
                    
            votes
                
                1 answer
            
        Selectable states in react-simple-maps
I'm creating a map using react-simple-maps librery
this is my code so far
      
        
            
            
                
                    
    
    
         
    
    
                
            
        
      
 
    
    
        Jose A.
        
- 483
- 2
- 7
- 15
                    3
                    
            votes
                
                0 answers
            
        Error in "React simple maps" - zoom not working for value other then 1
I have used react simple maps, and want to add a custom zoom control to change zoom levels based on button clicks.
import React, { memo, useState } from "react";
import {
  ZoomableGroup,
  ComposableMap,
  Geographies,
  Geography
} from…
         
    
    
        Arjit Acharya
        
- 31
- 2
                    2
                    
            votes
                
                0 answers
            
        How to add multiple coordinates to the map using the react-simple map
I'm attempting to add cordinates to my map of USa using react-simple-map, I want to have single origin point and but multiple destinations.
but this is how it renders.
https://codesandbox.io/s/equator-forked-62oi7x.
Do we need a to and from…
         
    
    
        user1234
        
- 3,000
- 4
- 50
- 102
                    2
                    
            votes
                
                1 answer
            
        react-simple-maps shos small and not centered map
I'm using react-simple-maps to show a SVG map of Argentina, but the issue is that react-simple-maps shows with a small size the map and is not centered. I tried some things to fix it but I don't understand how to fix it.
It's the codesandbox where…
         
    
    
        Fernando Azarías
        
- 23
- 2
                    1
                    
            vote
                
                0 answers
            
        React Simple Maps enlargen selected part of map on click
I have implemented US states by using react-simple-maps. I'm changing the geo url on the click of a state and I want the state to look bigger but it remains intact to it's location. I don't necessarily need to use this library but I need to put…
         
    
    
        ouroboros
        
- 11
- 2
                    1
                    
            vote
                
                1 answer
            
        Generate map PDF using react-simple-maps and @react-pdf/renderer
in my use case, I have maps generated using the react-simple-maps component, I need to generate the pdf of this map, I'm trying to do this using the @react-pdf/renderer component, but it's not working!
React-pdf
React Simple Maps
See the example on…
         
    
    
        Cleiton Freitas
        
- 387
- 7
- 18
                    1
                    
            vote
                
                0 answers
            
        Not able to apply styles on Marker- React simple map
I'm attempting to style markers to my map, but nothing works.
const geoUrl = "https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json";
const MapChart = () => {
return (
      
        
            
            
                
                    
    
    
         
    
    
                
            
        
      
 
    
    
        user1234
        
- 3,000
- 4
- 50
- 102
                    1
                    
            vote
                
                1 answer
            
        React simple maps renders the inverted polygon from the topojson
When I add a polygon, the entire area of the map is filled, and the polygon is "cut" out of it.
I expect a simple polygon to be rendered.
Here is a live example https://codesandbox.io/s/lsz8qh
This is my topojson
`
{
  "type": "Topology",
 …
         
    
    
        Vadzim Liashkevich
        
- 121
- 4
                    1
                    
            vote
                
                1 answer
            
        Simple-map React, on hover it doesnt display the name
I'm trying to display the country name on hover using simple-map react with react tooltip.
With the console log on mouse enter I realised that on hover I actually get the name of the country and the rest of the info I need. Then i try to set it on…
         
    
    
        Stamatia M.
        
- 11
- 2
                    1
                    
            vote
                
                1 answer
            
        Is there a way to access the link inside react-tooltip on hover?
Im using react-simple-maps with react-tooltip
Looks like the hover works fine, but I try to click on a link I've added on the tooltip but before I can get to the tooltip, it disappears and I can't access the content with my mouse.
is this possible?
         
    
    
        Ken Ryan
        
- 539
- 1
- 10
- 31
                    1
                    
            vote
                
                0 answers
            
        React SVG Rendering Optimization
I made a globe map with react-simple-maps, did my best to optimize the rendering but still slow with complex json.
steps to reproduce
drag/zoom the globe, check performance
change top radio input to regions (more complex json)
drag/zoom the globe…
         
    
    
        Jimi Gaspar
        
- 11
- 2
                    1
                    
            vote
                
                1 answer
            
        How to set ComposableMap not-focusable?
I'm trying to make a map that will show the name of the country when you hover your cursor. For this I am using react-simple-map with react-tooltip:
function OnHoverMap() {
  const [content, setContent] = useState("");
    return (
        
            
            
                
                    
    
    
         
    
    
                
            
        
    
 …
         
    
    
        Natsuo
        
- 63
- 7
                    1
                    
            vote
                
                1 answer
            
        On react simple maps, is there a way to get coordinates of location in map by clicking on one?
I'm trying to make an interactive page in which there's a world map, and when you click on a location it creates a marker and saving the coordinates.
Any idea on how to achieve that?
         
    
    
        Oren Sayag
        
- 31
- 1
- 4
                    1
                    
            vote
                
                1 answer
            
        Change region color on click (react-simple-maps)
I'm using react simple maps. I created a US map and I need to change the color of the state on click. I can change it by adding a press style prop to the Geography component but the color gets back to the default color when the click event is ended.…
         
    
    
        Aysun Sulun Tas
        
- 21
- 2
                    0
                    
            votes
                
                0 answers
            
        Why is my ReactTooltip changing padding size after revisiting a webpage?
When just visiting my main webpage, the tooltip when hovering over the countries in my react-simple-maps map looks pretty normal:
tooltip
However, after going to a different webpage, and then promptly returning to the map-containing webpage (same…
         
    
    
        Ryan
        
- 1