バックエンドからの位置データを 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
}
});
}
コンソールログの経度と緯度の画面 全体の座標を次のように配置したい: {lon} {lat}
渡す方法は?
ありがとう