我正在开发一个React应用，该应用使用react-google-maps库将费城农民的市场显示为Google地图上的标记。

创建Google地图后，我将通过ArcGIS API访问农民的市场数据，并遍历数据数组以返回每个农民的市场的标记。

我遇到了一个问题，因为当我需要它们在纬度和经度上才能使Google Maps能够显示它们时，我在ArcGIS中所具有的位置数据将返回信息为x y坐标。幸运的是，ArcGIS具有module来进行这种转换，并提供了一种use these modules in React的转换方式。

我遇到的问题是如何成功渲染标记，这意味着在数据集上进行映射以首先转换坐标，然后在标记的每个实例中使用转换后的坐标。通过以下代码，我得到“错误：对象作为React子对象无效（找到：[object Promise]）。如果要渲染子代集合，请改用数组。”我对此有些迷惑，不胜感激！

const Map = () => {
  const [markets,setMarkets] = useState([])

  useEffect(() => {
    axios.get(apiUrl)
      .then(res => {
        setMarkets(res.data.features)
      })
      .catch(err => console.log(err))
  },[])

  return (
    <GoogleMap 
      defaultzoom={12}
      defaultCenter={{ lat: 39.952583,lng: -75.165222 }}
    >
      {loadmodules(['esri/geometry/support/webMercatorUtils'])
        .then(([webMercatorUtils]) => {
          markets.map(market => {
          let latLong = webMercatorUtils.xyToLngLat(market.geometry.x,market.geometry.y)
          return <Marker 
            key={market.attributes.OBJECTID} 
            position={{
              lat: latLong[1],lng: latLong[0]
            }}/>  
          })
        })}
    </GoogleMap>
  )}

const WrappedMap = withScriptjs(withGoogleMap(Map))
export default WrappedMap