React Native MapView.Marker, Invariant Violation: "AIRGoogleMapMarker",

I’m trying to add 2 markers in my MapView component, but I get this error:

{"coordinate":{"latitude":"<<NaN>>","longitude":"<<NaN>>"}}]
enter image description here

I use the same 2 coordinates for MapViewDirections and it works just fine. I don’t know if it’s the right format that MapView.Marker expects for coordinates, but this is this.state.originData[0]

this.state.originData[0]:

Object {
  "latitude": 48.8652679,
  "longitude": 2.2789871,
}

MapView component:

   <MapView
              provider={PROVIDER_GOOGLE}
              style={styles.map}
              showsUserLocation={true}
              region={this.state.region}
              ref={(map) => {
                this.map = map;
              }}
              onRegionChange={this.onRegionChange}
              onRegionChangeComplete={this.onRegionChangeComplete}
              customMapStyle={lightMapStyle}
            >
              {this.state.originData
                ? [
                    <MapViewDirections
                      origin={this.state.originData[0]}
                      destination={this.state.destinationData[0]}
                      apikey={API.apiKey} // insert your API Key here
                      strokeWidth={4}
                      strokeColor="#9484d4"
                    />,
                     <MapView.Marker
                       image={fromIcon}
                       coordinate={this.state.originData[0]}
                     />,
                      <MapView.Marker
                       image={toIcon}
                      coordinate={this.state.destinationData[0]}
                    />,
                  ]
                : null}

            </MapView>

Source: Ask Javascript Questions

LEAVE A COMMENT