qiuxiang / react-native-amap3d

react-native 高德地图组件,使用最新 3D SDK,支持 Android + iOS
https://qiuxiang.github.io/react-native-amap3d/api/
MIT License
1.27k stars 327 forks source link

iOS onLoad方法没有调用 #810

Open inkcrazy666 opened 10 months ago

inkcrazy666 commented 10 months ago

第一次进去 image

定位某个点 32b29fe20e8cd4526c561c9b3003fb94

再全览:

4997f83cf4a319598d7bc289e4afefcf

我是等所有数据都有了之后才加载地图的mapViews

mapViews = (
        <View style={styles.mapView}>
          <MapView
            ref={(ref) => (this.mapView = ref)}
            style={styles.mapView}
            onCameraIdle={({nativeEvent}) => {
              //地图状态改变事件,在停止变化后触发
              console.log('onCameraIdle===', nativeEvent);
              this.status = nativeEvent;
              this.cluster?.update(nativeEvent);
            }}
            onLoad={() => {
              console.log('onLoad===', this.location);
              this.mapView?.moveCamera({target: this.location, zoom: 9}, 20);
            }}
            onLocation={() => {
              console.log('onLocation');
            }}
            onCameraMove={() => {
              // console.log('onCameraMove');
            }}
            onPressPoi={(event) => {
              //标注点击事件
              console.log('onPressPoi');
            }}
            onPress={(event) => {
              //点击事件
              console.log('onPress===');
            }}
            mapType={MapType.Standard}
            // scrollGesturesEnabled={false} //是否启用滑动手势,用于平移
            tiltGesturesEnabled={false} //是否启用倾斜手势,用于改变视角
            rotateGesturesEnabled={false} //是否启用旋转手势,用于调整方向
            zoomControlsEnabled={true} //是否显示放大缩小按钮android
            // zoomGesturesEnabled={false} //是否启用缩放手势,用于放大缩小
            // myLocationEnabled={true}
            initialCameraPosition={{
              target: this.location,
              zoom: 9,
            }}>
            {markControl}
            {/* <Cluster
              onPress={({position}) => {
                console.log('Cluster===', position);
                this.mapView?.moveCamera(
                  {
                    target: position,
                    zoom: this.status.cameraPosition.zoom + 1,
                  },
                  20,
                );
              }}
              ref={(ref) => (this.cluster = ref)}
              points={markers}
              renderMarker={(item) => (
                <Marker
                  key={item.properties.key}
                  // icon={require('../res/img/ic_current_location_marker.png')}
                  position={item.position}>
                  <View
                    style={{
                      justifyContent: 'center',
                      alignItems: 'center',
                    }}>
                    <Image
                      style={{
                        width: 36,
                        height: 36,
                      }}
                      source={{uri: mapMarkImg}}
                    />
                    <Text
                      style={{
                        color: '#498FF7',
                        fontSize: 14,
                        position: 'absolute',
                        top: 3,
                      }}>
                      {item.code}
                    </Text>
                  </View>
                </Marker>
              )}
            /> */}
          </MapView>
        </View>
      );
inkcrazy666 commented 10 months ago

我目前的demo只用到了6个markers的map循环,我尝试一个也没用, 最后发现Marker组件下面的设置icon能直接显示,自定义的children下的组件就不容易渲染,我目前先放个占位的空白icon😂

image

作者提到的:
    // 如果主线程占用太多计算资源,会导致 ios onLoad 事件无法触发,非常蛋疼
    // 暂时想到的解决办法是等一个事件循环
ZerlinM commented 8 months ago

我也在ios上遇到这个问题了 现在还没解决吗 @qiuxiang

krmao commented 6 months ago

同样的问题, ios下 onLoad 没有回调