web-dev-qa-db-ja.com

ReactネイティブMapView：緯度デルタ経度デルタとは

react native mapview の例では、緯度と経度があります。高さと幅に等しいですか？そして、どのユニットで？彼らの githubコメント に従って、それは言います

表示される最小緯度/最大緯度/経度間の距離。

しかし、それは私を助けません。ユーザーが地図上で見ているものを知りたい。

react-nativereact-native-maps
12
thatsIT

良いドキュメントが見つからず、グーグルが助けにならなかったので、私もここに来ました。以下は私自身の研究によるものです。

マップのサイズの計算には、latitudeDeltaまたはlongitudeDeltaのいずれか1つのみが使用されます。次の式に従って2つのうち大きい方を取り、もう一方を無視します。これは、マップのストレッチを回避するために行われます。

  1. マップは、スタイルで指定された幅および高さに応じてサイズ設定されるか、react-nativeによって計算されます。
  2. マップはlongitudeDelta/widthとlatitudeDelta/heightの2つの値を計算し、それら2つの計算値を比較し、2つのうち大きい方を取ります。
  3. マップはステップ2で選択された値に従ってズームされ、他の値は無視されます。
    • 選択した値がlongitudeDeltaの場合、左端はlongitude - longitudeDelta、右端はlongitude + longitudeDeltaです。上下は、マップを引き伸ばさずに高さを埋めるために必要な値です。
    • 選択した値がlatitudeDeltaの場合、下端はlatitude - latitudeDeltaで、上端はlatitude + latitudeDeltaです。左と右は、マップを引き伸ばさずに幅を埋めるために必要な値です。

ここではいくつかの例を示します。

// this uses latitudeDelta because 0.04/300 > 0.05/600
<MapView
  style={{width: 600, height: 300}}
  region={{
    latitude: 31.776685,
    longitude: 35.234491,
    latitudeDelta: 0.04,
    longitudeDelta: 0.05,
  }}
/>



// this uses longitudeDelta because 0.05/600 > 0/myVar when myVar > 0
<MapView
  style={{width: 600, height: myVar}}
  region={{
    latitude: 40.689220,
    longitude: -74.044502,
    latitudeDelta: 0,
    longitudeDelta: 0.05,
  }}
/>
16
Mike Martin

Apple開発者ガイド

マップ領域に表示する東西距離（度単位で測定）の量。経度範囲がまたがるキロメートル数は、現在の緯度に基づいて異なります。たとえば、1度の経度は、赤道で約111キロメートル（69マイル）の距離にわたっていますが、極では0キロメートルに縮小します。

????そのライブラリのGitHubにも解決された問題があります
https://github.com/react-community/react-native-maps/issues/637

この視覚的な説明も役立ちます stackoverflow.com
このウィキペディアの記事では、正確な値を計算する方法を示しています
https://en.wikipedia.org/wiki/Latitude#Length_of_a_degree_of_latitude

6
nima moradi

あなたが必要

"centroid": {
    "latitude": "24.2472",
    "longitude": "89.920914"
},
"boundingBox": {
    "southWest": {
        "latitude": "24.234631",
        "longitude": "89.907127"
    },
    "northEast": {
        "latitude": "24.259769",
        "longitude": "89.934692"
    }
}

または緯度デルタと経度デルタを適切に計算するための同様のデータ。

以下は、react/react-nativeのデモコードです。

componentDidMount() {
    const { width, height } = Dimensions.get('window');
    const ASPECT_RATIO = width / height;

    const lat = parseFloat(centroid.latitude);
    const lng = parseFloat(centroid.longitude);
    const northeastLat = parseFloat(boundingBox.northEast.latitude);
    const southwestLat = parseFloat(boundingBox.southWest.latitude);
    const latDelta = northeastLat - southwestLat;
    const lngDelta = latDelta * ASPECT_RATIO;

    this.setState({
      region: {
        latitude: lat,
        longitude: lng,
        latitudeDelta: latDelta,
        longitudeDelta: lngDelta
      }
    })     
}
0
M. Sihan