是否可以根据指定的坐标和屏幕尺寸计算区域

Question

我有一个坐标，我想为其设置地图区域。
问题是，当我将坐标传递给坐标位于区域中心的函数时为其创建区域。
我不想让它居中，我需要它向上一点。
例如，如果地图的高度为 500，我想设置区域，以便坐标位于顶部 250 的中心。

function getRegionForCoordinates(points) {
  // points should be an array of { latitude: X, longitude: Y }
  let minX, maxX, minY, maxY;

  // init first point
  ((point) => {
    minX = point.latitude;
    maxX = point.latitude;
    minY = point.longitude;
    maxY = point.longitude;
  })(points[0]);

  // calculate rect
  points.map((point) => {
    minX = Math.min(minX, point.latitude);
    maxX = Math.max(maxX, point.latitude);
    minY = Math.min(minY, point.longitude);
    maxY = Math.max(maxY, point.longitude);
  });

  const midX = (minX + maxX) / 2;
  const midY = (minY + maxY) / 2;
  let deltaX = (maxX - minX);
  let deltaY = (maxY - minY);

  return {
    latitude: midX,
    longitude: midY,
    latitudeDelta: 0.002,
    longitudeDelta: 0.002
  };
}

这个可以计算吗？

Answer 1

我有一个解决这个问题的方法，但它是用 MapKit (Apple Maps) 完成的，所以不确定这是否真的对你有帮助，但它可能会给你一些想法也许...

MapKit 有这个 MKCoordinateRegion 类型：

var region: MKCoordinateRegion {
    let regionSize = 10000.0
    let region = MKCoordinateRegionMakeWithDistance(coordinate, regionSize, regionSize)
    return region
}

并且可以将地图缩放到区域：

map.setRegion(region, animated: animated)

我在底部也有一些视图，想在屏幕的上部居中注释，所以我必须在设置地图区域之前进行一些计算：

let offset = CGPoint(x: 0, y: bottomViewHeight / 2)
let screenHeight = UIDevice.current.orientation == .portrait ? view.bounds.height : view.bounds.width
let offsetScreenPercentage = Double(offset.y / screenHeight)
region.center.latitude -= region.span.latitudeDelta * offsetScreenPercentage * 2

希望对你有帮助！

Answer 2

longitudeDelta和latitudeDelta是地图两侧和上下的差值。这些值可用于计算给定区域中地图中的不同位置。要了解有关这些值的更多信息，您可以阅读这篇文章 (MKMapView and Zoom Levels: A Visual Guide)

有了这些信息，您只需做一个小计算。首先，您将标记坐标设置为您拥有的坐标，然后您可以从增量中添加或减去 latitudeDelta 的某些部分，并将区域设置为该位置。

下面是示例代码，可以更好地描述它；

export default class App extends Component {
  state = {
    region: null,
    marker: null,
  };
  setMarkerAndRegion = () => {
    const initialReagion = {
      latitude: 37.78825,
      longitude: -122.4324,
      latitudeDelta: 0.0922,
      longitudeDelta: 0.0421,
    };

    // Set marker to the region's LatLong
    const marker = {
      latitude: initialReagion.latitude,
      longitude: initialReagion.longitude,
    };

    // Subtract the required amount from the latitude
    const region = {
      latitude: initialReagion.latitude - initialReagion.latitudeDelta / 4,
      longitude: initialReagion.longitude,
      latitudeDelta: initialReagion.latitudeDelta,
      longitudeDelta: initialReagion.longitudeDelta,
    };

    this.setState({ region, marker });
  };
  componentDidMount() {
    this.setMarkerAndRegion();
  }
  render() {
    const { region, marker } = this.state;
    return (
      <View style={styles.container}>
        {region && (
          <MapView style={{ flex: 1 }} initialRegion={region}>
            {marker && <Marker coordinate={marker} />}
          </MapView>
        )}
      </View>
    );
  }
}

是否可以根据指定的坐标和屏幕尺寸计算区域

Is it possible to calculate region based on specified coordinate and screen size

google-maps

latitude-longitude

ios

react-native

react-native-maps