Current I faced a problem with google-maps-react, When I change the value of lat and lng. The location of the map won't change to the location selected using a select box.
...
const [selectedCountry, setSelectedCountry] = useState({});
const handleChangeCountry = (event, index) => {
setLoading('true');
setSelectedIndex(index);
setCountryValue(countryList[index]);
};
const setCountryValue = (value) => {
let updatedValue = {};
updatedValue = value;
setSelectedCountry(selectedCountry => ({
...selectedCountry,
...updatedValue
}))
setLoading('false');
};
<Map
google={window.google}
zoom={10}
style={mapStyles}
initialCenter={
{
lat: selectedCountry.latlng[0],
lng: selectedCountry.latlng[1]
}
}
><Marker
name={'Current location'} />
</Map>
Below I have provided some screenshot.
As you can see the value change in the right details section, but the map at the middle still remains the same as the 1st picture.
Thanks for taking your time to help me/