Open Android773 opened 5 years ago
react-native-maps-osmdroid
based on Osmdroid. Osmdroid - OpenStreetMaps implementation for Android
You can use AppleMaps provider for iOS.
Final code can look like this:
import { Platform} from 'react-native'
import MapView from "react-native-maps-osmdroid"
<MapView
provider={Platform.OS === 'ios' ? null : 'osmdroid'}
/>
@Peretz30 Basically I want to show Osmdroid - Open Street Maps on iOS as well. That is what I was trying to achieve.
Hello @Android773, I understand but this project does not support that at this moment. I created this fork to enable me to remove all dependencies on Google Maps on my projects, and I just didn't care about using Apple maps.
It would be amazing to have OSM on all platforms, but I just don't have the time nor the knowledge to implement this on iOS. To be honest, I am not even have the time to maintain this fork as it deserves: we are two versions behind react-native-maps.
I will left this issue open, since this is a common question and/or request. Maybe someone interested in this could help on this implementation. ;-)
@fqborges Hey thanks buddy ! I understand this and really appreciate your efforts for creating the library. Let's hope if someone could help further on this.
@Android773 How about using UrlTile
?
<UrlTile
urlTemplate="http://c.tile.openstreetmap.org/{z}/{x}/{y}.png"
/>
hello, @slavikdenis I just want to ask {z/x/y} what does mean?
here's I got after trying MapView as you write in your code, How can I solve it? @Android773
Is this a bug report?
Yes.
Have you read the Installation Instructions?
Yes.
Environment
react-native: 0.59.9 react: 16.8.3 react-native-maps-osmdroid: ^0.23.0-rc2 Target Platform: iOS - 12.2 Simulator/iPhone XR
Steps to Reproduce
- Created new React Native project using,
react-native-init AppName
- Added osmdroid library using,
yarn add react-native-maps-osmdroid
- Linked using
react-native link react-native-maps-osmdroid
- Added following code,
import MapView from 'react-native-maps-osmdroid'; <MapView style={{flex: 1}} initialRegion={{ latitude: 30.7333, longitude: 76.7794, latitudeDelta: 0.0922, longitudeDelta: 0.0421, }} />
If I follow the above mentioned steps and run the app on Android, then it shows Open Street Maps, I think that is because on Android the default provider is osmdroid.
But if I run the app on iOS device, then by default it shows Apple Maps.
- So I changed provider to osmdroid like the following,
import MapView, { PROVIDER_OSMDROID } from 'react-native-maps-osmdroid'; <MapView style={{flex: 1}} provider={ PROVIDER_OSMDROID } initialRegion={{ latitude: 30.7333, longitude: 76.7794, latitudeDelta: 0.0922, longitudeDelta: 0.0421, }} />
But it doesn't work and throws error.
Expected Behavior
It should show Open Street Map on App.
Actual Behavior
Getting following Error,
"Invariant Violation: Element type is invalid: expected a string (for built in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it’s defined in, or you might have mixed up default and named imports."
Suggestion:
- Right now it only shows installation instructions of react-native-maps. From that a new developer might not get that he/she needs to install react-native-maps-osmdroid. So it will be better and very helpful if you could add installation instructions as well in the read me file. Thanks.
Reproducible Demo
same with me
Is this a bug report?
Yes.
Have you read the Installation Instructions?
Yes.
Environment
react-native: 0.59.9 react: 16.8.3 react-native-maps-osmdroid: ^0.23.0-rc2 Target Platform: iOS - 12.2 Simulator/iPhone XR
Steps to Reproduce
react-native-init AppName
yarn add react-native-maps-osmdroid
react-native link react-native-maps-osmdroid
If I follow the above mentioned steps and run the app on Android, then it shows Open Street Maps, I think that is because on Android the default provider is osmdroid.
But if I run the app on iOS device, then by default it shows Apple Maps.
But it doesn't work and throws error.
Expected Behavior
It should show Open Street Map on App.
Actual Behavior
Getting following Error,
"Invariant Violation: Element type is invalid: expected a string (for built in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it’s defined in, or you might have mixed up default and named imports."
Suggestion:
Reproducible Demo