以正确的格式放置坐标

Question

我正在尝试将来自后端的位置数据放入 react-map-gl，但我遇到了一个小障碍。

    addLines = () => {
    const geo = this.state.geo;
    const insideGeo = geo.map(dataItem => {
        const json = new Buffer(dataItem.payload, "hex").toString();
        if (json !== '')
            return JSON.parse(json);
        return json;
    }).filter(item => (item !== ''));
    const lat = insideGeo.map(item => item.eventData.location.latitude);
    const lon = insideGeo.map(item => item.eventData.location.longitude);
    console.log('Lat:', lat[4]);
    console.log('Lon:', lon[4]);
    const map = this.refs.map.getMap()
    map.addLayer({
        "id": "route",
        "type": "line",
        "source": {
            "type": "geojson",
            "data": {
                "type": "Feature",
                "properties": {},
                "geometry": {
                    "type": "LineString",
                    "coordinates": [
                        [
                            lon[4], lat[4]
                        ],
                        [
                            lon[5], lat[5]
                        ],
                    ]
                }
            }
        },
        "layout": {
            "line-join": "round",
            "line-cap": "round"
        },
        "paint": {
            "line-color": "#18c3ea",
            "line-width": 3
        }
    });
}

Its screen of console log lon and lat 我想把整个坐标像这样：{lon} {lat}

It working if I will put only together specific number.

如何通过？

谢谢

Answer 1

根据您的代码，它似乎可以工作。

数组方法：

替换以下行：

const lat = insideGeo.map(item => item.eventData.location.latitude);
const lon = insideGeo.map(item => item.eventData.location.longitude);

与：

const coords = insideGeo.map(item => [item.eventData.location.latitude, item.eventData.location.longitude]);

您可以像这样访问数字：

const lat = coords[index][0]
const lon = coords[index][1]

---

对象方法：

替换以下行：

const lat = insideGeo.map(item => item.eventData.location.latitude);
const lon = insideGeo.map(item => item.eventData.location.longitude);

与：

const coords = insideGeo.map(item => item.eventData.location);

您可以像这样访问数字：

const lat = coords[index].latitude
const lon = coords[index].longitude