Рука Рисование Полилинии на карте отстает - реагировать родной - PullRequest
Новая
       14

Рука Рисование Полилинии на карте отстает - реагировать родной

0 голосов
/ 12 марта 2020

Я вручную рисую полилинию, но она очень медленная, это способ улучшить ее? Когда палец медленно перемещается по карте, Полилиния действительно отрисовывается с задержкой.

Я использую: "Reaction-native": "0.59.10", «response-native-map-clustering»: «^ 3.1.2», «response-native-maps»: «^ 0.25.0».

Вот код, который я использую: 

constructor(args) {
  this.state={
    regionLocal: {latitude: 37.78825,
                  longitude: -122.4324,
                  latitudeDelta: 0.1022,
                  longitudeDelta: 0.0521
              },
    polylines: [],               
    editing: null
  }
}

onPanDrag(e) {
  const { editing } = this.state;
  if (!editing) {
    this.setState({
      editing: {
        id: id++,
        coordinates: [e.nativeEvent.coordinate],
      },
    });
  } else {
    this.setState({
      editing: {
        ...editing,
        coordinates: [...editing.coordinates, e.nativeEvent.coordinate],
      },
    });
  }
}

render() {
  return (
      <MapView  mapRef={ref => this.map = ref}
          style={{
              position: 'absolute',
              top: 0,
              left: 0,
              right: 0,
              bottom: 0
          }} 
          initialRegion={this.state.regionLocal}
          showsUserLocation={true}
          showsPointsOfInterest={true}
          showsBuildings={true}
          showsMyLocationButton={false}
          loadingEnabled={true}
          clusterColor={"#140c98"}
          spiderLineColor={"#140c98"}
          radius={30}
          moveOnMarkerPress={false}
          maxZoom={13}
          scrollEnabled={false}
          onPanDrag={(e)=>{this.onPanDrag(e)}}
          >
              {this.state.polylines.map(polyline => (
                  <Polyline
                    key={polyline.id}
                    coordinates={polyline.coordinates}
                    strokeColor="#000"
                    fillColor="rgba(255,0,0,0.5)"
                    strokeWidth={1}
                  />
                ))}
                {this.state.editing && (
                  <Polyline
                    key="editingPolyline"
                    coordinates={this.state.editing.coordinates}
                    strokeColor="#F00"
                    fillColor="rgba(255,0,0,0.5)"
                    strokeWidth={1}
                  />
                )}
  </MapView>
  )}

Также вот пример того, как я хочу, чтобы он работал:

image description

...