地图上的手绘图折线滞后-本机反应

Question

我正在绘制折线，但是它确实很慢，这是一种改进方法吗？ 当手指在地图上缓慢移动时，折线的绘制方式实际上会很不方便。

我正在使用： “ react-native”：“ 0.59.10”， “ react-native-map-clustering”：“ ^ 3.1.2”， “ react-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>
  )}

这也是我希望其工作方式的一个示例：