javascript - 如何将坐标数组映射到React Native Maps Markers中？(How can I map an array of coordinates into React Native Maps Markers?)

Question

I want to map an array of geographical coordinates into React Native Maps Markers (ie pins).(我想将一系列地理坐标映射到React Native Maps Markers（即图钉）中。)

The array of data I am mapping through has about 100 values.(我正在映射的数据数组大约有100个值。) Thus, I am expecting 97 markers to render (the API data isn't perfect).(因此，我期望呈现9??7个标记（API数据并不完美）。) However, 0 markers appear on the Google map.(但是，0个标记出现在Google地图上。) Here is my code:(这是我的代码：) mapDataToMarkers() { const searchData = this.props.data; return ( <MapView style={styles.mapStyle} mapType={"mutedStandard"}> {searchData.map((host, i) => { if (host.location.latitude && host.location.longitude) { console.log("TEST", host.location.latitude); <Marker key={i} coordinate={{ latitude: host.location.latitude, longitude: host.location.longitude }} title={host.name} pinColor={"#ffd1dc"} />; } })} </MapView> ); The console.log() produces 97 latitudes in my terminal, so I know the data is correct and the code is reachable.(console.log()在我的终端中产生97个纬度，因此我知道数据是正确的并且代码可以访问。) I've already tried passing an object called latlng to the coordinate prop as the documentation suggests, but to no avail.(正如文档所建议的那样，我已经尝试过将名为latlng的对象传递给coordinate prop，但无济于事。) Any help would be greatly appreciated, as I never figured this would be an issue in the first place.(任何帮助将不胜感激，因为我从未想过这首先是一个问题。) Click for React-Native-Maps Documentation(点击查看React-Native-Maps文档)   ask by jmedran translate from so

Answer 1

you don't return anything in the map function, try this:(您没有在map函数中返回任何内容，请尝试以下操作：)

<MapView style={styles.mapStyle} mapType={"mutedStandard"}> {searchData.map((host, i) => { if (host.location.latitude && host.location.longitude) { console.log("TEST", host.location.latitude); return(<Marker key={i} coordinate={{ latitude: host.location.latitude, longitude: host.location.longitude }} title={host.name} pinColor={"#ffd1dc"} />) } })} </MapView> you can see it document(你可以看到它的文件)