Javascript 如何获取坐标并在地图中按城市名称放置标记？

有没有可能只凭城市的名字就得到坐标并在城市上做标记？我正在尝试获取我的

搜索
值的坐标（它是城市）。我正在使用React Native Maps，下面是我的代码：

import React, {useState} from 'react';
import { View, StyleSheet, Alert, ActivityIndicator } from 'react-native';
import {SearchBar, Button} from 'react-native-elements';
import MapView from 'react-native-maps';
import Spinner from 'react-native-loading-spinner-overlay';

export default function LinksScreen() {
  const [spinner, setSpinner] = useState(false);
  const [search, setSearch] = useState('');
  const handleChange = event => {
    setSearch(event);
  }
  const [latitudePress, setLatitude] = useState('46.54306');
  const [longitudePress,setLongitude] = useState('14.96917');
  function addMarkerAndRequest(e){
    console.log(e.nativeEvent);
    setLatitude(e.nativeEvent.coordinate.latitude); 
    setLongitude(e.nativeEvent.coordinate.longitude);
    const coords = {
      latitude: e.nativeEvent.coordinate.latitude,
      longitude: e.nativeEvent.coordinate.longitude
    };
    Alert.alert(
      'Sprememba mesta',
      'Stanje v komori se bo spremenilo. Ali ste prepričani?',
      [
        {
          text: 'NE',
          style: 'cancel',
        },
        {
          text: 'OK', 
          onPress: () => {
            fetch(`http://192.168.88.253:5000/insert/${coords.longitude}/${coords.latitude}`);
          }
        },
      ],
      {cancelable: false},
    )
  }

  return (
    <View style={styles.container}>
      <Spinner
          visible={spinner}
          textStyle={styles.spinnerTextStyle}
      />
      <SearchBar
        containerStyle={{borderColor:'#eee', borderWidth:1}}
        placeholder="Vnesi mesto.."
        onChangeText={(e) => {setSearch(e)}}
        value={search}
        platform='android'
      />
      <MapView
        style={{width:'100%', height:'80%'}}
        initialRegion={{
        latitude: Number(latitudePress),
        longitude: Number(longitudePress),
        latitudeDelta: 0.0922,
        longitudeDelta: 0.0421,
        }}
        onPress={ (event) => addMarkerAndRequest(event) }
      >
        <MapView.Marker
            coordinate={{latitude: Number(latitudePress),
            longitude: Number(longitudePress)}}
            title={`ZŠ: ${latitudePress}, ZD: ${longitudePress}`}
         />
      </MapView>
      <Button 
        onPress={()=>Alert.alert(
          'Sprememba mesta',
          'Stanje v komori se bo spremenilo. Ali ste prepričani?',
          [
            {
              text: 'NE',
              style: 'cancel',
            },
            {
              text: 'OK', 
              onPress: () => {
                fetch(`http://192.168.88.253:5000/insertcity/${search}`);
                setSearch('');
              }
            },
          ],
          {cancelable: false},
        )}
        title='POTRDI'
      ></Button>
    </View>
  );
}

LinksScreen.navigationOptions = {
  title: 'Zemljevid',
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    justifyContent:'space-between'
  },
});


import React，{useState}来自“React”；
从“react native”导入{View，StyleSheet，Alert，ActivityIndicator}；
从“react native elements”导入{SearchBar，Button}；
从“react native maps”导入MapView；
从“react native loading Spinner overlay”导入微调器；
导出默认函数LinksScreen（）{
常数[spinner，setSpinner]=useState（false）；
const[search，setSearch]=useState（“”）；
const handleChange=事件=>{
集合搜索（事件）；
}
常数[latitudePress，setLatitude]=useState（'46.54306'）；
const[longitudePress，setLongitude]=useState（'14.96917'）；
函数addMarkerAndRequest（e）{
控制台日志（例如nativeEvent）；
设置纬度（e.nativeEvent.coordinate.latitude）；
设置经度（e.nativeEvent.coordinate.longitude）；
常数坐标={
纬度：e.nativeEvent.coordinate.latitude，
经度：e.nativeEvent.coordinate.longitude
};
警惕，警惕(
“Sprememba mesta”，
“Stanje诉komori se bo spremenilo.Ali ste Prepičani案？”，
[
{
文本：“NE”，
样式：“取消”，
},
{
文本：“OK”，
onPress:（）=>{
取回(`http://192.168.88.253:5000/insert/${coords.longitude}/${coords.latitude}`）；
}
},
],
{可取消：false}，
)
}
返回(
{setSearch（e）}
值={search}
平台“='android'
/>
addMarkerAndRequest（事件）}
>
警惕，警惕(
“Sprememba mesta”，
“Stanje诉komori se bo spremenilo.Ali ste Prepičani案？”，
[
{
文本：“NE”，
样式：“取消”，
},
{
文本：“OK”，
onPress:（）=>{
取回(`http://192.168.88.253:5000/insertcity/${search}`）；
集搜索（“”）；
}
},
],
{可取消：false}，
)}
title='POTRDI'
>
);
}
LinksScreen.navigationOptions={
标题：“泽姆列维德”，
};
const styles=StyleSheet.create({
容器：{
弹性：1，
背景颜色：“#fff”，
为内容辩护：“间隔”
},
});
您可以按此处所述进行google places搜索-

您需要设置一个google API密钥才能使其正常工作（文档描述了如何做到这一点）

一旦您从places搜索中获得正确的响应（响应可能会返回多个结果，但您正在查找包含值
location
-它是location/city类型的位置的
类型的结果），您可以使用响应
geometry.location
（在此处检查响应-）获取坐标并在地图上放置标记