Question

当我输入代码region={this.props.region}时，它可以工作并将地图居中放置在搜索到的位置，但不允许在地图上选择其他标记...如果我选择，它总是返回到搜索到的位置在这部分代码region={this.props.region}之外，我可以选择其他标记，但是当我搜索其他位置时，相机不会移动到所选位置。在这种情况下如何进行？

以下是一些代码：

<MapView
        provider="google"
        style={styles.map}
        //region={this.props.region}
        initialRegion={this.state.focusedlocation}
        ref={ref => (this.map = ref)}>
        {this.renderMarkers()}
        <MapView.Marker
          onPress={this.pickLocationHandler}
          coordinate={this.props.region}>
          <Image source={markerImage} style={styles.icon} />
        </MapView.Marker>
      </MapView>

以下是标记动画的代码：

 pickLocationHandler = event => {
const coords = event.nativeEvent.coordinate;
console.log('Location picker Marker', coords);
this.map.animateToRegion({
  ...this.state.focusedlocation,
  latitude: coords.latitude,
  longitude: coords.longitude,
  latitudeDelta: LATITUDE_DELTA,
  longitudeDelta: LONGITUDE_DELTA,
});

Please open this snack to entire code

Answer 1

library(DT) library(shiny) shinyApp( ui = fluidPage( actionButton('edit', 'Edit') ), server = function(input, output, session) { observeEvent(input$edit, { showModal( modalDialog( DTOutput("table"), actionButton('apply', 'Apply') ) ) }) output$table <- renderDT({ datatable( iris %>% mutate(check = lapply(seq_len(nrow(iris)), function(i) as.character(checkboxInput(paste0('check', i), '', F)))), options = list( select = list(style = "multi", selector = "td:not(.notselectable)"), preDrawCallback = JS('function() { Shiny.unbindAll(this.api().table().node()); }'), drawCallback = JS('function() { Shiny.bindAll(this.api().table().node()); } ')), extensions = "Select", selection = "none") }) observeEvent(input$apply, { inputs = reactiveValuesToList(input) removeModal(session) print(inputs[grepl('check', names(inputs))]) }) } )用于控制地图的视口。您可以使用region将地图移动到搜索到的位置。

animateCamera

更新

map-view.js

this.map.animateCamera({
  center: {latitude, longitude}
})

map-container.js

export default class MapView extends Component {
  ...
  animateToLocation = (location) => {
    this.map.animateToRegion({
      latitude: location.latitude,
      longitude: location.longitude,
      latitudeDelta: LATITUDE_DELTA,
      longitudeDelta: LONGITUDE_DELTA,
    });
  }
  ...
  render() {
    return (
      <View style={styles.container} {...this.props}>
      ...
    )
  }
}

地图始终位于搜索到的位置标记的中心

1 个答案:

更新