Javascript 跨世界副本处理Mapbox GeoJson行？

我有一个mapbox地图，我正在上面渲染点，并在点之间绘制线以创建管线。设置工作正常，动画工作正常

然而，当我有一条线穿过一个新的世界复制曲线绘制，但另一条线也绘制了整个地图

有人知道一种处理线条绘制的方法，这样它们就不会进入新的世界渲染了吗？或者你有没有关于处理线条绘制的最佳方法的想法

作为参考，我使用了以下mapbox示例：

showRoute=route=>{
常数步数=500；
常量getRouteChunks=（数组，大小）=>{
常量chunkedArr=[]；
array.forEach（（arr，i）=>{
chunkedArr.push（array.slice（i，i+size））；
});
返回chunkedArr；
};
const routeChunks=getRouteChunks（route.destinations，2）；
this.setState（prevState=>{
//让我们删除所有现有的管线
const mapLayers=prevState.map.style.\u层；
const midlayers onlytoremove=this.getMapboxLayers存储移动（mapLayers，'-midpoint'）；
MidlayerOnlyToRemove.forEach（activeLayer=>{
prevState.map.removeLayer（activeLayer.id）；
});
const layersAndSourcesToRemove=this.getMapboxLayersToRemove（mapLayers，'Route'）；
layersAndSourcesToRemove.forEach（activeLayer=>{
prevState.map.removeLayer（activeLayer.id）；
prevState.map.removeSource（activeLayer.id）；
});
const layers onlytoremove=this.getMapboxLayers存储移动（mapLayers，'symbolPoint'）；
LayerOnlyToRemove.forEach（activeLayer=>{
prevState.map.removeLayer（activeLayer.id）；
});
//获取状态中所有geojson的副本，然后找到我们需要的目的地
const{allGeoJson}=prevState；
const destinationId=route.destinations.map（dest=>dest.id）；
常量activeRouteDestinationsGeoJson=allGeoJson.features.filter（feature=>
destinationId.some（dId=>dId==feature.properties.id）
);
//使用相关目标设置更新的geojson对象
常数activeRouteGeoJson={
特点：activeRouteDestinationsGeoJson，
类型：“FeatureCollection”，
};
//获取已在ReactDOM中呈现的当前标记，如果不需要，则将其删除
const currentDomMarkers=document.querySelectorAll（`.current mapoint marker`）；
currentDomMarkers.forEach（marker=>{
const routeIds=marker.getAttribute（'route-id'）.split（'，'）；
const compareCatArrays=routeIds.some（c=>c==route.id）；
如果（！compareCatArrays）{
marker.remove（）；
}
});
//如果用户单击已处于活动状态的路线，请将其取消设置并再次显示所有点
if（prevState.activeRouteId==路由.id）{
这个.renderMarkers（allGeoJson）；
getMapboxJs（）。然后（{default:mapboxgl}）=>{
const bounds=new mapboxgl.LngLatBounds（）；
allGeoJson.features.forEach（feature=>{
扩展（特征、几何、坐标）；
});
prevState.map.fitBounds（边界{
填充：{顶部：200，底部：200，左侧：200，右侧：200}，
放松（t）{
返回t*（2-t）；
},
});
});
返回{geojson:allGeoJson，activeRouteId:null，activeRoute:null}；
}
routeChunks.forEach（（块，i）=>{
设计数器=0；
const icon=route.routeSteps[i]；
const getIcon=icon=>{
开关（图标）{
“航班”案例：{
返回“机场-15”；
}
“火车”案例：{
返回“rail-15”；
}
违约：
返回“机场-15”；
}
};
const pointExists=prevState.map.getSource（`symbolPoint-${chunk[0].id}`）；
const lineExists=prevState.map.getSource（`Route line-${i}`）；
常量chunkPoint={
类型：“FeatureCollection”，
特点：[
{
键入：“功能”，
属性：{}，
几何图形：{
键入：“点”，
坐标：块[0]。坐标，
},
},
],
};
如果（！pointExists）{
prevState.map.addSource（`symbolPoint-${chunk[0].id}`{
键入：“geojson”，
数据：chunkPoint，
});
}
const chunkLength=chunk.length；
如果（chunkLength==2）{
常量chunkRoute={
类型：“FeatureCollection”，
特点：[
{
键入：“功能”，
几何图形：{
键入：“LineString”，
坐标：[块[0]。坐标，块[1]。坐标]，
},
},
],
};
const chunkLine=lineString（[…chunkRoute.features[0].geometry.coordinates]）；
const chunkLineDistance=长度（chunkLine，{单位：'英里'}）；
常量chunkArc=[]；
//在两点的“起点”和“终点”之间画一条弧
对于（设j=0；j{
//基于计数器指示将点几何图形更新到新位置
//用于访问arc的索引。
const nextPoint=chunkRoute.features[0]。geometry.coordinates[counter+1]；
if（chunkRoute.features[0].geometry.coordinates[counter]！==未定义）{
const start = point(chunk[0].coordinates);
const end = point(chunk[1].coordinates);
const circle = greatCircle(start, end);

prevState.map.addSource(`Route-line-${i}`, {
    type: 'geojson',
    data: circle,
});