Как показать другое местоположение в представлениях карты, зависит от выбранного средства выбора? (Реагируй Родной) - PullRequest
Новая
       28

Как показать другое местоположение в представлениях карты, зависит от выбранного средства выбора? (Реагируй Родной)

0 голосов
/ 01 ноября 2018

все. Я создаю собственное приложение для отображения другого местоположения в представлениях карт в зависимости от выбранного средства выбора.

Я думал об использовании условного оператора, обнаруживая слова, содержащиеся в строке, я использую библиотеку string-contains, чтобы обнаружить некоторые слова в строке. Вот пример моего кода: 

export default class App extends React.Component {
renderMap(){
  if(contains(this.state.name, "Branch 1")){
            return <MapView
            initialRegion={{
              latitude: 53.433980,
              longitude: -2.950960,
              longitudeDelta: 0.0922,
              latitudeDelta: 0.0421,
            }}
            style={{height: 200, width: 200, padding: 10, flex: 3, justifyContent: 'space-around'}}
          ><MapView.Marker
          coordinate={{
            latitude: 37.78825,
            longitude: -122.4324,
          }}
        /></MapView>;
        } else if(contains(this.state.name, "Branch 2")){
           return <MapView
            initialRegion={{
              latitude: 51.491610,
              longitude: -0.135560,
              longitudeDelta: 0.0922,
              latitudeDelta: 0.0421,
            }}
            style={{height: 200, width: 200, padding: 10, flex: 3, justifyContent: 'space-around'}}
          ><MapView.Marker
          coordinate={{
            latitude: 37.78825,
            longitude: -122.4324,
          }}
        /></MapView>;
        }
        else if(contains(this.state.name, "Branch 3")){
           return <MapView
            initialRegion={{
              latitude: 53.461220,
              longitude: -2.269540,
              longitudeDelta: 0.0922,
              latitudeDelta: 0.0421,
            }}
            style={{height: 200, width: 200, padding: 10, flex: 3, justifyContent: 'space-around'}}
          ><MapView.Marker
          coordinate={{
            latitude: 37.78825,
            longitude: -122.4324,
          }}
        /></MapView>;
        }
        else if(contains(this.state.name, "Branch 4")){
           return  <MapView
            initialRegion={{
              latitude: 51.262290,
              longitude: -1.081610,
              longitudeDelta: 0.0922,
              latitudeDelta: 0.0421,
            }}
            style={{height: 200, width: 200, padding: 10, flex: 3, justifyContent: 'space-around'}}
          ><MapView.Marker
          coordinate={{
            latitude: 37.78825,
            longitude: -122.4324,
          }}
        /></MapView>;
        }
}
render(){
const branchesPicker = this.state.branches.map((item, branch_id)=> {
      return(
            <Picker.Item
            label={item.name}
            value={item.address}
            key={item.branch_id}/>
        )
    });
      this.renderMap();
return(
<View style={styles.container}>
      <Picker
          selectedValue={this.state.name}
          mode="dropdown"
          style={{ height: 50, justifyContent: 'center', flex:4, alignItems: 'stretch', }}
          onValueChange={(item)=> this.setState({name: item})}>
        {branchesPicker}
    </Picker>
        {this.renderMap()}
      </View>

Когда я запускаю этот код, средство выбора работает нормально, но когда я пытался изменить средство выбора, карта не меняется, как я предполагал. Он показывает только статический вид одной карты (но вид карты не всегда из ветви 1, иногда он показывает ветку 2 или 3, когда я перезагружаю его. Но дело в том, что он не меняется ..)

fyi, this.state.name показывает название ветки выбранного сборщика.

Большое спасибо за вашу помощь! Это действительно много значит ..

1 Ответ

0 голосов
/ 01 ноября 2018

Предположим, вы используете ответные нативные карты.

Начальный регион используется для отображения и отображения местоположения, когда карта загружается в первый раз. Когда или если вы хотите изменить местоположение после загрузки, вы можете использовать animateToRegion или многие другие подобные методы . Поэтому, если вы хотите изменить местоположение на карте, когда что-то выбрано в сборщике, просто вызовите эти методы со своими данными.

вот фрагмент кода для справки. 

 this.map.animateToRegion({ latitude: region.latitude, longitude: region.longitude, latitudeDelta: latitudeDelta, longitudeDelta: longitudeDelta }, timeToChangeRegionInMilliSeconds);
...