在MapView中将initialRegion.longitudeDelta`标记为必需,但其值是undefined。

时间:2019-05-22 12:44:44

标签: react-native

我想获取当前位置,但是它呈现了组件并在其上显示了地图,但是位置指针不可用,即显示代码我可以理解我有很多不同方式应用但失败了的问题。 请看一下这段代码,为什么我现在将硬编码值应用于经度Delta,而我却未定义     const latitudeDelta = 0.0922;     const longitudeDelta = 0.1;

 watchID  = null
    constructor() {
        super();
        this.state = {
            avatarSource: null,

            initialPosition:{
                latitude: 24.946218,
                longitude: 67.005615,
                latitudeDelta: latitudeDelta ,
                longitudeDelta:longitudeDelta
            },
            markerPosition:{
                    latitude:longitudeDelta,
                    longitude:latitudeDelta
            }
        }
    }



    componentDidMount(){
        navigator.geolocation.getCurrentPosition((position) => {
            var lat = parseFloat(position.coords.latitude);
            var long = parseFloat(position.coords.longitude);

            var initialRegion = {
                latitude : lat,
                longitude: long,
                latitudeDelta: latitudeDelta,
                longitude: longitudeDelta
            }

            this.setState({initialPosition: initialRegion});
            this.setState({markerPosition:initialRegion})
        },
         (err) => alert(JSON.stringify(err)),
         {enableHighAccuracy:true, timeout:2000})

         this.watchID = navigator.geolocation.watchPosition((positions) =>{
             var lat = parseFloat(positions.coords.latitude);
             var long = parseFloat(positions.coords.longitude);
             var initialRegions = {
                latitude : lat,
                longitude: long,
                latitudeDelta: latitudeDelta,
                longitude: longitudeDelta
            }
            this.setState({initialPosition: initialRegions});
            this.setState({markerPosition:initialRegions});
         })
    }

    componentWillUnmount(){
        navigator.geolocation.clearWatch(this.watchID)
    }


<MapView style={{ height: 200 }}                                    initialRegion={this.state.initialPosition}
/>

1 个答案:

答案 0 :(得分:0)

var initialRegion = {
  latitude : lat,
  longitude: long,
  latitudeDelta: latitudeDelta,
  longitude: longitudeDelta
}

在上面的代码中,您是将longitudeDelta分配给longitude而不是longitudeDelta。如下进行更正。

var initialRegion = {
  latitude : lat,
  longitude: long,
  latitudeDelta: latitudeDelta,
  longitudeDelta: longitudeDelta
}

但是您的代码中还有另一个问题。 latlong的定义如上。但是您尚未在代码中定义latitudeDeltalongitudeDelta

曾经仅使用latitudeDeltalongitudeDelta中的一个来计算地图的大小。因此,对这两者进行硬编码没有大问题。